Druhý (HTML) prototyp (12. týždeň)
Ako odovzdať
Odovzdávajte do formulára prostredníctvom systému Moodle, Zadanie časť 3.
Podmienky:
- Potrebné odovzdať: 1 odkaz na projekt FigJam prostredníctvom formulára
- Termín: pred začatím 13. cvičenia
Obsah
- Odkaz na nový FigJam projekt s názvom UX 3 {Priezvisko} {Meno}.
- Musí viesť k otvoreniu vášho FigJam projektu v sekcii, kde sa nachádza obsah vytvorený vo fáze 2. prototypovania a používateľského testovania.
- Musí obsahovať obrázky webového prototypu a odkaz na GIT projekt.
- Musí obsahovať odkaz na max 3 min video s ukážkou používania (vyklikanie scenára) a plnej responzivity.
- Vybrané videá budú na konci semestra publikované na sociálnych sieťach katedry, nastavte ich teda prosím ako verejné.
Požiadavky na projekt FigJam
FigJam projekt by mal obsahovať všetko, čo predch. verzia a naviac sekciu „2. Prototyp“, v ktorej sa majú nachádzať rovnaké časti, ako v Zadaní – časť 2, no tentokrát s druhým prototypom, pričom používateľské testovanie je dobrovoľné. Ak ste ho robili, potom vo FigJam porovnajte výsledok SUS z oboch testovaní.
Požiadavky na Prototyp
- Realizácia prototypu 2 vo forme súborov HTML a CSS, a prípadných obrázkov a/alebo kódu v jazyku JavaScript.
- komponentová štruktúra - použitie webového rámca a existujúcej knižnice komponentov je výhodou,
- prototyp musí umožniť vyklikať aspoň jeden scenár (ak má menej ako 5 krokov, potom 2-3 scenáre),
- prototyp musí byť
- responzívny (podporovať rôzne veľkosti obrazoviek),
- prístupný,
- mať vhodnú štruktúru celého kódu zodpovedajúcu štruktúre Figma prototypu.
- konzistentne používa dizajnový systém
- Prototyp môže obsahovať simulované lokálne dáta a simulovanú funkcionalitu, nepotrebuje zatiaľ databázu ani backend,
- Interaktivita môže byť obmedzená iba na prechod medzi stránkami/stavmi po kliknutí na odkaz alebo tlačidlo, vítané je použitie routera.
Poznámka
Nie je potrebné vytvárať dizajnový skvost, radšej sa sústreďte na konzistentné používanie dizajnového jazyka. Štýlujte len to, čo musíte a vytvárajte len tie komponenty, ktoré knižnica nemá. Pekne naštýlované zadanie je úloha nad rámec základného zadania.
Upozornenie
Akýkoľvek rámec postavený na jazyku JavaScript (React, Angular, ...) je pre implementáciu druhého prototypu vítaný, no kód nahrajte na GIT bez adresára node_modules
, prípadne iných štruktúr automaticky stiahnutých alebo generovaných projektom (napr. NazovProjektu.iml
, .idea
).