ČESKÉ VYSOKÉ UČENÍ TECHNICKÉ V PRAZE, FAKULTA ELEKTROTECHNICKÁ Testování cd.cz/eshop Semestrální práce z předmětu Testování uživatelských rozhraní (A7B39TUR) Šimon Kohout kohousim@fel.cvut.cz
2 Testování cd.cz/eshop Obsah 1 Úvod... 3 1.1 Popis aplikace... 3 1.2 Popis uživatele... 3 1.3 Přehled případů užití... 3 1.3.1 Registrace a přihlášení na portálu... 3 1.3.2 Vyhledání vhodného spoje a následné zakoupení jízdenky... 3 1.3.3 Zakoupení a aktivace slevové karty (in-karta)... 4 2 Testování... 4 2.1 Metody testování... 4 2.2 Testování kognitivním průchodem... 4 2.3 Testování heuristickou evaluací... 4 2.4 Provedení testu... 5 2.4.1 Use case 1 : Registrace... 5 2.4.2 Use case 2: Vyhledání vhodného spoje a následné zakoupení jízdenky... 7 2.4.3 Koupě in-karty... 11 3 Shrnutí testování... 13 3.1 Priority nálezů... 13 3.2 Nálezy... 13 3.3 Závěr... 14
3 Testování cd.cz/eshop 1 Úvod 1.1 Popis aplikace Předmětem testování je e-shop společnosti České dráhy nacházející se na jejich webovém portálu. Tento e-shop nabízí rozsáhlou nabídku produktů Českých drah a má za cíl umožnit jejich jednoduchou a rychlou distribuci zákazníkům. Krátce před zahájením samotného testování společnost Českých drah nahradila původní aplikaci novou a dle svých slov, několik měsíců připravovanou verzí, využívající osvědčený systém ze zahraničí, zdokonalený pro požadavky svých zákazníků. 1.2 Popis uživatele Cílová skupina uživatelů je, z důvodu snahy o co největší možné tržby, velmi široká. V ideálním případě by měl být schopen využít služeb e-shopu, jakýkoli potencionální zákazník se základními schopnostmi orientace ve webovém prostředí. 1.3 Přehled případů užití (1)Registrace a přihlášení na portálu (2)Vyhledání vhodného spoje a následné zakoupení jízdenky (3)Zakoupení a aktivace slevové karty (in-karta) 1.3.1 Registrace a přihlášení na portálu Ačkoli v nové verzi e-shopu odpadá nutnost provést registraci před případným nákupem obyčejné jízdenky, je stále doporučována a v případě zájmu, o některou z další nabízených služeb je registrace na portálu v každém případě nezbytná. Případná registrace na portálu předznamenává zájem zákazníka využívat služeb e-shopu opakovaně, a tudíž je klíčové ho od registrace neodradit nutností vyplňováním dlouhého a nepřehledného formuláře s vysokou pravděpodobností zadání chybných údajů, vyžadujících několikanásobného opravování. 1.3.2 Vyhledání vhodného spoje a následné zakoupení jízdenky Vyhledávání spojů a následný nákup jízdenky je primární funkcí e-shopu a zákazníky je nejvíce používaná. Proto si většina uživatelů odnese svůj výsledný dojem o aplikaci právě ze zážitku nákupu obyčejné jízdenky. Z tohoto důvodu je důležité, aby vyhledání spoje a následný nákup jízdenek byl přehledný, rychlý a efektivní.
4 Testování cd.cz/eshop 1.3.3 Zakoupení a aktivace slevové karty (in-karta) In-karta je zákaznickou slevovou kartou. Snadnost její distribuce je výhradní zájem společnosti, což značí i umožnění jejího pořízení pomocí webového rozhraní bez nutnosti osobní návštěvy prodejního distribučního místa. Na druhou stranu je nutné zajistit jednoduchý proces vytvoření karty, ve kterém se uživatel neztratí a ani se nedopustí nějaké chyby, která by se promítla při výrobě samotné fyzické karty, jako by například mohlo být nahrání nevhodné fotografie. 2 Testování 2.1 Metody testování K testování je využívána dvojice základních technik 2.2 Testování kognitivním průchodem V této metodě je simulována akce potencionálního uživatele, kdy na samotném začátku stanovíme cíl, kterého chce uživatel dosáhnout, a při každém kroku průchodu aplikace zodpovídáme tuto trojici otázek. (Q1) Bude uživateli zřejmé co udělat? (Q2) Spojí si uživatel správně popisek akci se svým cílem? (Q3) Dostane uživatel dostatečnou odezvu? 2.3 Testování heuristickou evaluací Při této metodě je aplikace podrobně zkoumána a ověřuje se zda respektuje předem zadanou sadu pravidel. V tomto případě jsou využívány heuristiky Jaacoba Nelsona, jenž jsou uvedeny níže. (H1) Viditelnost stavu systému, (H2) Podobnost systému a reálného světa, (H3) Kontrola nad systémem a uživatelská svoboda, (H4) Konzistence a standardy, (H5) Prevence chyb, (H6) Rozpoznání namísto vzpomínání, (H7) Flexibilní a efektivní použití, (H8) Estetický a minimalistický vzhled, (H9) Pomoc s rozpoznáním, diagnostikou a zotavením se z chyb (H10) Nápověda a dokumentace.
5 Testování cd.cz/eshop 2.4 Provedení testu 2.4.1 Use case 1 : Registrace K testování prvního use case -registrace (1), bylo využito metody kognitivního průchodu, jelikož se jedná o přímý postup skrze registrační formuláře a tato metoda se k tomu jeví vhodná. Uživatelův cíl : Registrace na portálu 2.4.1.1 Krok 1: Vyplnění registračního formuláře Prvním krokem registrace je správné vyplnění povinných údajů a pokračování na další obrazovku pomocí tlačítka registrovat. Obrázek 1 - Registrační formulář
6 Testování cd.cz/eshop Otázka Odpověď Popis Návrh řešení Q1 Ne N1: Není jasné, že je nutné opsat písmena z obrázku, protože toto pole není označeno stejně, jako ostatní pole povinná. Q2 Ano U všech polí jsou velmi přesné popisky. Q3 Ano 2.4.1.2 Krok 2: Ověření uživatele Opatřit pole stejným značením, jako ostatní povinná pole. Druhým krokem registrace je řízení se zobrazenými instrukcemi na obr. č. 2, které nás nabádají o přechodu na adresu, kterou jsme obdrželi v aktivačním e-mailu. Obrázek 2 - Ověření uživatele Otázka Odpověď Popis Návrh řešení Q1 Ano Uživateli jsou jasně sděleny pokyny. Q2 Ano Q3 Ano
7 Testování cd.cz/eshop 2.4.1.3 Krok 3: Dokončení registrace Posledním krokem aktivace je počkat na automatické přesměrování nebo kliknout na odkaz zobrazený na obr. č. 3. Obrázek 3 - Dokončení registrace Otázka Odpověď Popis Návrh řešení Q1 Ano Q2 Ano Q3 Ano 2.4.2 Use case 2: Vyhledání vhodného spoje a následné zakoupení jízdenky U testování druhého use case -vyhledání spoje a zakoupení jízdenky(2), bylo využito opět metody kognitivního průchodu. Uživatelův cíl : Zakoupení jízdenek 2.4.2.1 Krok 1: Vyplnění formuláře pro vyhledání požadovaného spoje Prvním krokem je vyplnění uživatelových požadavků na vyhledávaný spoj a počet požadovaných jízdenek zvoleného typu.
8 Testování cd.cz/eshop Obrázek 4 - Specifikace hledaného spoje Otázka Odpověď Popis Návrh řešení Q1 Ano Q2 Ano Q3 Ano 2.4.2.2 Krok 2: Vybrání vyhovujícího spoje Druhým krokem je vybrání nejlepšího spoje z systémem nabízených a vhodného cenového tarifu. Obrázek 5 - Výpis nalezených spojů
9 Testování cd.cz/eshop Otázka Odpověď Popis Návrh řešení Q1 Ano Q2 Ne N2: U možnosti jiné nabídky není okamžitě zřejmá funkce. Změnit popisek např. na : Jiné cenové nabídky. Q3 Ne N3: Zobrazí se pouze několik prvních spojů. Uživatel nemá možnost zobrazit si pod sebou více spojů pro srovnání. Možnost posunu na další spoje je nenápadně umístěna ve spodní liště s jinak nesouvisejícími elementy. Přidat volbu, kolik spojů najednou zobrazit a umístit možnost přesunu na další spoje i do horní lišty. 2.4.2.3 Krok 3: Volba doplňkových služeb Následujícím krokem je možnost přidat k samostatným jízdenkám některé z doplňkových služeb, které se nám hned započítávají do výsledné ceny. Obrázek 6 - Nabídka doplňkových služeb
10 Testování cd.cz/eshop Otázka Odpověď Popis Návrh řešení Q1 Ano Q2 Ano Q3 Ano 2.4.2.4 Krok 4: Rekapitulace požadavku Před předáním jízdenek do košíku je ještě nutné vyplnit informace o majiteli jízdenky. Obrázek 7 - Rekapitulace požadavku Otázka Odpověď Popis Návrh řešení Q1 Ne N4: Není zřejmé, číslo jakého průkazu zapsat, obzvláště při Doplnit upřesnění, jaký druh osobního průkazu je tolerován. nákupu jízdenky pro nezletilou osobu. Q2 Ano Q3 Ano
11 Testování cd.cz/eshop 2.4.2.5 Krok 5: Výběr způsobu platby Posledním krokem je výběr způsobu platby. Obrázek 8 - Nabídka typu platby 2.4.3 Koupě in-karty K testování posledního use case - koupě in-karty(3), bylo využito metody heuristické evaluace. Po důsledném otestování nákupu in-karty na dodržování heuristik byly objeveny následující nálezy. Obrázek 9 - Nahrávání fotografie pro in-kartu Porušená heuristika H1 H5 Popis N5: Při nahrávání fotografie není vidět průběžný ani výsledný stav viz obr. č. 8 N6: Chybí okamžitá informace o stavu a případných chybách ve vyplňovaném formuláři. Návrh řešení Přidat panel zobrazující proces nahrávání. Přidat průběžnou kontrolu polí.
12 Testování cd.cz/eshop H3 H9 H9 N7: Po přidání karty do košíku, již nelze zpětně editovat kupovanou kartu N8: Chybové hlášky jsou u polí vypisovány stejným stylem, jako fixní popisky polí, tudíž nelze jednoduše naleznout chybu viz. obr. č. 9 N9: Při neúspěšném nahrání fotografie není uveden důvod selhání ani návod na jeho nápravu. Přidat možnost editovat nezaplacenou objednávku. Změnit styl popisků. Přidat informační hlášku se zdůvodněním chyby Obrázek 10 - Formulář pro výrobu in-karty
13 Testování cd.cz/eshop 3 Shrnutí testování 3.1 Priority nálezů Jednotlivým nálezům byly přiřazeny priority podle závažnost dle následujícího klíče. 0 - Kosmetický problém 1 -Malý problém použitelnosti 2 - Problém použitelnosti 3 - Závažný problém 3.2 Nálezy Priorita Popis Návrh řešení Use case Odkaz v textu 3 Při neúspěšném nahrání fotografie není uveden důvod selhání ani návod na jeho nápravu. Přidat informační hlášku se zdůvodněním chyby Koupě in-karty N9 3 Není zřejmé, co zapsat do kolonky číslo průkazu, obzvláště při nákupu jízdenky pro nezletilou osobu, která nevlastní in-kartu. 2 Chybové hlášky jsou u polí vypisovány stejným stylem, jako fixní popisky polí, tudíž nejde jednoduše naleznout chyba viz. obr. č. 9 1 U možnosti jiné nabídky není okamžitě zřejmá funkce. 1 Po přidání karty do košíku, už nelze zpětně editovat kupovanou kartu 0 Při nahrávání fotografie není vidět průběžný stav viz obr. č. 8 0 Chybí okamžitá informace o stavu a případných chybách ve vyplňovaném formuláři. 0 Zobrazí se pouze několik prvních spojů. Uživatel nemá možnost zobrazit Doplnit upřesnění, jaký druh osobního průkazu je tolerován. Koupě jízdenky N4 Změnit styl popisků. Koupě in-karty N8 Změnit popisek např. na : Jiné cenové nabídky. Přidat možnost editovat nezaplacenou objednávku. Přidat panel zobrazující proces nahrávání. Přidat okamžitou kontrolu polí. Přidat volbu, kolik spojů najednou zobrazit a umístit možnost Koupě jízdenky Koupě in-karty Koupě in-karty Koupě in-karty Koupě jízdenky N2 N7 N5 N6 N3
14 Testování cd.cz/eshop si pod sebou více spojů pro srovnání. Možnost posunu na další spoje je nenápadně umístěna ve spodní liště s jinak nesouvisejícími elementy. přesunu na další spoje i do horní lišty. 0 Není jasné, že je nutné opsat písmena z obrázku, protože toto pole není označeno stejně, jako ostatní pole povinná. Opatřit pole stejným značením, jako ostatní povinná pole. Registrace N1 3.3 Závěr Na nové verzi e-shopu Českých drah je vidět velká snaha o co největší uživatelskou přívětivost pro co možná nejširší cílovou skupinu. České dráhy se evidentně poučily po zkušenostech se svým starým systémem a snažily se o co nejlepší uživatelské testovaní, o čemž svědčí hned několik možností o feedback přímo na stránkách společnosti. I přesto se, ale v e-shopu stále nachází několik problémů rozličné důležitosti, které by měly být rozhodně v budoucnu odstraněny.