Testování internetového rezervačního portálu společnosti Student Agency

České vysoké učení technické v Praze Fakulta elektrotechnická Testování internetového rezervačního portálu společnosti Student Agency Semestrální práce práce předmětu A7B36USI vondrdom@fel.cvut.cz ZS 2011/2012

Obsah systému...3 Cílová skupina...4 Metodika testování...4 Kognitivní průchod...5 Heureistická evaluace...5 Přehled případů užití...5 Přihlašování a odhlašování v systému...5 Dobití kreditové jízdenky...6 Rezervace jízdenky...6 Testování...6 Přihlašování a odhlašování v systému...6 Krok 1:...6 Krok 2:...7 Krok 3:...8 Shrnutí...8 Dobití kreditové jízdenky...8 Krok 1:...8 Krok 2:...9 Krok 3:...9 Krok 4:...10 Shrnutí...11 Rezervace jízdenky...11 Kognitivní průchod českou mutací...11 Krok 1:...11 Krok 2:...12 Krok 3:...13 Shrnutí...14 Kognitivní průchod anglickou mutací...14 Krok 1:...14 Krok 2:...15 Krok 3:...16 Krok 4:...16 Krok 5:...17 Krok 6:...17 Krok 7:...18 Krok 8:...18 Shrnutí...18 Heureistická evaluace...19 Shrnutí...19 Závěr testu...19 2/19

systému Rezervační portál společnosti Student Agency je k nalezení na internetové adrese http://jizdenky.studentagency.cz a slouží k rezervování jízdenek na autobusových a vlakových spojích společnosti. Jízdenky k rezervaci si uživatel buď zakoupí na pobočkách společnosti, nebo se registruje a průběžně si dobíjí kredit. Hlavní strana portálu (Obr. 1) je rozdělená do několika boxů s ovládacími a informačními prvky. Položku pro výběr jazyka najdeme na samém vrcholu rozhraní (1). Pod ní se nachází indikace stavu uživatelského účtu (2). Tato zobrazuje jméno přihlášeného uživatele a obsah jeho košíku a základní administraci jeho účtu, případně umožňuje přihlášení či registraci nových uživatelů. Níže nalezneme horizontálně orientované hlavní menu (3) sloužící k navigaci po portálu. Pod ním leží box s hlavním přístupovým rozhraním rezervačního systému (4), který je společný pro autobusovou i vlakovou dopravu společnosti Student Agency. Dále se na stánce nachází boxy pro příhlášení uživatele s kreditovou jízdenkou (5) a pro přihlášení uživatele s otevřenou jízdenkou (6). Ve spodní části webu najdeme různé doplňující informace (7). Obr. 1: Hlavní strana portálu 3/19

Autobusové jízdenky společnosti Student Agency se dělí na dva druhy. Rozlišujeme jízdenky otevřené (Obr. 2 a obr. 3) a kreditové jízdenky (Obr. 4 a obr. 5). Obr. 2: Kreditová jízdenka zepředu Obr. 4: Otevřená jízdenka zepředu Obr. 3: Otevřená jízdenka zezadu Obr. 5: Kreditová jízdenka zezadu Otevřené jízdenky může zákazník zakoupit na pobočce společnosti. Po zaplacení mu je vydána jízdenka s unikátním kódem, pomocí kterého se může přihlásit do systému. Jízdenka není svázána s určitým časem nebo spojem, ale je omezena kreditem který si zákazník zaplatil. Kredit je na jízdence vyznačen v položce zůstatek. Na zadní straně jízdenky najdeme podrobný návod k rezervaci jízdenky pomocí SMS. Kreditovou jízdenku zákazník získá na pobočkách společnosti, kde mu bude vytištěna oproti dokladu totožnosti, případně oproti dokladu o nároku na studenstké jízdné. Spolu s tiskem jízdenky je do systému zavedeno heslo jízdenky, které si zákazník sám zvolí. Jízdenka má formu plastové kartičky o standartní velikosti kreditní karty. Zadní strana obsahuje informace o SMS rezervaci jízdenky spolu se jménem vlastníka karty (na obrázku rozmazáno) a kódem konta ke kterému karta náleží (část taktéž rozmazána). Cílová skupina Portál je určen všem zákazníkům společnosti Student Agency, to znamená všem cestujícím různých národností i věkových skupin, kteří chtějí využít otevřených nebo kreditových jízdenek. Předpokládá se pouze základní znalost ovládání internetového prohlížeče. Metodika testování Při testování jednotlivých případu užití budu využívat celkem dvou metod testování bez uživatele. Jsou to heureistická evaluace a kognitivní průchod. Vybranou metodu naleznete u každého případu užití v přehledu případů užití. 4/19

