Chcesz zaoferować swoim uczestnikom głębsze, bogatsze doświadczenia? Twórz projekty oparte na kodzie bezpośrednio w Rise 360 z blokiem kodu. Twórz interaktywne narzędzia i wersje demonstracyjne za pomocą edytora kodu w aplikacji lub przesyłaj własne ukończone projekty. Nie wiesz, od czego zacząć? Sprawdź to szkolenie, aby uzyskać inspirację, lub czytaj dalej, aby spróbować samodzielnie.

1. Wstawianie bloku kodu
2. Modyfikowanie ustawień bloku
3. Dostępność i znane problemy

Uwaga: Bloki kodu mogą korzystać tylko z zasobów dostępnych w samym bloku, a to, co jest napisane, wpływa tylko na środowisko tego bloku. Kod napisany w HTML, CSS i JavaScript działa najlepiej w przypadku niestandardowych bloków kodu.

Krok 1: Wstaw blok kodu

1. Otwórz kurs Rise 360, a następnie edytuj istniejącą lekcję lub utwórz nową.
2. Wybierz opcję Wszystkie bloki z paska skrótów bloków. Lub kliknij ikonę wstawiania bloku (+), która pojawia się po najechaniu kursorem myszy na obwiednię między blokami.
3. Z paska bocznego wybierz kategorię Kod.
4. Wybierz opcję w zależności od sposobu skompilowania projektu kodu.
   • Kliknij Dodaj kod, aby bezpośrednio wprowadzić i edytować kod. Zmiany, które wprowadzasz, są odzwierciedlane w czasie rzeczywistym.
   • Kliknij przycisk Prześlij projekt, aby przesłać plik ZIP spełniający następujące kryteria:
     • Zawiera podstawowy plik projektu o nazwie index.html zawierający kod projektu. Nie można go nazwać niczym innym. Ten plik nie może znajdować się w folderze i musi znajdować się na poziomie głównym pliku
     • Zawiera wszystkie zasoby projektu, w tym pliki źródłowe, takie jak obrazy
     • Nie jest większy niż 5 GB
5. Po wyświetleniu bloku kliknij przycisk akcji lub najedź kursorem na blok, aby uzyskać dostęp do lewego paska narzędzi projektowania. Następnie kliknij ikonę Zawartość. Na pasku bocznym dodaj kod lub prześlij swój spakowany projekt.
   • W bloku Dodaj kod użyj ikon wyszukiwania/zastępowania, kopiowania i usuwania, aby szybko wprowadzić zmiany w całym bloku kodu.
   • W bloku Prześlij projekt użyj ikona usuwania, aby usunąć aktualnie przesłany plik ZIP.

Twój projekt zostanie uruchomiony natychmiast po dodaniu do Rise 360.

Uwaga: Bloki kodu zawarte w szkoleniu opublikowanym dla LMS lub eksportu internetowego nie mogą być przeglądane lokalnie, ale będą wyświetlane zgodnie z oczekiwaniami po przesłaniu ich do hosta szkolenia.

Parametry ukończenia

Aby upewnić się, że uczestnicy wykonają działanie bloku kodu przed kontynuowaniem, ustaw parametry ukończenia bloku kodu. Po wykonaniu następujących kroków kontynuuj bloki rozpoznają, kiedy uczestnicy ukończyli ćwiczenie w bloku.

1. Edytuj zawartość istniejącego bloku kodu lub dodaj nowy blok.
2. Włącz przełącznik Ustaw wymagania dotyczące ukończenia.
3. Skopiuj fragment kodu, który wyświetla się: window.parent.postMessage ({type: 'complete'}, '*');
4. Wklej kod do okna kodu lub do istniejącego projektu. W przypadku istniejących bloków projektu przesyłania należy ponownie zaimportować projekt po dodaniu fragmentu kodu zakończenia.

To jest to! Teraz bloki kontynuacji Rise 360 rozpoznają, kiedy aktywność bloku kodu została zakończona.

Uwaga: Aktywacja przełącznika ukończenia i włączenie bloku kontynuacji opartego na ukończeniu bez uwzględniania fragmentu kodu w projekcie uniemożliwi uczestnikom kontynuowanie szkolenia.

Galeria inspiracji

Oba bloki mają dostęp jednym kliknięciem do naszego kursu instruktażowego z przykładowymi projektami. Spójrz i zobacz, co jest możliwe, a następnie zbuduj własny na podstawie dostarczonego kodu i zasobów! Po prostu kliknij przycisk Potrzebujesz pomocy, aby rozpocząć? przycisk, aby to sprawdzić.

Kodowanie Vibe

Jeśli używasz LLM innej firmy do generowania kodu (znanego również jako „kodowanie wibracji”), użyj następującego szablonu jako monitu, aby zapewnić lepszą kompatybilność z Rise 360. Zastąp tekst w nawiasach kwadratowych własną treścią.

1. Utwórz plik `index.html`, który może zawierać HTML, CSS i JavaScript i nie zawiera zewnętrznych żądań internetowych

2. <iframe>Ten plik `index.html` zostanie użyty wewnątrz ``

3. W pliku `index.html` utwórz [opisz swój projekt], nadaj mu przezroczyste tło

4. Zakoduj, że raz [opisz parametry ukończenia], aplikacja powinna wywołać `window.parent.postMessage ({type: 'complete'}, '*'); `, aby okno nadrzędne wiedziało, że interakcja została zakończona

Krok 2: Zmodyfikuj ustawienia bloku

Zmodyfikuj wygląd zawartości na ekranie, najeżdżając kursorem na istniejący blok, aby uzyskać dostęp do lewego paska narzędzi projektowania. Kliknij ikonę Styl, aby uzyskać dostęp do opcji tła bloku. Menu Format zawiera opcje zmiany wypełnienia bloku, szerokości zawartości i maksymalnej wysokości bloku.

Dostępność i znane problemy

Dostępność

Dostępność bloku kodu zależy od dostępności kodu HTML, który zawiera. Zapoznaj się z tymi wskazówkami, jak udostępnić blok kodu:

• Napisz kod zgodny ze standardami WCAG 2.2.
• Używaj semantycznego HTML, gdy tylko jest to możliwe. Zapewnia wbudowaną dostępność i zmniejsza potrzebę niestandardowego kodu.
• Użyj czytników ekranu, nawigacji za pomocą klawiatury i funkcji powiększania, aby przetestować swój kurs. Dokładnie sprawdź, czy uczestnicy mogą śledzić aktualizacje i mieć wystarczająco dużo czasu na odpowiadanie lub przeglądanie treści.

Użyj wtyczki do sprawdzania dostępności, takiej jak axe DevTools dostarczonej przez Deque lub narzędzie do sprawdzania dostępności Wave, aby zweryfikować swój kod.

Szukasz więcej wskazówek dotyczących projektowania ułatwień dostępu? Sprawdź następujące zasoby:

• Rise 360: Jak zaprojektować dostępny kurs
• Indeks dostępności

Znane problemy

Obecnie bloki kodu mają następujące znane problemy:

• Publikowanie szkolenia w formacie PDF nie powoduje indywidualnej reprodukcji zawartości bloku kodu.
• Articulate Localization nie jest obecnie obsługiwana dla bloków kodu. Bloki kodu również nie mogą być tłumaczone za pomocą ręcznego tłumaczenia XLIFF. Aby przetłumaczyć bloki kodu, musisz ręcznie wstawić bloki kodu specyficzne dla języka po tłumaczeniu.