Testování mobilní aplikace Můj vlak

Transkript

1 Testování mobilní aplikace Můj vlak SEMESTRÁLNÍ PRÁCE A2 Z PŘEDMĚTU B6B39TUR FILIP RYCHNOVSKÝ rychnfi1@fel.cvut.cz

2 1 Obsah 2 Popis aplikace Cílová skupina Přehled případů užití Způsoby testování Kognitivní průchod Heuristická evaluace Testování Vyhledání spoje a nákup jízdenky na vyhledaný spoj Kognitivní průchod Heuristická evaluace Dobití virtuální peněženky ČD kredit Kognitivní průchod Heuristická evaluace Opakovaný nákup jízdenky Kognitivní průchod Heuristická evaluace Shrnutí Stupnice nálezů Nálezy Závěr Zdroje

3 2 Popis aplikace Můj vlak je mobilní aplikace Českých drah, která slouží k vyhledávání vlakových spojů a nákupu jízdenek Českých drah. Dále umožňuje vyhledat kompletní informace o vlaku, jednotlivých stanicích včetně zobrazení jejich odjezdových tabulí. Dále je možno zobrazit dříve zakoupené jízdenky a zopakovat jejich nákup. Aplikace je dostupná na Android a ios. Já testuji Android aplikaci ve verzi z [1]. Obrázek 1 Hlavní obrazovka aplikace 3 Cílová skupina Cílovou skupinou jsou lidé jakéhokoliv věku, využívající vlaky Českých drah, kteří mají chytré mobilní zařízení. 4 Přehled případů užití 1. Vyhledání spoje a nákup jízdenky na vyhledaný spoj 2. Dobití virtuální peněženky ČD kredit 3. Opakovaný nákup jízdenky 2

4 5 Způsoby testování 5.1 Kognitivní průchod V tomto způsobu testování se testuje bez uživatele [2], uživatel se pouze simuluje. Jednotlivé případy užití se rozdělí do kroků, které procházíme. U každého kroku si pokládáme tyto 3 otázky: 1. Q1 Je uživateli zřejmá akce, kterou má provést? 2. Q2 Spojí si uživatel správně popisek akce se svým cílem? 3. Q3 Dostane uživatel dostatečnou zpětnou vazbu od aplikace? Na začátku každého use case se navíc klade otázka: Q0 Čeho chce uživatel dosáhnout? 5.2 Heuristická evaluace Tato metoda spočívá v odhalování chyb a slabých míst v rozhraní za pomocí porovnávání jeho současného stavu s pravidly (heuristikami), která jsou předem daná. Nejznámějšími heuristickými pravidly použitelnosti je deset bodů použitelnosti dle dánského profesora informatiky Jakoba Nielsena [2]: P1: Viditelnost stavu systému P6: Rozpoznání namísto vzpomínání P2: Propojení systému a reálného světa P7: Flexibilní a efektivní použití P3: Uživatelská kontrola a svoboda P8: Estetika a minimalismus P4: Standardizace a konzistence P9: Pochopit, poznat a vzpamatovat se z chyb P5: Prevence chyb P10: Nápověda a návod [2] 3

5 6 Testování 6.1 Vyhledání spoje a nákup jízdenky na vyhledaný spoj Q0: Uživatel chce najít časy nejbližších vlaků z Pardubic do Prahy a koupit si na nejbližší spoj jednosměrnou jízdenku s místenkou doprostřed vlaku na kraji vagonu s uplatněním slevy IN25 a žákovského průkazu a platby pomocí ČD kreditu Kognitivní průchod 1.Krok Z hlavní nabídky (Obrázek 2) do výsledků vyhledávání (Obrázek 3) Obrázek 2 Hlavní nabídka Obrázek 3 Výpis spojů Ano, svoje spojení vidí v doporučených správně du akci se Doporučená spojení je správně nazváno Zobrazí se nalezené vlaky 4

6 2.Krok Z výsledků vyhledávání (Obrázek 4) do detailu vlaku (Obrázek 5) Obrázek 4 Výpis spojů Obrázek 5 Detail vlaku Spojení jsou označená šipkou správně du akci se Zobrazí se detail vlaku 5

7 3.Krok Z detailu spojeni (Obrázek 6) do průvodce nákupem (Obrázek 7) Obrázek 6 Detail spojení Obrázek 7 Výběr třídy Zelené tlačítko Koupit jízdenku správně du akci se Zelené tlačítko Koupit jízdenku Zobrazí se počátek průvodce nákupem 6