Kognitivní průchod Při použití kognitivního průchodu budu simulovat průchod uživatele rozhraním při plnění zadaného úkolu. Cílem je zjistit zda bude uživatel z cílové skupiny schopen splnit zadaný úkol, případně zda se mu to podaří předpokládaným ideálním průchodem. Pro každý případ použití je třeba se nejdříve zjistit čeho přesně chce uživatel dosáhnout. Pro každý krok testovaného případu užití je třeba se zeptat na následující 3 otázky, které budu pro potřeby zjednodušeného záznamu značit jako, a. : Je uživateli zřejmé co má udělat? : Spojí si uživatel správně popisek akce s jeho cílem? : Dostane uživatel dostatečnou odezvu na své akce? Heureistická evaluace Při heureistické evaluaci budu několikrát procházet celým uživatelským rozhraním za účelem zjištění, zda interface odpovídá vybrané sadě heureistik (pravidel chování). K testování jsem vybral sadu heureistik od Jakoba Nielsena: 1) Visibility of system status 2) Match between system and the real world 3) User control and freedom 4) Consistency and standards 5) Error prevention 6) Recognition rather than recall 7) Flexibility and efficiency of use 8) Aesthetic and minimalist design 9) Help users recognize, diagnose, and recover from errors 10) Help and documentation Přehled případů užití 1. Přihlašování a odhlašování v systému 2. Dobití kreditové jízdenky 3. Rezervace jízdenky Přihlašování a odhlašování v systému Přihlášení do systému je zásadní prerekvizice jakékoliv další operace se systémem. Přihlášením otevřené nebo kreditové jízdenky prokáže uživatel její držení a získá přístup ke kreditu, který je s jízdenkou svázán. Teprve s tímto kreditem může dále nakládat rezervací jízdenky. 5/19

Problémy s přihlášením by mohli nastat při nejasnostech v systému jízdenek, jako je rozdíl mezi otevřenou a kreditovou jízdenkou. Dalším problémem by mohla být nejasnost v přihašovacích údajích při použití otevřené, ale i kreditové jízdenky. K testování tohoto případu užití jsem se rozhodl užít kognitivního průchodu. Dobití kreditové jízdenky Užití kreditové jízdenky je zcela podmíněno kreditu který se k ní váže, proto je třeba aby bylo možné jej bez komplikací dobít ideálně několika různými způsoby, na což se v testu zaměřím. Komplikace mohou nastat v případě, že systém nepodporuje některý ze standartních způsobů online plateb a uživatel nemá možnost využít některou z nabízených metod platby. K testování tohoto případu užití jsem se rozhodl užít kognitivního průchodu. Rezervace jízdenky Rezervování jízdenky je klíčová funkce celého portálu. Očekávám že bude snadno a rychle využitelná i pro nezkušené uživatele systému a zamezí uživateli v učinění potencionálně fatálních chyb, jako je rezervace spoje ve špatný čas, nebo ve špatném směru. Rezervaci jízdenky budu zvlášť testovat pro anglicky mluvící zákazníky. Problémy s rezervací mohou nastat pokud uživatel nemá dostatečný kredit k zakoupení jízdenky. Také spoj který chce uživatel využít může už být plný. Také může dojít k chybné rezervaci a mohl by být problém chybu detekovat dříve, než vznikla, případně ji zpětně napravit. Jelikož se jedná o zásadní funkčnost systému, využiji k testování kognitivního průchodu i heureistické evaluace, abych odhalil co největší množství chyb v návrhu rozhraní. Testování Přihlašování a odhlašování v systému Q0: Bude uživatel schopen se přihlásit na účet své jízdenky? Krok 1: Uživatel má pořízenu jízdenku zvoleného typu (Obr. 2-5). Uživatel se musí dostat na webové stránky společnosti Student Agency. 6/19

*) Ne**) Uživatel je při převzetí jízdenky informován o rezervacích přes internet. Odkaz na kreditové jízdence není jasně spojen s rezervacemi. Dopnit informaci o rezervacích na adrese z jízdenky Uživatel se nachází na webu spol. Student Agency. *) Otevřená jízdenka **) Kreditová jízdenka Krok 2: Uživatel má otevřen web společnosti na adrese http://www.studentagency.cz. (Obr. 6). Obr. 6: http://www.studentagency.cz 7/19

