Hogyan építettem ezt az egészséges étel játékot Drag-and-Drop segítségével

Tanfolyamtervezőként mindig egészséges tippeket vásárolok, amelyek segítenek az erősebb e-learning tanfolyamok felépítésében. Néha tudom, hogy éppen mit keresek; máskor meglátok egy tippet, amiről nem is tudtam, hogy szükségem van rá, és aztán kíváncsi vagyok, hogy tudtam valaha is boldogulni anélkül.

Ha olyan piacon jársz, ahol felpörgetheted a dizájnt és lecsökkentheted a fejlesztési időt, vagy csak kedved támad böngészni, akkor ebben az interaktív játékban biztosan megtalálsz néhány ízletes e-learning jóságot. Járjuk végig a projekt által nyújtott tervezési és fejlesztési döntéseket.

Minden egy üres csúszdával kezdődik

Az egyik munkafolyamat, amelyet az Articulate Storyline-ban értékelek a legjobban, az a képesség, hogy üres lemezes diáról dolgozzak. Üres diából történő munkavégzés azt jelenti, hogy nem korlátoznak sablonok vagy űrlapok - megtervezi a kívánt elrendezést, majd az objektumokat interakcióvá alakítja.

Ebben a példában a Storyline Drag and Drop Freeform diájával dolgoztam.

A háttérgrafika tartalmazta a lemezt és az evőeszközöket, ezért hozzá kellett adnom egy hotspot objektumot a lemez területéhez. Ez jól sikerült, mert nem kellett aggódnom a tárgyamon lévő több objektum miatt, mivel a háttérgrafikámban mindegyik lapos volt.

A dia kialakítása

Azt akartam, hogy a tanulók úgy érezzék, mintha egy asztalnál ülnének és válogatnának ételeket. Játszottam számos étteremmel készült fotóval, amelyeket háttérelemként használhattam.

Enyhe elmosódást és zajt adtam a háttérbe, hogy csökkentse a fókuszt és hangsúlyozza az előtér elemeit, ahol a tanuló helyet foglal.

Az egyik kihívás, amellyel találkoztam, az éttermi fotók megtalálása, amelyek igazodtak az elsődleges asztalhoz. Mivel az előtérben fehér terítő volt, kissé helytelennek tűnt fa vagy fém felületű asztalok fotóinak használata.

Egyedi ételgrafika

Egy dolog, ami nagyon tetszik ebben a példában, az az élelmiszer-elemek egyedi rollover hatásai.

Az objektumok normál állapota felülről lefelé néző perspektíva. Ez a perspektíva elölnézetbe fordul, amikor a tanuló az ételelemeket a tányérra húzza.

A Storyline beépített Drag Over állapota ezt igazán egyszerűvé teszi. A kihívás az élelmiszer-elemek oldal- és felülnézetének megtalálása volt. Ez eltartott egy ideig, de a végső hatás megérte.

Egy dolgot másképp csinálnék, ha a képeket azonos méretben hoznám létre. Sokkal könnyebb kezelni a méretet és a pozíciót, ha az összes állapot azonos méretű.

Referenciaváltozókkal való munka

A kalória és az évfolyam pontszámának beállítása egyszerű volt. Minden élelmiszerhez számértéket rendeltek. Amikor az objektumot az asztalra helyezték, a Storyline hozzáadta a numerikus értéket a változó kalóriához. Amikor az ételt eltávolították a táblázatból, a Storyline kivonta ugyanazt a numerikus értéket.

Az osztályzat hozzárendeléséhez egy szöveges változót használtam fokozat. Minden lehetséges betűosztályhoz egy ravaszt használtam, és elmondtam a Storyline-nak, hogy mutasson egy osztályzatot a teljes kalóriaszám alapján. Az osztályzat valós időben frissül, így a tanuló azonnali visszajelzést kap.

Végül változó hivatkozásokat használtam a kalóriák és az évfolyam megjelenítésére. Ha megnézi a dián található hivatkozásokat, azok rendetlenek és a tartalomhoz nem igazodnak. Ez azért van, mert a két százalékos jel és a változó neve hosszabb, mint a tényleges megjelenített szám és fokozat.

Néhány előnézet és a szövegdoboz mozgatása kellett ahhoz, hogy a dolgok tökéletesen felsorakozhassanak.

Remek kis trükk a referenciaváltozó és a di tartalom összehangolásához, ha a hivatkozást középre igazítja, és a szövegdoboz fogantyúival irányítja az igazítást.

Ennek egyik módja a rövidebb változónevek használata. Például a kalória változó referenciája as % kalória% a csúszdán. Megnevezhettem volna a változót cal, amelyet könnyebb lett volna megjeleníteni és elrendezni a dián.

Úgy döntöttem, hogy hosszabb változónevekkel megyek, hogy értelmesebbek maradjanak. A referenciadobozok előnézete és a helyükre bökése nem sok időt vesz igénybe, ezért jól állok ezzel a megközelítéssel. Próbálja ki mindkétféleképpen, és döntse el maga, melyik módszer működik a legjobban.

Visszajelzési grafika készítése

A tervezési feltérképezés során azonosítottam az általános éttermi és vendéglátóipari elemeket, köztük terítékeket, szalvétákat, foglalási kártyákat és menüket.

A foglalási tábla jól működik, mert ez egy hordozható tábla, amely testre szabható a helyes és helytelen visszacsatolási diákhoz.

Következő lépések

Ez a projekt kissé előrehaladott, de ez nem jelenti azt, hogy a kezdők nem vehetnek fel hasznos tervezési és gyártási tippeket. A bonyolult projektek kidolgozásának kulcsa az, hogy kisebb darabokra bontsa őket.

Ennek a projektnek egy video oktató sorozatán dolgozom. A következő néhány hétben el kell készülnie, és amikor ez megtörténik, frissítem ezt a bejegyzést, hogy tartalmazzon linkeket a sorozatra. Addig is forduljon hozzám bizalommal a projekttel kapcsolatos kérdéseivel kapcsolatban.