8 4.Krok Z Volby třídy (Obrázek 8) do volby dokladu (Obrázek 9) Obrázek 8 Volba třídy Obrázek 9 Volba dokladu volí zde třídu kupované správně du akci se svým cílem?" jízdenky Definuje vlastnosti kupované jízdenky Číselný progres bar nahoře 7

9 5.Krok Z volby dokladu (Obrázek 10) do možnosti koupení zpáteční jízdenky (Obrázek 11) Obrázek 10 Volba dokladu Obrázek 11 Možnost koupě zpáteční jízdenky Volí zde jestli chce jenom místenku nebo jízdenky s volitelnou správně du akci se místenkou Definuje vlastnosti kupované jízdenky Číselný progres bar nahoře 8

10 6.Krok Z možnosti koupení zpáteční jízdenky (Obrázek 12) do volby cestujícího (Obrázek 13) Obrázek 12 Možnost koupení zpáteční jízdenky Obrázek 13 Volba typu cestujícího Zde má možnost přikoupit zpáteční jízdenku správně du akci se Definuje vlastnosti kupované jízdenky Číselný progres bar nahoře 9

11 7.Krok Z volby cestujícího (Obrázek 14) do souhrnu objednávky (Obrázek 15) Obrázek 14 Volba typu cestujícího Obrázek 15 Souhrn objednávky správně du akci se Ano/ne Zelené tlačítko pokračovat, sytém předvyplní hodnoty dle posledního nákupu Posun číselného progres baru nahoře, ale vynechání 5 kroku může mást Zvážit změnu progres baru 1KP1 10

12 8.Krok Ze souhrnu objednávky (Obrázek 16) do přidání rezervace (Obrázek 17) Obrázek 16 Souhrn objednávky Obrázek 17 Volba rezervace správně du akci se Ano Tlačítko s logem sedadla se znakem + s popiskem rezervace Otevře se výběr rezervace 11

13 9.Krok Ze volby rezervace (Obrázek 17) do volby místa (Obrázek 18) Obrázek 17 Volba rezervace Obrázek 18 Volba místa V dropdown zvolí nákupu místenky s výběrem místa správně du akci se Otevře se výběr místa 12

14 10.Krok Ze volby místa (Obrázek 20) zpět do souhrnu objednávky (Obrázek 21) Obrázek 20 Volba rezervace Obrázek 21 Souhrn objednávky Zelené tlačítko potvrdit výběr správně du akci se V souhrnu objednávky přibude místenka 13

15 11.Krok Ze Souhrnu rezervace (Obrázek 22) do ověření totožnosti a platby (Obrázek 23) Obrázek 22 Souhrn objednávky Obrázek 23 Volba způsoby platby Zelené tlačítko pokračovat správně du akci se Posun progres baru 14

16 12.Krok Z ověření totožnosti a platby (Obrázky 23,24) do platby pomocí ČD kredit (Obrázek 25) Obrázek 24 Volna způsobu platby Obrázek 25 zadání PIN ČD KREDIT Údaje o cestujícím jsou předvyplněny. Uživatel zvolí druh platby správně du akci se Otevře se okýnko pro ověření platby 15

17 13.Krok Z do platby pomocí ČD kredit (Obrázek 26) do zakoupené jízdenky (Obrázek 27) Obrázek 26 Zadání pinu Obrázek 27Koupená jízdenka Uživatel vyplní pin a stiskne zaplatit správně du akci se Potvrzující obrazovka s koupenou jízdenkou 16

