Vývoj aplikace Readily (RSS čtečka pro Android) Semestrální projekt předmětu Y39PDA Autor: Michal Cerman

Vývoj aplikace Readily (RSS čtečka pro Android) Semestrální projekt předmětu Y39PDA Autor: Michal Cerman [email protected]

Obsah Vývoj aplikace Readily (RSS čtečka pro Android).........................................................................1 D1.........................................................................................................................................................3 D2.........................................................................................................................................................4 1)Popis uživatelů..............................................................................................................................4 2)Aktivity.........................................................................................................................................5 3)Systémová podpora......................................................................................................................5 4)Kontext.........................................................................................................................................5 D3.........................................................................................................................................................6 1)Prototyp........................................................................................................................................6 2)Průběh testu................................................................................................................................15 Nalezené problémy....................................................................................................................15 Problém č.1...........................................................................................................................15 Popis problému:...............................................................................................................15 Porušuje heuristiku:.........................................................................................................15 Návrh řešení:....................................................................................................................15 Priorita:............................................................................................................................15 Problém č.2...........................................................................................................................15 Popis problému:...............................................................................................................15 Porušuje heuristiku:.........................................................................................................15 Návrh řešení:....................................................................................................................15 Priorita:............................................................................................................................16 Problém č.3...........................................................................................................................16 Popis problému:...............................................................................................................16 Porušuje heuristiku:.........................................................................................................16 Návrh řešení:....................................................................................................................16 Priorita:............................................................................................................................16 Problém č.4...........................................................................................................................16 Popis problému:...............................................................................................................16 Porušuje heuristiku:.........................................................................................................16 Návrh řešení:....................................................................................................................16 Priorita:............................................................................................................................16 Problém č.5...........................................................................................................................17 Popis problému:...............................................................................................................17 Porušuje heuristiku:.........................................................................................................17 Návrh řešení:....................................................................................................................17 Priorita:............................................................................................................................17 Problém č.6...........................................................................................................................17 Popis problému:...............................................................................................................17 Porušuje heuristiku:.........................................................................................................17 Návrh řešení:....................................................................................................................17 Priorita:............................................................................................................................17 3)Zhodnocení testu........................................................................................................................17

D1 Aplikace bude sloužit pro stahování a čtení RSS kanalů na mobilních zařízeních se systémem Android. Bude možné číst více kanalů najednou a ty pak vyfiltrovat tak, ze se budou stahovat a zobrazovat zprávy buďto jen z jednoho konkrétního zdroje nebo z více najednou. Ke zdroji zpráv bude možné přidat filtr, pomocí kterého bude uživatel moci nastavit, které zprávy se mají stahovat. Filtr bude vypadat asi takto: Stahovat/nestahovat zprávy, které obsahují slovo/frázi/autora/datum od,do. Zprávy budou odshora seřazeny podle času vydání. Budou se stahovat z internetu samy v určeném intervalu nebo je bude možné stáhnout pomocí volby v menu. Zaměřím se hlavně na jednoduchý a přehledný design aplikace. Prostředí bude vytvořené tak, aby bylo možné telefon držet v jedné ruce a aby byla aplikace použitelná kdykoliv a kdekoliv.

D2 1) Popis uživatelů Tato aplikace je určena převážně pro skupinu uživatelů mobilních telefonů, kteří jsou zvyklí využívat pokročilejší funkce telefonu a nevyužívají ho pouze na hovory a sms zprávy. Očekává se, že ji budou používat uživatelé, kteří denně pracují s internetem a chtějí se dozvědět o novém článku či zprávě na jejich oblíbeném serveru co nejdříve. Z hlediska věku určeno spíše pro mladší generaci.

2) Aktivity •

Uživatel zadá URL feedu a zadá, kolik předchozích zpráv se má stáhnout.

•

Nastaví interval stahování nebo si bude stahovat zprávy sám stisknutím přislušného tlačítka.

•

Uživatel si může nastavit filtr zpráv podle nějakého klíčového slova.

•

Vyhledávání v již stažených zprávách.

•

Nastavení počtu uložených zpráv v paměti.

3) Systémová podpora V aplikaci bude možné odebírat RSS feedy (jeden nebo více najednou). Uživatel si nastaví, v jakém intervalu má telefon kontrolovat nové feedy, popř. si je bude stahovat sám kdy bude chtít. Dále bude možné zobrazit pouze určité zprávy. Příklad: Do čtečky jsem si přidal RSS feed ze serveru, který publikuje články o automobilech. Zajímají-li mě pouze zprávy o vozech Škoda, mohu si pomocí této funkce nastavit stahování pouze takových zpráv, které mají v nadpisu klíčové slovo "Škoda". Aplikace bude vyvíjena pro OS Android a pro telefony s větším dotykovým displayem (testování bude probíhat na HTC Hero). Na telefonu je potřeba mít přístup k datům z internetu.

