1. Uživatel nechce přemýšlet
Bc. Jiří Komár
UX designer a webový analytik
komar@netdevelo.cz
+420 774 729 300
Twitter: @jirikomar
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 1
2. Seznámení se základními pojmy
● UX – uživatelský prožitek
● UI – uživatelské rozhraní
● Usability – použitelnost (neplést s přístupností - Accessibility)
● User testing – uživatelské testování
● Web analytics – webová analytika
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 2
3. UX – uživatelský prožitek
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 3
4. UI – uživatelské rozhraní
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 4
5. Usability – použitelnost
Accessibility - přístupnost
● Jak poznat, že je stránka použitelná?
– Měření Google Analytics, Google Website Optimizer
– Uživatel Vám to rád poví
– Dokonalý web neexistuje
● Weby dělejme pro lidi, ne pro stroje
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 5
6. User testing – uživatelské testování
● Kdy by se mělo testovat?
– wireframe, interaktivní prototypy, design, funkční řešení
● Jak by testování mělo probíhat?
● Co od něj máme očekávat?
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 6
7. Web analytics – webová analytika
● Proč sledujeme webová data?
– Co se na webu děje (sběr, sledodávání, vyhodnocování dat)
– Navrhujeme změny (design stránek, reklamní cílení atd.)
● Nástroje
– Google Analytics, Webtrends, SiteCatalyst atd.
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 7
8. Fáze navrhování webu
● Analýza webu
– Kvalitativní průzkum
– Kvantitativní průzkum
● Štítkování
● Skicování
● Tvorba wireframe
● Tvorba interaktivních prototypů
● Uživatelské testování
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 8
9. Fáze navrhování webu
Analýza webu a potřeb uživatelů
● Kvalitativní průzkum
● Kvantitativní průzkum
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 9
10. Fáze navrhování webu
Kvalitativní průzkum
● Etnografický rozhovor
● Hloubkové rozhovory a focus groups
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 10
11. Fáze navrhování webu
Kvantitativní průzkum
● Ankety
● Dotazníky
● Hodnocení
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 11
12. Fáze navrhování webu
Štítkování
● Co to je?
● Proč to děláme?
● Nástroje: tužka, malé papírky, nůžky, tabule
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 12
13. Fáze navrhování webu
Skicování
● Skicy jsou levné
● Skicy jsou rychlé
● Skicy jsou dobrý základ pro wireframe
● Nástroje: tužka a dostatek papíru
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 13
14. Fáze navrhování webu
Tvorba wireframe
● Šetří čas zadavateli a vývojářům
● Popisuje prvky a chování webu
● Nástroje: Axure RP, WireframeSketcher,
Online nástroje: Balsamiq, Iplotz, Cacoo
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 14
15. Fáze navrhování webu
Tvorba interaktivních prototypů
● Pokud je wireframe málo
● Můžeme zapojit uživatele nebo A/B testování
● Nástroje: Axure RP, Balsamiq
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 15
17. Fáze navrhování webu
Uživatelské testování
● Testujme pravidelně
● Typy testování
– Teplotní mapy, nahrávání obrazovky, A/B testování
– Vzdálené testování
– Moderované uživatelské testování
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 17
18. Teplotní mapy (heatmap)
Nástroje: mYx, Crazyegg, Clicktale
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 18
19. A/B testování
Nástroje: Google Website Optimizer
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 19
20. Moderované uživatelské testování
● Do testu vybíráme obyčejné uživatele, ne pracovníky firmy
● Testujeme na 3-6 uživatelích
● Před testem sestavíme scénář uživatelského testování
● Při testu nutíme uživatele uvažovat nahlas
● Testování nahráváme nebo si děláme poznámky
● Z poznámek vypracujeme výstupní analýzu, tu předáme k dalšímu
zpracování
netdeveo s.r.o. - profesionální iternetové aplikace a e-shopy Stránka: 20