18 6.1.2 Heuristická evaluace Typ Popis Doporučení Nález 1. Viditelnost stavu systému Ano, nákup jízdenky je realizován pomocí průvodce 2. Propojení mezi systémem a reálným Ano, užívány jsou obvyklé termín y a pojmy kolem jízdenek světem 3. Uživatelská U kteréhokoli kroku se dá vrátit na kontrola a svoboda 4. Konzistence a standard 5. Předcházení chybám 6. Raději rozpoznat, než si pamatovat 7. Flexibilita a efektivnost použití 8. Estetika a minimalistický design 9. Pomoc uživateli poznat, identifikovat a napravit chyby předchozí Všechny obrazovky mají stejný design a pojmy jsou používány jednoznačně. V 7 kroku progres bar přeskočí z 4na 6, což může uživatele mást Systém uživatel nákupem jízdenky provádí krok po kroku Další krok je vždy jednoznačně vidět Ano, jízdenku lze koupit znovu na jiný den (viz kapitola 6.3 Opakovaný nákup jízdenky) Ano, systém má přehledné zobrazení Většinou, systém nepustí do dalšího kroku bez správného vyplnění což je vhodně uživateli komunikováno. Při pokusu o nákup jízdenky do obsazeného povinně místenkového vlaku se v 7 kroku (do souhrnu objednávky) ukáže vyskakovací box Chyba: Chyba komunikace se serverem a během vichru v tom samém kroku při pokusu o nákup jakékoliv jízdenky ukáže vyskakovací box Chyba: Neznámý uživatel Zvážit vypuštění nepoužívaného 5 kroku z progres baru V prvním případě místo neříkají hlášky zobrazit pravý důvod tedy obsazenost vlaku (ten ale jen odhaduji z pravidelného požívání aplikace) případně již v detailu vlaku nezobrazit tlačítko koupit jízdenku (což je stejné chování jako když na daný vlak nelze už koupit jízdenku, protože do dojezdu zbývá méně něž 15 min). HE1T4 HE1T9.1 a HE1T Nápověda a dokumentace Aplikace poskytuje krátký přehled funkcí při prvním startu, další návod v aplikaci není potřeba V druhé případě je lepší hláška ve stylu omlouváme se systém má technické problémy, zkuste to prosím později. 17

19 6.2 Dobití virtuální peněženky ČD kredit Q0: Uživatel si chce nahrát 500Kč z platební karty do virtuální peněženky ČD kredit Kognitivní průchod 1.Krok Z hlavního menu (Obrázek 28) do detailu účtu (Obrázek 29) Obrázek 28 Hlavní menu Obrázek 29 Detail účtu správně du akci se V detailu účtu je tlačítko dobít kredit 18

20 2.Krok Z detailu účtu (Obrázek 30) do volby částky a způsobu platby (Obrázek 31) Obrázek 30 Detail účtu Obrázek 31 Volba částky a způsobu platby Zelené tlačítko dobít kredit správně du akci se Objeví se zadání detailu dobití 19

21 3.Krok Z volby částky (Obrázek 32) přes platební bránu do potvrzení o nákupu (Obrázek 33) Proces platební brány zde neukazuji, ale jedná se o standartní platební bránu od ČSOB tzn. zadání čísla karty, expirace a CVV2 kódu a poté ověření 3DSecure pře SMS kód. Obrázek 32 Volba částky a způsobu platby Obrázek 33 Potvrzení o dobití Po kliku na platební karta projde platební bránou ČSOB a ověřením 3DSecure správně du akci se Objeví se potvrzení o dobití 20

22 6.2.2 Heuristická evaluace Typ Popis Doporučení Nález 1. Viditelnost stavu V každém kroku je vidět posun systému 2. Propojení mezi systémem a reálným světem Ano, užívány jsou obvyklé termíny a pojmy kolem platby 3. Uživatelská kontrola a svoboda 4. Konzistence a standard 5. Předcházení chybám 6. Raději rozpoznat, než si pamatovat 7. Flexibilita a efektivnost použití 8. Estetika a minimalistický design 9. Pomoc uživateli poznat, identifikovat a napravit chyby U kteréhokoli kroku se dá vrátit na předchozí či proces platby zcela opustit Všechny obrazovky mají stejný design a pojmy jsou používány jednoznačně. Je použita standartní platební brána Jednoznačné obvyklé korky Další krok je vždy jednoznačně vidět Činnost je krátká, zkratky nejsou třeba Ano, systém má přehledné zobrazení Systém nepustí do dalšího kroku bez správného vyplnění což je vhodně uživateli komunikováno. 10. Nápověda a dokumentace Aplikace poskytuje krátký přehled funkcí při prvním startu, další návod v aplikaci není potřeba 21

23 6.3 Opakovaný nákup jízdenky Q0: Uživatel si chce znovu koupit jízdenku z minulého pondělí Kognitivní průchod 1.Krok Z hlavního menu (Obrázek 34) do seznamu aktuálních jízdenek (Obrázek 35) Obrázek 34 Hlavní menu Obrázek 35 Seznam aktuálních jízdenek Položka Jízdenky je v hlavním menu jasná správně du akci se Otevře se seznam jízdenek 22

24 2.Krok Ze seznamu aktuálních jízdenek (Obrázek 36) do seznamu minulých jízdenek (obrázek 37) Obrázek 36 Seznam aktuálních jízdenek Obrázek 37 Seznam minulých jízdenek Tlačítko Dříve zakoupené jízdenky správně du akci se Otevře se seznam minulých jízdenek 23