Uživatel se musí navigovat rozhraním do rezervačního portálu. Uživatel si je vědom nutnosti vložit někam přihlašovací údaje Kategorie "Jízdenky" v navigačním menu je logickou volbou. Uživatel se dostává na rezervační portál. Krok 3: Uživatel se nachází na hlavní straně rezervačního portálu (Obr. 1). Uživatel musí zadat přihlašovací údaje. Uživatel ví, že se musí přihlásit. Uživatel má k dispozici boxy pro přihlášení oddělené podle typu jízdenky. Přihlášení uživatele přesměruje do seznamu rezervací na účtu jízdenky. Shrnutí Přihlášení uživatele je intuitivní a všechny kroky budou uživateli zřejmé. Dalo by se dosáhnout zrychlení procesu, například doplněním jízdenek o přímý odkaz na registrační portál namísto hlavních stránek společnosti. Na toto urychlení ale pravidelný uživatel určitě přijde sám a nezkušeným uživatelům nebude krok navíc pravděpodobně nijak překážet. Dobití kreditové jízdenky Q0: Bude uživatel schopen dobít si kredit na svůj účet pomocí platební karty? Krok 1: Uživatel je přihlášen a nachází se na hlavní straně portálu. Uživatel se musí navigovat do sekce "Dobíjení" boxu indikace stavu uživatelského účtu. 8/19

Uživatel ví, že se musí někam navigovat. Tlačitko "Dobíjení" je jedinou logickou volbou, navíc logicky začleněno a snadno k nalezení. Uživatel je přesměrován do seznamu možných způsobů platby. Krok 2: Uživatel se nachází na seznamu způsobu platby. Uživatel musí vybrat způsob platby. Pro test je relevantní pouze elektronická platba. Uživatel ví, že si musí vybrat způsob platby Uživatel má k dispozici instrukce k výběru platby. Výběr poskytovatele platby přesměruje uživatele do formuláře s parametry platby. Krok 3: Uživatel se nachází ve formuláři s parametry platby (Obr. 7). Obr. 7: Formulář s parametry platby 9/19

Uživatel musí vyplnit všechna pole formuláře a stisknout tlačítko "Pokračovat". Uživatel ví, že si musí vyplnit parametry platby. Pole formuláře jsou jasně popsaná a označena jako povinná. Tlačítko "Pokračovat" má jasnou funkci i polohu. Stisk tlačítka pokračovat přesměruje uživatele do formuláře platby v závislosti na vybraném poskytovateli elektronické platby. Krok 4: Uživatel se nachází ve formuláři pro elektronickou platbu v závislosti na vybraném poskytovateli elektronické platby. Uživatel musí správně vyplnit formulář a potvrdit jej. Poznámka: Tento krok nemohl být otestován, jelikož by test nepokryl všechny poskytovatele. Zároveň formulář není přímou součásti rezervačního portálu, nachází se totiž na stránkách poskytovatele bankovního spojení a proto by jeho podrobné testování přímo nesouviselo s testovaným systémem. Přepokládám tedy že byl formulář úspěšně vyplněn, uživateli byla potvzena úspešnost platby a došlo k přesměrování zpět na portál. Uživatel bude přesměrován do transakční historie svého účtu kde mu je platba znovu povrzena v přehledu všech pohybů na jeho účtu (Obr. 8). Obr. 8: Transakční historie účtu 10/19

Shrnutí Dobíjení kreditu na kreditové jízdence je jednoduchá a rychlá záležitost, která by neměla činit obtíže ani nezkušeným uživatelům. Systém uživatele přehledně naviguje jednotlivými kroky. Rezervace jízdenky Testování rezervací jízdenky kognitivním průběhem jsem se rohodl rozdělit do dvou částí vzhledem ke rozdílnému průchodu českých a anglicky mluvících uživatelů. Český průchod bude předpokládat přhlášení uživatele a bude začína na hlavní straně rezervačního portálu. Anglický průchod bude začínat na hlavních stránkách společnosti Student Agency bez přihlášení a bude předpokládat uživatele s otevřenou jízdenkou i bez jízdenky. Heureistická evaluace bude testovat pouze českou mutaci portálu. Kognitivní průchod českou mutací Q0: Bude uživatel schopen si zarezervovat lístek na určité sedadlo ve vybraném spoji? Krok 1: Uživatel je přihlášen a nachází se na hlavní straně rezervačního portálu (Obr. 9). Uživatel musí vyplnit parametry cesty ve formuláři a potvrdit jej. Obr. 9: Hlavní strana rezervačního portálu po přihlášení 11/19

