HEURISTICKÁ ANALÝZA KONKRÉTNÍ PŘÍKLADY TOMÁŠ BOUDA KISK 2013 KOMUNIKACE ČLOVĚK-POČÍTAČ 10 PRINCIPŮ POUŽITELNOSTI PODLE NIELSENA (HEURISTIKY) •Viditelnost stavu systému •Spojení mezi systémem a reálným světem •Uživatelská kontrola a svoboda •Konzistence a standardizace •Prevence chyb •Rozpoznání místo vzpomínání •Flexibilní a efektivní použití •Estetický a minimalistický •Pomoc uživatelů poznat, pochopit a vzpamatovat se z chyb •Nápověda a návody Zdroj: NIELSEN: http://www.nngroup.com/articles/ten-usability-heuristics/ Tomáš Bouda HCI na KISK 1.Viditelnost stavu systému – systém by měl vždy dát uživateli vědět co se právě odehrává 2.Spojení mezi systémem a reálným světem – komunikace systému s uživatelem by se měla odehrávat uživatelsky příjemným způsobem (srozumitelný jazyk bez odborných termínů) 3.Uživatelská kontrola a svoboda – uživatelé při práci se systémem dělají chyby a potřebují proto únikový východ pro návrat do předchozího stavu. 4.Konzistence a standardizace – uživatelé by neměli být nuceni přemýšlet jestli různé termíny znamenají to stejné, proto se doporučuje dodržovat obecné zásady. 5.Prevence chyb – vyvarovat se chybovým hlášením bezpečným designem, který bude preventivně působit proti problémům 6.Rozpoznání místo vzpomínání – uživatel by neměl být nucen vzpomínat si na provádění operací v systému, instrukce by měly být v systému vždy viditelně umístěny 7.Flexibilní a efektivní použití – umožnění zrychlení práce se systém pro pokročilé uživatele 8.Estetický a minimalistický design – bez nepotřebných informací 9.Pomoc uživatelů poznat, pochopit a vzpamatovat se z chyb – chybové hlášky by měly být uváděny v přirozeném jazyce a měly by navrhovat řešení 10.Nápověda a návody – všechny informace se musí dát lehce vyhledat, nápověda by měla obsahovat postupy v krocích 1. VIDITELNOST STAVU SYSTÉMU – UKAZATEL ČASU •Pokrok/progres při instalaci 1. VIDITELNOST STAVU SYSTÉMU – DOBRÁ PRAXE < 1s. pouze ukázat výsledek ~ 1s. ukázat feedback, že systém něco dělá > 1s. ukázat čas, za který bude proces dokončen nebo stav načítání 1. VIDITELNOST STAVU SYSTÉMU – UKAZOVÁNÍ MÍSTA Ukažte, kolik místa ještě zbývá. 1. VIDITELNOST STAVU SYSTÉMU – UKAŽTE ZMĚNU 1. VIDITELNOST STAVU SYSTÉMU – UKAŽTE AKCI Jakým směrem bude akce probíhat? Na semaforu je to jasné, odshora dolů. 1. VIDITELNOST STAVU SYSTÉMU – CO BUDE NÁSLEDOVAT 1. VIDITELNOST STAVU SYSTÉMU – UKAŽ, ŽE JE VŠE ZDÁRNĚ U KONCE 2. SPOJENÍ MEZI SYSTÉMEM A REÁLNÝM SVĚTEM Snažíme se vytvořit systém, který funguje tak, jak je uživatel zvyklý z reálného světa. 2. SPOJENÍ MEZI SYSTÉMEM A REÁLNÝM SVĚTEM – DŮVĚRNĚ ZNÁMÉ METAFORY 2. SPOJENÍ MEZI SYSTÉMEM A REÁLNÝM SVĚTEM – DŮVĚRNĚ ZNÁMÉ METAFORY 2. SPOJENÍ MEZI SYSTÉMEM A REÁLNÝM SVĚTEM – DŮVĚRNÝ JAZYK •Mluvte jazykem uživatele • •Vysvětlujte jasně a stručně. • •Používejte běžné a známé klasifikace. SPOJENÍ MEZI SYSTÉMEM A REÁLNÝM SVĚTEM – DŮVĚRNÝ JAZYK 2. SPOJENÍ MEZI SYSTÉMEM A REÁLNÝM SVĚTEM – DŮVĚRNÉ VOLBY Co se stane? Jaké funkce? Co nebude fungovat? 3. KONTROLA A SVOBODA •Exist/Undo/Zpět/Ctrl+z • • 3. KONTROLA A SVOBODA - VOLNOST ZKOUMÁNÍ - FREEDOM TO EXPLORE •Matrix Airfare Search http://matrix.itasoftware.com/search.htm 4. KONZISTENCE A STANDARDY •konzistentní rozvržení elementů na uživatelském rozhraní 4. KONZISTENCE A STANDARDY •konzistentní názvy, jména, labely - používej uživatelův slovník a terminologii!!! • • • 4. KONZISTENCE A STANDARDY - KONZISTENCE VOLBY Second Life Help • 4. KONZISTENCE A STANDARDY - KONZISTENCE VOLBY – CONTINUE/CANCEL 4. KONZISTENCE A STANDARDY - KONZISTENCE VOLBY 5. PREVENCE CHYB – PREVENCE PŘED ZTRÁTOU DAT Jaký to je soubor? Pomohlo by malé preview. 5. PREVENCE CHYB – PREVENCE PŘED ZMATKEM 5. PREVENCE CHYB – PREVENCE PŘED MATOUCÍM PROVOZEM 5. PREVENCE CHYB – PREVENCE PŘED VKLÁDÁNÍM CHYBNÝCH DAT 5. PREVENCE CHYB – PREVENCE PŘED VKLÁDÁNÍM CHYBNÝCH DAT 5. PREVENCE CHYB – PREVENCE PŘED ZBYTEČNÝMI PŘEKÁŽKAMI Není lepší mít jedno políčko a rovnou vyhledávat, abychom dostali alespoň nějaké výsledky? 6. ROZPOZNÁVÁNÍ MÍSTO VZPOMÍNÁNÍ – VYHNĚTE SE KÓDŮM 6. ROZPOZNÁVÁNÍ MÍSTO VZPOMÍNÁNÍ Rozpoznávání - vyhýbání se překážkám navíc, kde se musí uživatel znovu rozhodovat. Řešení: proklik rovnou na vyhledávání v programu. 6. ROZPOZNÁVÁNÍ MÍSTO VZPOMÍNÁNÍ Rozpoznávání díky preview. Řešení: proklik rovnou na vyhledávání v programu. 7. FLEXIBILITA A EFEKTIVITA – FLEXIBILNÍ ZKRATKY Flexibilní zkratky 7. FLEXIBILITA A EFEKTIVITA – FLEXIBILNÍ ZKRATKY Flexibilní zkratky 7. FLEXIBILITA A EFEKTIVITA – FLEXIBILNÍ PŘEDNASTAVENÍ A DALŠÍ MOŽNOSTI 7. FLEXIBILITA A EFEKTIVITA – FLEXIBILITA DOPLŇUJÍCÍCH INFORMACÍ 7. FLEXIBILITA A EFEKTIVITA – FLEXIBILITA PROAKTIVITY Pozor na proaktivní systém, který však nabízí nepřesné, neúplné, nepravdivé nebo nerelevantní informace. 7. FLEXIBILITA A EFEKTIVITA – FLEXIBILNÍ DOPORUČOVÁNÍ 7. FLEXIBILITA A EFEKTIVITA •Flexibilita musí být relevantní • Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 8. ESTETICKÝ A MINIMALISTICKÝ DESIGN Důležité informace na prvním místě. Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 8. ESTETICKÝ A MINIMALISTICKÝ DESIGN Méně barev je někdy více. Barvy fungují jako návod. Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 8. ESTETICKÝ A MINIMALISTICKÝ DESIGN Odstranění balastu a nepotřebných informací a objektů. Nápovědy: Remember the milk: http://www.rememberthemilk.com/help/ Dropbox: https://www.dropbox.com/help Google mail: https://support.google.com/mail Adobe reader: http://helpx.adobe.com/reader.html Axure: http://www.axure.com/support eReading: http://www.ereading.cz/cs/jak-nakupovat Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 8. ESTETICKÝ A MINIMALISTICKÝ DESIGN Login I want my name: https://iwantmyname.com/signin LinkedIn: http://cz.linkedin.com/ Twitter: https://twitter.com/ Google: https://accounts.google.com/ UPC: https://my.upc.cz/cz/StartPage.aspx Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 8. ESTETICKÝ A MINIMALISTICKÝ DESIGN American Airlines fly search Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Výhoda jasných chyb – jaký je problém? Jaké je řešení? Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Chyby by měly poskytovat řešení – např. co bych mohl vymazat? Jaké soubory nepoužívám? Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Chyby by měly ukazovat, co lze udělat jiného. - neexistuje v PC podobný dokument? Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Chyby by měly být následovány nabídkou jiné možnosti. Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Chyby by měly být následovány nabídkou jiné možnosti. Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Jak to, že Mall nenabízí jiné možnosti? Nemohu mít zakrytá tlačítka, která prostě potřebuji používat. 9.ROZPOZNÁNÍ, POCHOPENÍ A VZPAMATOVÁNÍ SE Z CHYB Předcházejte chybám. 10. HELP Výhoda online pomoci. Je mnohem lépe provázána se samotným systémem. Diskuse k programování: http://www.dreamincode.net/forums/topic/274639-android-actionbar-tutorial/ Video tutoriály: http://www.youtube.com/watch?v=eFZVpCSRpeI 10. HELP Pomoc s rozhodováním prostřednictvím příkladů. 10. HELP Nápověda, co by bylo nejlepší udělat (help guide the way). 10. HELP Nápověda dalšího kroku (Help show the steps). 10. HELP Upozornění na maličkosti. 10. HELP Poskytování více informací. http://email-vspenvision.com/unsubscribe.jsp?i=571506162472&s=ZiR1 10. HELP - MOBILE DĚKUJI ZA POZORNOST TOMÁŠ BOUDA BOUDATOMAS@GMAIL.COM KISK 2013 KOMUNIKACE ČLOVĚK-POČÍTAČ