4) Kontext Aplikace se bude od jiných podobných aplikací, ať už jde o mobilní nebo desktopové verze, lišit hlavně tím, že bude kladen důraz na jednoduché a intuitivní

ovládání.

Veškeré

ovládání

bude

možné

provádět

jednou

rukou(stejně pro leváky i praváky). Typická situace pro použití aplikace je např. tato: Stojím v tramvaji, jednou rukou se potřebuji držet a v druhé mám telefon, na kterém si mohu procházet nové RSS feedy. Hlavní využití je tedy v MHD, na ulici apod.

D3 1) Prototyp Za účelem testování aplikace byl vytvořen low-fidelity prototyp aplikace v programu Balsamiq (http://balsamiq.com/). Tento software umoňuje vytvořit papírové mockupy, vytvořit mezi nimi odkazy a následně vyvýjenou aplikaci simulovat. Celá aplikace je navržena tak, aby bylo možné ji ovládat jednoduše palcem levé nebo pravé ruky. To je vidět už na prototypu. Vycházel jsem z toho, že nejlepší bude umístit ovládácí prvky na display tak, jak je znázorněno na obrázku (Picture 1,2) a pokud to bylo možné, snažil jsem se umístit ovládání do těchto míst. Pokud nejsou ovládací prvky v těchto místech, tak se buď jedná o prvky seznamu, na které je možné kliknout alespoň po celé šířce displaye, nebo to jsou prvky, které uživatel nepoužívá moc často. Typicky například nastavení filtrů, pravidelné stahování zpráv a další nastavení.

Picture 1: Levá ruka

Picture 2: Pravá ruka

Tlačítko pro přepínání mezi rozložením pro levou a pravou ruku je umístěno na všech mockupech. Nachází se uprostřed displaye tak, aby bylo možné ho stisknout obouma rukama. Na dalších dvou obrázcích je hlavní obrazovka aplikace (Picture 3,4). Nejdůležitějším prvkem je tu seznam aktivních kanálů, u každého je informace o počtu uložených a nepřečtených zpráv.

Picture 4: Hlavní obrazovka, levá ruka

Picture 3: Hlavní obrazovka, pravá ruka

Kromě tlačítka pro přepínání mezi levou/pravou rukou, které už bylo popsáno dřive, je zde tlačítko Refresh. To aktivuje funkci pro kontrolu a stažení nových zpráv. Stav obrazovky po jeho stisknutí je znázorněn na dalším obrázku (Picture 5,6).

Picture 5: Refresh, levá ruka

Picture 6: Refresh, pravá ruka

Další volbou je Options, která vyvolá nabídku. Ta obsahuje Add new channel a Settings (Picture 7,8).

Picture 7: Options na hlavní obrazovce, levá ruka

Picture 8: Options na hlavní obrazovce, pravá ruka

Pokud vybereme Add new channel, zobrazí se nám formulář pro zadání nového kanálu (Picture 9,10). V prvním řádku je po nás požadována URL adresa kanálu. Dále název, pod kterým se bude kanál zobrazovat v seznamu na hlavní obrazovce. Poslední položkou je počet předchozích zpráv, které se mají stáhnout. Potvrzení tlačítkem Save a zrušení akce tlačítkem Cancel asi nemusím popisovat.

Picture 9: Přidání nového kanálu, levá ruka

Picture 10: Přidání nového kanálu, pravá ruka

Když se vrátíme k Options, tak další položkou bylo Settings. Zde uživatel najde obecná nastavení platná pro celou aplikaci (Picture 11,12). Jedná se o nastavení kontroly nových zpráv, kde si uživatel zvolí, v jakém intervalu se má akce provádět. Dále je tu možnost kontroly nových zpráv okamžitě při startu

aplikace. Poslední položkou je možnost smazání zpráv starších než určitý počet dní. Pro uložení nebo zrušení jsou tu opět k dispozici tlačítka Save a Cancel.

Picture 11: Nastavení Picture 12: Nastavení aplikace, levá ruka aplikace, pravá ruka

Vraťme se nyní zpět na hlavní obrazovku1 (Picture 13). Vybereme jeden z uložených a nastavených kanálů, konkrétně Daily Planet news (Picture 14). Ukáže se nám seznam zpráv (článků) v daném kanálu.

Picture 14: Hlavní obrazovka

Picture 13: Kanál Daily Planet news

Zde máme opět nabídku Options (Picture 15). Je tu možnost kanál smazat, pokud ji vybereme, zobrazí se nám potvrzovací dialog. Dále Filters, kudy se 1 Od této chvíle je v prototypu znázorněno pouze rozložení pro pravou ruku, ve skutečné aplikaci bude k dispozici rozložení pro obě ruce obdobně jako v mockupech uvedených výše.

dostaneme do nastavení filtrů (Picture 16).

Picture 15: Nabídka kanálu

Picture 16: Dialog pro smazání kanálu

Picture 17: Menu pro filtry

Pokud zde vybereme Add filter, zobrazí se nám formulář pro přidání nového filtru (Picture 18). V případě Delete filter je akce obdobná jako Delete channel, tedy zobrazení potvrzovacího dialogu. Enable/disable filter aktivuje či deaktivuje filtr, informace o stavu bude v seznamu filtrů.

Picture 18: Přidání nového filtru K přidání nového filtru je potřeba vyplnit následující položky. Celé je to seskupeno jakoby jedna věta, je strukturovaná takto: Stahovat/nestahovat zprávy, které obsahují nějaké slovo nebo nějakého autora nebo byly vydány v určité datum. V případě určitého slova lze v posledním selectu vybrat, kde se má vyskytovat (nadpis, tělo článku). Další obrázky ukazují průběh přidávání filtru (Picture 19,20,21,22).

Picture 19: Výběr stahovat/nestahovat

Picture 20: Zašktrnutý filtr podle slova

Picture 21: Vyplněné Picture 22: Vyplněný klíčové slovo formulář pro nastavení filtru

Nyní se vrátíme do zobrazení se seznamem zpráv (Picture 23). Pokud vybereme Options (Picture 24), zobrazí se nám možnost Delete, Zoom In a Zoom Out. V prototypu je zobrazeno přiblížení a oddálení (Picture 24,25).

Picture 23: Nabídka po stisknutí Options

Picture 25: Přiblížený Picture 24: Oddálený text text

Prototyp zahrnuje pouze základní funkce a v reálné aplikaci některé ještě přibydou. Chybí tu například hledání, které se nejspíš bude vyvolávat hardwarovým tlačítkem (pokud to systém dovolí). Prototyp je pro testery k dispozici ve formátu PDF s odkazy.

2) Průběh testu Pro testování byla zvolena metoda heuristic evaluation (HE). Aplikaci testovali celkem 3 experti. Před samotným testem jim bylo popsáno, k čemu je aplikace určena a jaké funkce jsou a jaké nejsou v prototypu podporovány. Dále byli seznámeni se samotným prototypem, jedná se o jednoduché PDF s obrázky, které jsou svázány odkazy.