Uživatel ví, že musí vyplnit parametry cesty. Pole formuláře jsou jasně popsaná. Stisk tlačítka pokračovat přesměruje uživatele do formuláře platby v závislosti na vybraném poskytovateli elektronické platby. Krok 2: Uživatel se nachází v seznamu spojů na vybrané trase (Obr. 10). Uživatel musí přidat do košíku vhodné spoje v seznamu stisknutím tlačítka se symbolem košíku vedle spoje v seznamu. Po vybrání všech spojů musí svoji obědnávku potvrdit stisknutím tlačítka "Objednat" nad seznamem spojů. Obr. 10: Seznam spojů s překrytým popiskem sloupců 12/19

Uživatel ví, že si musí vybrat z nabízených spojů. Ne Tlačítka jsou jasně popsána. Zpáteční spoje nejsou jasně odděleny, popisek sloupců se překryje plovoucím souhrnem košíku při scrollování dolů. Po přidání tlačítka do košíku je o tom uživatel informován zeleným nápisem a vložený spoj je zobrazen nad seznamem. Po potvrzení objednávky je uživatel přesměrován na výběr sedadel. Oddělit přímé a zpáteční spoje grafickým prvkem (čarou) a přidat popisek terý se nepřekryje. Krok 3: Uživatel se nachází ve formuláři pro výběr sedadel ve spojích, které má v košíku (Obr. 11). Obr. 11: Formulář výběru sedadla 13/19

Uživatel si může vybrat volné sedadlo vyznačené zeleným obdélníkem na schématu autobusu. Každý z vybraných spojů je na samostatné záložce mezi kterými se uživatel může přepnout. Ne Uživatel ví, že může vybrat sedadlo Není na první pohled zřejmé že jsou další Upozornit uživatele ná spoje v záložkách. další spoje v záložkách. Vybrané sedadlo je jasně označeno. Po odeslání formuláře se objeví jasný přehled rezervací a potvrzení o odečtení kreditu (Obr. 12). Obr. 12: Potvrzení rezervace Shrnutí Rezervace jízdenek je celkem přehledná a pozorným uživatelům nebude činit problémy. V některých případech může dojít k záměně spojů v jednom směru za směr druhý, tuto chybu ale uživatel může detekovat v závěrečném shrnutí a rezervaci lístku lze stornovat. Kognitivní průchod anglickou mutací Q0: Bude anglicky mluvící uživatel schopen si zarezervovat a zaplatit lístek na určitý čas a určitou trasu? Krok 1: Uživatel se nachází na hlavní stránce dopravce (Obr. 6). Uživatel musí změnit jazykové nastavení na anglický jazyk. Uživatel ví, že si chce změnit jazyk na angličtinu. 14/19

Ne Výběr jazyka je umístěn v malém poli Zvětšit pole pro výběr označeném českou vlajkou s nápisem jazyka a zobrazit více "Česky". Cizinci nemusí být jasné, že jde cizích jazyků najednou. o jazykové nastavení Uživatel je přesměrován na zjednodušenou verzi portálu v angličtině. Krok 2: Uživatel se nachází na anglické verzi portálu (Obr. 13). Uživatel musí vyplnit formulář pro vyhledání autobusového spoje a odeslat jej. Obr. 13: Anglická verze http://www.studentagency.cz Uživatel ví, že musí vyplnit formulář Položky fomuláře jsou jasně popsané Uživatel je přesměrován na seznam vyhledaných spojů na rezervačním portálu. 15/19

Krok 3: Uživatel se nachází na anglické mutaci seznamu vybraných spojů (Obr. 10). Uživatel musí přidat vybrané spoje do košíku a potvrdit objednávku tlačítkem "Order". Uživatel ví, že si musí vybrat spoje Položky fomuláře i tlačítka jsou jasně popsané Po přidání tlačítka do košíku je o tom uživatel informován zeleným nápisem a vložený spoj je zobrazen nad seznamem. Po potvrzení objednávky je uživatel přesměrován na výběr sedadel. Krok 4: Uživatel se nachází ná formuláři pro výběr sedadel (Obr. 14). Pokud chce uživatel využít otevřené jízdenky, musí se přihlásit. V obou případech si může vybrat sedadlo a musí potvrdit formulář. Obr. 14: Anglická mutace formuláře pro výběr sedadla 16/19

