Úkol č. 2 Vytvoření digitálních mockup
prototypů
Odevzdání: 22. 10. 2013, 21:00
Cíl:
A) Vymyslete vaše stanovisko k problému, který řešíte
B) Vytvořte storyboard
C) Vytvořte odděleně dva papírové prototypy
D) Sejděte se a vyberte z prototypů to dobré – zvolte vaše řešení
E) Vytvořte jeden digitální prototyp
Ad A) Vydefinovat si stanovisko k problému je důležitým krokem v rámci celého prototypování.
Konkrétně si tak ujasníte, co je vlastně vaším cílem a k čemu má vaše aplikace/web sloužit. V tomto
bodě vycházejte z vašeho prvního úkolu. Problémy a nápady, které jste vygenerovali v rámci,
brainstormingu, teď určitě využijete. Vyberte si jeden konkrétní problém a zaujměte k němu
stanovisko.
Příklad:
Problém: Po zimě jsou v silnicích vytlučeny díry a často se tak stávají příčinou dopravních nehod.
Stanovisko: Kdyby byly na díry v silnicích upozorňování silničáři, nestávalo by se tolik nehod.
(Alternativní stanovisko: Nehod by se nestávalo tolik, kdyby měli řidiči v chytrých telefonech aplikaci,
která by je díky lokalizaci na nové díry neustále upozorňovala).
Pamatujte si, že na tomto stanovisku k problému budete pracovat celý semestr. Proto si na něm
dejte záležet.
Ad B) Vytvořte storyboard, který bude popisovat kontext situace, kterou díky aplikaci řešíte. Zahrňte
do storyboardu uživatele, místo a situaci, naznačte uživatelovu motivaci – proč konkrétní
aplikaci/web využívá. Ze storyboardu by mělo vyplývat, co může uživatel s aplikací/webem dělat a
jaké jsou funkcionality systému. Nezapomeňte vyzdvihnout spokojenost uživatele po správně
vykonaném sledu kroků, které jej vedou k cíli. Podívejte se na Guide to Storyboard, jistě vás
inspiruje.
Storyboard bude obsahovat 7-9 komiksových okének, používejte fixy a jednoduché zobrazení. Na
detaily budete mít čas celý semestr.
Ad C) Rozdělte se v týmu na dvě skupiny. Každá zpracuje jeden papírový prototyp tak, aby druhá
skupina nevěděla, na čem pracuje. Každý prototyp bude zpracován podobně, jako prototyp
prezentovaný na II. hodině HCI k prototypování. Oba prototypy musí řešit ten samý problém a vaše
stanovisko. Fotky nebo videozáznam obou prototypů nahrajte na YouTube (nebo jinam) a vložte do
blogu na Inflow.
Příklady papírových prototypů:
http://www.youtube.com/watch?v=3fk0uWer6IQ
http://www.youtube.com/watch?v=Bq1rkVTZLtU
Ad D) Po vytvoření obou prototypů se setká celý tým a diskutuje o prototypech. Vydefinujte nejlepší
aspekty obou rozhraní. Shodněte se na budoucím prototypu. Pamatujte si, že když vytváříte dva
prototypy, více využíváte vaše kreativní schopnosti a výsledek pak bude jistě lepší.
Ad E) Prostřednictvím nástroje Axure nebo Balsamiq vytvořte jeden finální prototyp, který vychází
z vaší shody v bodě D.
Balsamiq je licencován asi na 15 dní. Na internetu se však k němu dá najít klíč ;-) – pst! Výsledek
vypadá nějak takto: http://bit.ly/agrochangeprototyp (tohle vytvořili studenti v minulém semestru).
Stručný manuál najdete na webu Balsamiqu. Velice jednoduchý návod je třeba tady:
http://www.youtube.com/watch?v=IrpXjcpCf_k.
V případě nástroje Axure není myšlen prototyp, který jsme připravovali na III. hodině s Janem
Hlaváčem. Ale když budete mít odvahu a chuť, klidně se do něj pusťte. Nicméně i v programu Axure
uděláte podobný prototyp jako v Balsamiqu.
Výsledné klikatelné PDF vložte do Dropboxu a do blogu uveďte odkaz, ze kterého si jej můžeme
všichni stáhnout.
Příspěvek na blogu bude obsahovat:
• Stanovisko k problému
• Fotografie storyboardu
• Fotky, nebo obrázky dvou papírových prototypů.
• Jeden odkaz na digitální prototyp.
Hodnocení
10 – 7b. perfektní zpracování V příspěvku v blogu bude jasně definováno vaše stanovisko
k problému, fotografie storyboardu v 7-9 komiksových
polích, fotky nebo video dvou papírových prototypů a
odkaz na stažení výsledného digitálního prototypu.
Prototyp bude precizně proveden a všechny relevantní
elementy rozhraní funkční. Článek bude napsán čtivou
formou.
6 – 3b. dostatečné zpracování Na blogu bude definováno stanovisko k problému,
fotografie storyboardu v nejméně 4 komiksových polích,
obrázek nebo video jednoho papírového prototypu a
odkaz na stažení digitálního prototypů. Prototypy nemusí
být precizně provedeny a také některé méně významné
prvky designu nemusí být funkční. Článek by měl být čtivě
napsaný.
2 – 0b. nedostatečné
zpracování (nutná oprava do
3 prac. dnů)
Takto hodnocený úkol nedosahuje kvality úkolu
zpracovaného dostatečně.
Tomáš Bouda
boudatomas@gmail.com