Testování Uživatelského Rozhraní (A4B39TUR) Úloha A2 Testování prohlížeče Maxthon 4.4.7 Kognitivní průchod a heuristická evaluace Vypracovala: Lunova Anastasiia (lunovana@fel.cvut.cz) ČVUT FEL ZS 2015/2016
OBSAH 1. ÚVOD 3 1.1. POPIS PŘEDMĚTU TESTOVÁNÍ 3 1.2. POPIS CÍLOVÉ SKUPINY 4 1.3. TESTOVANÉ USE CASES 4 2. METODY TESTOVÁNÍ BEZ UŽIVATELŮ 5 2.1. POPIS METODY TESTOVÁNÍ KOGNITIVNÍM PRŮCHODEM 5 2.2. POPIS METODY TESTOVÁNÍ HEURISTICKOU EVALUACÍ 6 3. TESTOVÁNÍ USE CASES 7 3.1. TESTOVÁNÍ USE CASE 1 - ZMĚNA DOMOVSKÉ STRÁNKY 7 A. Kognitivní průchod 7 B. Heuristická evaluace 9 3.2. TESTOVÁNÍ USE CASE 2 ZMĚNA SKINU 9 A. Kognitivní průchod 9 B. Heuristická evaluace 11 3.3. TESTOVÁNÍ USE CASE 3 SMAZÁNÍ HISTORII PO POSLEDNÍM SURFOVÁNÍ 11 A. Kognitivní průchod 11 B. Heuristická evaluace 16 3.4. TESTOVÁNÍ USE CASE 4 - NASTAVENÍ PLUGINU 16 A. Kognitivní průchod 16 B. Heuristická evaluace 19 3.5. PŘEHLED NÁLEZŮ 20 4. ZÁVĚR 21 2 / 21
1. ÚVOD 1.1. POPIS PŘEDMĚTU TESTOVÁNÍ Cílem semestrálního projektu je testování Internetového prohlířeče Maxthon verzí 4.4.7. Je zdarma a volně dostupný z oficiální stránky http://www.maxthon.com/?lang Obrázek 1 Oficiální stránka Maxthon Maxthon je alternativní prohlížeč s dvěma jádry: původně postaveným Trident a pozděje přidaným WebKit (který je taky základem pro Safari a Google Chrome), mezi kterými se dovolí přepínat. Je open-source, multiplatformní a od roku 2010 je dostupný i v mobilních verzích pro operační systémy Android, ios, WindowsPhone a Amazon Kindle Fire. Oficiální úplný název je Cloud Browser Maxthon a sloganem je: Otevírá cestu do cloludu. To znamená, že všechna vaše data vždy budete mít po ruce a na všech zařízeních s prohlížeči se stejnými jádry. 3 / 21
1.2. POPIS CÍLOVÉ SKUPINY A7B39TUR 2015/2016 Cílovou skupinu může tvořit kdokoli, kdo má dostatečný věk pro ovládání webových stránek a používá internet. Jinak na pohlaví, národnosti a předmětu činnosti nezáleží. Mezitím alternativními a méně rošíčenými varianty se spíš budou zabývat ti, kteří hledají slušnou a méně náročnou na CPU náhradu známým prohlížečům a zároveň často surfuji na různých zařízeních a platformách (protože by byli přilákaní zárukou zachovalostí dat). Proto většinou to pravděpodobně budou studenti, businessmani, žurnalisti, lidí, kteří mnoho cestují nebo prostě mají notebook s malým objemem RAM. 1.3. TESTOVANÉ USE CASES Níž uvedené use cases byly vybrané protože jsou buď dost často prováděnými operací nebo běžnými úpravami, proto maji být jednoduché a intuitivně zvladatelné a to jsou důvody proč se testují. 1. Změna domovské stránky Často nejprvnější co uživatel upraví po nainstalování prohlížeče neboť obyčejně od začátku domovská stránka představuje sebou oficiální stránku tohoto prohlížeče nebo nějaký neznámý web. Pro uživatele je ale komfortnější když tam bude mít svou oblíbenou variantu. 2. Změna skinu Taky dost populární úprava. 3. Smazání historii po posledním surfování Odstranění záznamů o surfování je důležitou a mnohokým často používanou akcí, takže má být po ruce a fungovat korektně. 4. Nastavení pluginu: najít a dodat Jakým by dokonalým nebyl prohlížeč stejně dříve nebo později bude potřebovat nějaké rošířeni. Takže by se chtělo zkontrolovat pohodlí vyhledávání, jestli se dá najít to, co uživatel chce a srozumitelnost v postupu přídávaní resp. odebírání pluginů. 4 / 21
2. METODY TESTOVÁNÍ BEZ UŽIVATELŮ 2.1. POPIS METODY TESTOVÁNÍ KOGNITIVNÍM PRŮCHODEM Kognitivní průchod je metoda testování uživatelského rozhraní, která má za cíl ověřit srozumitelnost interfacu a úroveň jeho intuitivního ovládání novými uživateli. Spočívá v průchodu předem připravenými úkoly, které jsou zformované z vybraných případů běžného užití, tj. se klade otázka: Q0: Čeho chce uživatel dosáhnout? Každý s takových úkolů je složen z několika dalších kroků. Procházející těmi kroky tester zjišťuje odpovědi ve stylu ano / ne na následující otázky: Q1: Je následující krok pro uživatele zřejmý? Q2: Spojí si uživatel popisek akce s jeho cílem? Q3: Dostane uživatel dostatečnou zpětnou vazbu? V případě záporné odpovědi musí se uvést důvod a tedy jde o nález. Každý nález má svou prioritu, určující míru nespokojenosti s dotyčnou vadou: o Nejvyšší priorita vadou je nutné opravit neodkladně, jinak aplikace nebude vůbec fungovat; o Vyšší priorita aby aplikace fungovala na dobré úrovni je potřeba opravit nalezenou závadu; o Střední celkem je všechno dobře, ale jestli napravit bude ještě líp; o Nízká nějaká drobnost, která nevadí v běžném užití a tedy i nemusí být opravená. Ke každému nálezu v závěru by měla být nabídnuta varianta opravy. 5 / 21
2.2. POPIS METODY TESTOVÁNÍ HEURISTICKOU EVALUACÍ Heuristická evaluace je metoda testování uživatelských rozhraní, zaměřená na zjištění jestli rozhraní odpovídá doporučením ohledně použitelnosti (heuristikám): H1: Viditelnost stavu systému Systém informuje uživatele o tom co právě dělá Odezva by měla být poskytnuta v rozumném čase H2: Shoda systému a reálného světa Systém využívá termíny z jazyka uživatele (cílové skupiny) H3: Uživatelská kontrola a svoboda Uživatel by měl mít možnost vrátit ze zpět z chybných stavů H4: Konzistence a standardy Dodržování zvyků a standardů dané platformy H5: Prevence chyb Eliminace stavů náchylných na chybu Potvrzování akcí H6: Rozpoznávání místo vzpomínání Zobrazení relevantních objektů a akcí Nepožadovat po uživateli zapamatování informací H7: Flexibilita a efektivnost použití Poskytnutí klávesových zkratek Uspokojit začínající i pokročilé uživatele H8: Estetika a minimalizmus Zobrazovat pouze relevantní informace H9: Pomoc uživatelům pochopit, poznat a vzpamatovat se z chyb Chybové hlášení ve srozumitelném jazyce Konstruktivní návrh řešení H10: Nápověda a dokumentace minimální a jednoduše prohledávatelná Výsledkem takového testování je seznam problémů, které podle subjektivního dojmu testeru porušují design uživatelského rozhraní. 6 / 21
A7B39TUR 2015/2016 3. TESTOVÁNÍ USE CASES 3.1. TESTOVÁNÍ USE CASE 1 - ZMĚNA DOMOVSKÉ STRÁNKY Jako domovská stránka je defoltně nastavená vlastní stránka prohlížeče. Dejme tomu, že by se chtělo změnit ji na jinou podle svého přání. Obrázek 2 Domovská stránka prohlížeče: http://i.maxthon.com/en-us.htm A. Kognitivní průchod Q0: Uživatel chce změnit domovskou stránku na google.com Krok 1: V prohlížeči otevřít menu Settings. Obrázek 3 Nalezení menu Settings 7 / 21
Krok 1 ANO ANO ANO Je zřejmě, že veškerá nastaveni má hledat v menu. Menu se značí standardní značkou, proto je snadné ji najít; Po zmačknutí na značku Settings otevřelo se příslušné okno. položku Settings je vidět okamžitě. Nález - - - Krok 2: V záložce General nastavit web stránku, kterou by uživatel chtěl mít jako domovskou - v našem případě www.google.com. Je ale pohodlně, že Maxthon má v sobě sadu nejpravděpodobnějších stránek na role domovské, takže postup se ještě víc zjednoduší, protože jediné co má uživatel udělat je to vybrat si ze seznamu vhodnou variantu. Obrázek 4 Výběr žádané stránky Krok 2 ANO ANO ANO Chce změnit adresu Homepage. Nutný odstavec je vidět najednou a není nic matoucího jenom název a adresa. Nález - - - Rychle a jednoduše nastaveni je hotovo. 8 / 21
B. Heuristická evaluace Podle mého názoru jsou splněné: H6: Rozpoznání místo vzpomínání protože všechno je zřejmé a snadné se hledá; H9: Pomoc uživatelům pochopit, poznat a vzpamatovat se z chyb za prvé souvisí s H6 a za druhé Maxthon má hotový seznam nejpravděpodobnějších stránek-kandidátů na role domovské stránky už s adresy, takže je to možná nějaká prevence chyb. 3.2. TESTOVÁNÍ USE CASE 2 ZMĚNA SKINU A. Kognitivní průchod Q0: Uživatel chce změnit vnějšek okna prohlížeče. Krok 1: V menu Settings najít bod Skins. Obrázek 5 Nalezení nastavení skinů 9 / 21
Krok 1 ANO ANO ANO Chce změnit vzhled prohlížeče. Je zřejmé, že jakékoli nastavení se dá vyhledat Otevřelo se okno výběru barev a obrázku pozadí. v menu. Nález - - - Krok 2: Výběr nejhezčího (podle uživatele samozřejmě) skinu. Obrázek 6 Výběr skinu Krok 2 ANO NE ANO Chce změnit zevnějšek prohlížeče. Není zřejmě jasné, na co se dá tady použit tlačítko Choose color a nač tam je ukázaná barva v malém čtverečku. Nález - č.1 - Všechny změny se provádějí okamžitě, takže i když nevím čeho očekávat najednou se to dozvím. 10 / 21
B. Heuristická evaluace Tady se ukázaly jako splněné následující položky: H1: Viditelnost stavu systému protože jakmile něco změním, pak najednou vidím změnu i v oknu; H3: Uživatelská kontrola a svoboda dá se nastavit nejenom obecný vzhled, ale i jednotlivé součásti (jako barva a poloha horního panelu, boční panel). 3.3. TESTOVÁNÍ USE CASE 3 SMAZÁNÍ HISTORII PO POSLEDNÍM SURFOVÁNÍ A. Kognitivní průchod Q0: Cílem je smazat záznamy o navštívených stránkách po posledním surfování. Varianta první Krok 1: Najít v Settings menu History. Obrázek 7 Settings -> History 11 / 21
Krok 1 ANO ANO ANO Chce najít přehled všech navštívených stránek za Je zřejmé, že jakékoli nastavení se dá vyhledat v menu anebo Uživatel uvidí datům a seznam navštívených stránek. poslední brouzdání po internetu. použit standardní kombinaci Ctrl+H. Nález - - - Krok 2: Vybrat právě ty stránky, které byly otevřený během posledního použití prohlížeče. Obrázek 8 Přehled historie Krok 2 ANO ANO ANO Chce najít a smazat stránky navštívené během I když na začátku to uživatel může nevědět na daném kroku Uživatel uvidí datům a seznam navštívených stránek. posledního surfování. pochopí - Maxthon má speciální tlačítko Last Session. Nález - - - 12 / 21
Krok 3: Smazat záznamy o stránkách. Obrázek 9 Seznam odkazu za poslední surfování Krok 3 ANO NE ANO Chce odstranit stránky z paměti prohlížeče. Není možné smazat všechno najednou nebo aspoň vybrat více možností. Po kliknutí na křížek se odpovídající odkaz zaškrtne. Nález - č.2-13 / 21
Varianta 2 Tento způsob řešení uvedené úlohy není zřejmý na první pohled nového uživatele, ale po druhém už lze všimnout i tuto možnost. Krok 1: Na panelu vedle políčka s vyhledávačem rozbalit šipku, která se nazývá Customize Quick Tools, a najít tam Clear History. Obrázek 10 Widget, který lze dodat do panelu Krok 1 ANO NE NE Chce najít přehled všech navštívených stránek za poslední brouzdání po Není zřejmě vidět existence widgetů pokud člověk o nich neví. Není zřejmě jasné, že lze otevřít manager historie i bez toho aby přidávat ho do panelu. internetu. Nález - č.3 č.4 14 / 21
Krok 2: Smazat historii posledního surfování. Obrázek 11 Výběr strategie Krok 2 ANO ANO NE Chce smazat navštívené stránky za poslední brouzdání po internetu. Je dokonce jednotlivá položka Clear last session. Po kliknutí na Clear now historie se sice očistí, ale uživatel o tom nedozví, protože není žádná hláška o ukončení procesu. Nález - - č.5 15 / 21
B. Heuristická evaluace Tady jsem našla porušení takových heuristik: H1: Viditelnost stavu systemu 5 protože po kliknutí tlačítka Clear now uživatel nedostává žádný viditelný výsledek, žádnou hlášku o konečném výsledku proběhnutí akce; H3: Uživatelská kontrola a svoboda a H7: Flexibilita a efektivnost použití 2 uživatel je omezen ve své činnosti, neboť nemůže najednou smazat několik záznamů; 3.4. TESTOVÁNÍ USE CASE 4 - NASTAVENÍ PLUGINU A. Kognitivní průchod Q0: Chce nastavit plugin zobrazující informaci o počasí. Krok 1: Otevřít manager pluginů. Obrázek 12 Settings -> Extensions 16 / 21
Obrázek 13 Otevře se manager pluginů Krok 1 ANO ANO ANO Chce najít manager pluginů. Je zřejmě, že veškerá nastaveni má hledat v menu. Objeví se právě to, na co jsme čekali (Obrázek 11). Nález - - - Krok 2: Najdeme žádoucí rozšířeni pomocí vyhledávání. Obrázek 14 Vyhledávání pluginu 17 / 21
Krok 2 ANO ANO NE Chce najít plugin pro počasí a ví, že pravděpodob ně se bude v názvu obsahovat slovo weather. Napsat do vyhledáváče název toho, co chce najít. Když nenajde v seznamu uložených pluginů, tak nehledá dál v oficiálním obchodě prohlížeče, prostě nedělá nic a uživatel obdrží prázdnou plochu místo chtěného výsledku. Nález - - č.6 Krok 3: Najít plugin na oficiální stránce Maxthon a nastavit ho (pro přechod do uvedené stránky je třeba použit tlačítko Get more... ). Obrázek 15 Vyhledávání na oficiální stránce 18 / 21
Krok 3 ANO ANO ANO Chce nainstalovat plugin Weather. Není nic matoucího v designu vidí název, krátký popis a vidí velké tlačítko Install. Nález - - - Po ukončení instalace se objeví obláček s hláškou o tom, jak to dopadlo. Obrázek 16 Obláček informující o výsledku instalace B. Heuristická evaluace Tady podle mě dobré funguje: H1: Viditelnost stavu system na konci se objeví hláška o tom, jak dopadla operace. Ještě bych chtěla uvést ty položky heuristické evaluací, které dobře funguji v objektu testování jako celku: H2: Shoda systému a reálného světa ikonky pochopitelně vyjadřují svůj účel; H6: Rozpoznání místo vzpomínání všechno se dá pochopit intuitivně, věci jsou rozmístěné logicky; H8: Estetika a minimalizmus nic matoucího, závadného, všechno vypadá prostě a vkusně; H10: Nápověda a dokumentace při zadření kurzoru na ikonkách se objeví srozumitelně napsané vysvětlení a kdy to jde ještě navíc horké klávesy. 19 / 21
3.5. PŘEHLED NÁLEZŮ Legenda k priopitám nálezů: o Nejvyšší priorita seriózní závada kvůli které aplikace vůbec funguje; o Vyšší priorita aby fungovalo na dobré úrovni je nutné opravit závadu; o Střední celkem je všechno dobře, ale jestli napravit bude ještě líp; o Nízká nějaká drobnost, která nevadí v běžném užití. Číslo Číslo Typ Priorita Návrh řešení nálezu use case 1 2 Q2 nízká Není zřejmě jasné, na co se dá tady použit tlačítko Choose color a nač tam Změnit název tlačítka na například Choose color for bar panel je ukázaná barva v malém čtverečku. 2 3 Q2; H3, H7 střední Není možné smazat všechno najednou nebo aspoň vybrat více Udělat možnost více výběru a mazání celého seznamu možností. 3 3 Q2 nízká Není zřejmě vidět existence widgetů pokud člověk o nich neví. 4 3 Q3 nízká Není zřejmě jasné, že lze otevřít manager historie i bez toho aby přidávat ho do panelu. 5 3 Q2; H1 nízká Po kliknutí na Clear now historie se sice očistí, ale uživatel o tom nedozví, protože není žádná hláška o ukončení procesu. 6 4 Q3 střední Když nenajde v seznamu uložených pluginů, tak nehledá dál v oficiálním obchodě prohlížeče, prostě nedělá nic a uživatel obdrží prázdnou plochu místo chtěného výsledku. rázem Bylo by možné udělat tak, aby na panelu nebyla šípka, ale celý název Customize Quick Tools, ale to podle mě zhoršilo design, takže není třeba to řešit (nízká). Už je řešená zprava je napsána kombinace klávesnic pro rychlé otevření. Zajistit nějakou zpětnou vazbu o ukončení procesu a jeho stavu, třeba výskytem appletu nebo otevíráním okénka s hláškou. Jestli používám vyhledávač, chci aby něco našel. Chtělo by se automatické pokračování hledání v obchodě. 20 / 21
4. ZÁVĚR Během této semestrální práce, kde se testoval webový prohlížeč Maxthon, byly ověřeny metodou Kognitivního průchodu a metodou Heuristické evaluací některé případy užití. Testování nalezlo několik problémů použitelnosti, ale žádnou vážnou závadu. Celkový dojem po testování prohlížeče Maxthon je dost pozitivní příjemný minimalistický design, srozumitelný interface, pohodlné a rychlé fungování. 21 / 21