Uživatel ví, že si může vybrat sedadlo. Ne Uživateli není na první pohled zřejmé že další spoje jsou v záložkách. Formulace "You may login before creating reservation" neevokuje spojitost s otevřenou jízdenkou. Po potvrzení výběru sedadel je uživatel přesměrován na potvrzení vytvoření rezervace. Přeformulovat oznámení o přihlášení. Změnit systém záložek. Krok 5: Uživatel se nachází na potvrzení rezervace, která ještě není zaplacena. Uživatel musí stistknou tlačítko "Pay" před vypršením rezervace. Poznámka: Tento krok se vztahuje pouze na zákazníky bez otevřené jízdenky. Rezervace zákazníků s otevřenými jízdenkami končí krokem 4. Uživatel ví, že svoji rezervaci musí zaplatit před vypršením limitu. Na limit je upozorněn červeným textem. Tlačítko "Pay" je vhodně popsáno i umístěno. Uživatel je přesměrován na výběr metody platby. Krok 6: Uživatel je na obrazovce výběru metody a poskytovatele platby. Uživatel si musí vybrat metodu platby a poskytovatele kliknutím na odpovídající logo. 17/19

Uživatel ví, že si má vybrat metodu platby Uživatel je instruován ke kliknutí na logo vybraného poskytovatele. Uživatel je přesměrován na formulář s detaily o potvrzení platby. Krok 7: Uživatel se nachází na formuláři s detaily o odeslání potvzení. Uživatel musí vyplnit svojí emailovou adresu a potvrdit objednávku tlačítkem. Uživatel ví, že musí vyplnit adresu. Pole i tlačítka jsou vhodně popsaná. Uživatel je přesměrován na platební formulář poskytovatele platby. Krok 8: Uživatel se nachází na formuláři poskytovatele bankovního spojení. Uživatel musí vyplnit formulář a odeslat jej. Poznámka: Tento krok nebylo možné otestovat. Dá se však přepokládat, že se systém bude chovat obdobně jako při dobíjení kreditové jízdenky. Shrnutí Anglicky mluvící uživatel by měl být bez problému schopen zarezervovat si lístek na libovolnou trasu i v případě, že nemá zakoupenu otevřenou jízdenku. 18/19

Heureistická evaluace V následující tabulce je přehled nálezů po několikanásobném průchodu systémem. Problém Heureistika Krok 1: V nabídce posledních vyhledaných tras není specifikována stanice ve městě. Např. zastávky Praha, Dejvická a Praha, Florenc jsou zobrazeny stejně jako Praha. 5. Error prevention Rozlišit v nabídce posledních vyhledaných tras různé stanice v jednom městě. Krok 2: V seznamu vyhledaných spojů není jasně rozdělený sloupec pro přímý spoj a pro spoj zpáteční. 5. Error prevention Rozdělit sloupce grafickým prvkem a lépe je popsat. Krok 3: Ve formuláři pro výběr sedadel není jasné, že další spoje v košíku jsou v záložkách. 6. Recognition rather than recall Zvýraznit záložky, nebo změnit systém záložek. Shrnutí Heureistická evaluace odhalila několik chyb v návrhu, které mohou zmást především méně pozorné uživatele. Chyby bych nepovažoval za fatální, vzhledem k přehlednému shrnutí obědnávky po rezervaci, kterou si každý může zkontrolovat. Závěr testu Testování prokázalo, že rezervační portál společnosti Student Agency obsahuje menší počet chyb v návrhu uživatelského rozhraní. Přesto mohu konstatovat, že se jedná o systém snadno a rychle použitelný jak pro nové uživatele, tak pro pravidelné zákazníky. chyby Závažnost V nabídce posledních vyhledaných tras není specifikována stanice ve městě. Malý problém použitelnosti, vhodné odstranit. V seznamu vyhledaných spojů není jasně rozdělený sloupec pro přímý spoj a pro spoj zpáteční. ek sloupců se překryje plovoucím souhrnem košíku, pokud uživatel scrolluje dolů. Problém použitelnosti, je důležité jej odstranit. Ve formuláři pro výběr sedadel není jasné, že další spoje v košíku jsou v záložkách. Malý problém použitelnosti, vhodné odstranit. 19/19