Nalezené problémy Problém č.1 Popis problému: Tlačítko Options je v aplikaci zbytečné. Nabídka akcí k aktuální obrazovce je již implementována a je to standardní chování systému, přístup k ní je přes hardwarové tlačítko. Porušuje heuristiku: H4 - Consistency and standards Návrh řešení: Odstranit tlačítko Options ze všech obrazovek. Priorita: 1 Problém č.2 Popis problému: Infobox je moc malý, bude těžké ho přečíst v přeplněné MHD. Porušuje heuristiku: H1 - Visibility of system status Návrh řešení: Zvětšit Infobox (po vyřešení problému č.1 bude pro něj dost místa na

displayi). Případně zvětšit font. Priorita: 4 Problém č.3 Popis problému: Popisky tlačítek jsou zbytečné, pro uživatele nesnadno zapamatovatelné. Porušuje heuristiku: H8 - Aesthetic and minimalist design Návrh řešení: Nahradit popisky vhodnými obrázky, které si uživatel lépe zamapatuje. Priorita: 4

Problém č.4 Popis problému: U čísel u jednotlivých kanálů (např. 150/0) není zřejmé, co znamenají. Porušuje heuristiku: H1 - Visibility of system status Návrh řešení: Zobrazit pouze počet nepřečtených zpráv, počet uložených není k ničemu potřeba. Priorita: 3

Problém č.5 Popis problému: V nastavení je stále zobrazené tlačítko pro přepínání rukou a infobox. Uživatel toto nejspíš nebude nastavovat při jízdě, proto je to zbytečné. Porušuje heuristiku: H8 - Aesthetic and minimalist design Návrh řešení: Odstranit přebytečné prvky a ponechat pouze ty nezbytně nutné. Priorita: 2 Problém č.6 Popis problému: Mazání položek je v Options, uživatelé Androidu jsou zvyklí na „touch and hold“. Porušuje heuristiku: H4 - Consistency and standards Návrh řešení: Odstranit položku z Options, zavést „touch and hold“ menu. Priorita: 5

3) Zhodnocení testu Pro test jsem záměrně vybral experta, který používá OS Android již delší dobu a tedy ví, co je pro toto prostředí typické. Odtud mi vyplynula velká část problémů způsobených hlavně tím, že sám tento operační systém důkladně neznám. Dále se mi objevilo několik dalších méně závažných problémů se

zobrazením a dodržením minimalistického designu, které se pokusím v další fázi odstranit.