25 3.Krok Ze seznamu minulých spojů (Obrázek 38) do detailu jízdenky (Obrázek 39) Obrázek 38 Seznam minulých jízdenek Obrázek 39 Detail jízdenky Klikne na du jízdenku správně du akci se Ano, chce ji znovu koupit Otevře se detail jízdenky 24

26 3.Krok Ze detailu jízdenky (Obrázek 40) do průvodce nákupem (Obrázek 41) Po stisku tlačítka Koupit znovu v spodní části detailu jízdenky, uživatel vybere datum, na který chce jízdenku koupit. Systém zobrazí souhrn objednávky odkud je postup stejný jako od 7 kroku v kapitole Obrázek 38 Seznam minulých jízdenek Obrázek 39 Detail jízdenky Tlačítko Koupit znovu správně du akci se Ano, chce ji znovu koupit Otevře se souhrn objednávky 25

27 6.3.2 Heuristická evaluace Typ Popis Doporučení Nález 1. Viditelnost stavu systému V každém kroku je vidět posun k cíli uživatele 2. Propojení mezi systémem a reálným světem Ano, užívány jsou obvyklé termíny a pojmy kolem jízdenek 3. Uživatelská kontrola a svoboda 4. Konzistence a standard 5. Předcházení chybám 6. Raději rozpoznat, než si pamatovat 7. Flexibilita a efektivnost použití 8. Estetika a minimalistický design 9. Pomoc uživateli poznat, identifikovat a napravit chyby U kteréhokoli kroku se dá vrátit na předchozí či proces platby zcela opustit. Všechny obrazovky mají stejný design a pojmy jsou používány jednoznačně. Systém sám vede uživatele Další krok je vždy jednoznačně vidět Činnost je krátká, zkratky nejsou třeba Ano, systém má přehledné zobrazení Systém nepustí do dalšího kroku bez správného vyplnění což je vhodně uživateli komunikováno. 10. Nápověda a dokumentace Aplikace poskytuje krátký přehled funkcí při prvním startu, další návod v aplikaci není potřeba 26

28 7 Shrnutí 7.1 Stupnice nálezů 1 - Kosmetický problém, který není bezpodmínečně nutné řešit 2 - Drobný problém použitelnosti, který by bylo vhodné napravit (nízká priorita). 3- Zásadní problém použitelnosti a funkčnosti, který je důležité napravit (vysoká priorita). 7.2 Nálezy Nález Závažnost Popis Doporučení 1KP1 HE1T4 1 Při přechodu mezi volbou cestujících shrnutím objednávky progres bar přeskočí z 4 na 6, což může uživatele mást. Ale já si toho i přes pravidelné používání všimnul až při přípravě obrázku pro tuto zprávu HE1T9.1 2 Při pokusu o nákup jízdenky do obsazeného povinně místenkového vlaku se v 7 kroku (do souhrnu objednávky) ukáže vyskakovací box Chyba: Chyba komunikace se serverem HE1T9.2 3 Během vichru v 7 kroku (do souhrnu objednávky) při pokusu o nákup jakékoliv jízdenky ukáže vyskakovací box Chyba: Neznámý uživatel Zvážit vypuštění nepoužívaného 5 kroku z progres baru Místo nic neříkající hlášky zobrazit pravý důvod tedy obsazenost vlaku (ten ale jen odhaduji z pravidelného požívání aplikace) případně již v detailu vlaku nezobrazit tlačítko koupit jízdenku (což je stejné chování jako když na daný vlak nelze už koupit jízdenku, protože do dojezdu zbývá méně něž 15 min). Lepší hláška ve stylu omlouváme se systém má technické problémy, zkuste to prosím později. 27

29 8 Závěr Aplikace je velmi pěkně udělána a snadno se používá. Nalezené chyby jsou bud kosmetického charakteru (přeskočení 5 v progres baru) nebo špatně ošetřené krajní případy (hlášku při pokusu o koupení lístku na vyprodaný povinně místenkový vlak, přičemž naprostá většina vlaků Český drah není povinně místenková) nebo nefunkčnost části aplikace asi kvůli výpadku části sytému v důsledku vichru Zdroje [1] Můj vlak, vyvinutý společností České dráhy a.s., ke stáhnutí na Google Play Store. Dostupné na webu: [2] SPORKA, Adam. Testování kognitivním průchodem a heuristickou evaluací [přednáška]. Praha: ČVUT v Praze, 10. října