A7B39PDA Deliverable D3 ČVUT FEL, 2014/2015 Daniil Barabash, Adam Samec, Tatiana Okonechnikova. Principy tvorby mobilních aplikací (A7B39PDA)

Transkript

1 Principy tvorby mobilních aplikací (A7B39PDA) Deliverable D3 Staročeská šibenice ITJ HGM Daniil Barabash Adam Samec Tatiana Okonechnikova České vysoké učení technické v Praze Fakulta elektrotechnická 2014/2015 1

2 Obsah Obsah Popis aplikace Elektronický prototyp aplikace Úvod Obrazovky prototypu Problémy nalezené při testování s uživateli Uživatel 1 Uživatel 2 Uživatel 3 2

3 Popis aplikace Cílem zadání je navrhnout a částečně implementovat především z hlediska UI (uživatelského rozhraní) aplikaci na hraní klasické školní hry šibenice, ovšem s tím rozdílem, že úkolem bude hádat výhradně staročeská slova či sousloví. Bude se jednat o multiplayerovou hru v reálném čase v rámci skupiny několika hráčů. Interakce a komunikace mezi jednotlivými hráči bude probíhat pomocí již existující serverové platformy pracující se zdrojem staročeských slov Vokabulářem webovým ( Cílovou skupinou jsou zejména studenti středních škol, kteří budou vzájemně soutěžit v rychlosti a znalosti staročeských slov a výrazů. 3

4 Elektronický prototyp aplikace Úvod Vzhledem k již hotové implementaci hry Staročeská šibenice pro platformu Windows Phone jsme se rozhodli držet se pokud možno stejného workflow i u naší aplikace pro Android. Další změny nastaly v souvislosti s tím, že registrace uživatele nebude v naší aplikaci k dispozici, ale bude umožněno přihlášení přes sociální sítě, anebo již předem (učitelem) připraveného účtu. Obrazovka pro přihlášení se v zájmu pohodlí bude zobrazovat pouze do doby, než se uživatel poprvé úspěšně přihlásí, popř. pokud si hráč v nastavení zakáže volbu zapamatování připojeného účtu. 4

5 Obrazovky prototypu 1 Přihlášení do aplikace (tablet) První obrazovka aplikace, která umožňuje přihlášení pomocí účtu Facebook, Google+, Microsoft, anebo již přiděleného účtu). Obrazovka je navržena s ohledem na možnost zobrazení v režimu portrét nebo na menších obrazovkách. 5

6 2 Přihlášení (tablet) Po zvolení přihlášení prostřednictvím přiděleného účtu se zobrazí obrazovka, kde je vyžadováno zadání jména hráče a hesla. 6

7 3 Přihlášení (tablet) V případě zadání chybných přhlašovacích údajů se zobrazí odpovídající popup hláška. 7

8 4 Připojení do hry (tablet) Po úspěšném přihlášení je vyžadováno zadání kódu skupiny hry, do které se hráč chce připojit. 8

9 5 Připojení do hry / našeptávač (tablet) Pro usnadnění zadávání nabízí našeptávač kódy skupin, do kterých se připojili hráči nebo které byly založeny učitelem v okolí připojujícího se hráče. 9

10 6 Hra (tablet) Po úspěšném připojení do hry se objeví obrazovka se samotnou hrou. Obrazovka na tabletu je složena ze dvou fragmentů. V levém se odehrává hra zadáváním a zobrazováním ohodnutých znaků. V pravém jsou stavy jiných hráčů téže skupiny a okno pro chatování s nimi. Pokud je hráčů více, zobrazí se pod nimi šipka a je možné mezi nimi scrollovat. Současné zobrazení samotné hry a chatu umožňuje být hráči stále v obraze. Klávesnici je dán dostatečný prostor, aby se mohla ve spodním řádku rozrůst o speciální znaky staré češtiny, jejichž počet se liší v závislosti na hádaném sousloví. Otazníky v kosočtvercích u hádaných slov slouží jako tlačítko k zobrazení nápovědy, která hráči přiblíží dané slovo. Aby byla funkce těchto symbolů jasnější jsou doprovozena textem Nápověda. 10

11 7 Hra (tablet) Vpravo nahoře v action baru je standardní tlačítko se třemi tečkami (action overflow) pro zobrazení menu voleb (options menu). 11

12 8 Hra (mobil) Na mobilních zařízeních se zobrazuje jen fragment pro samotnou hru, anebo fragment pro chat a je možné se mezi nimi přesouvat pomocí tabů nebo swipe gesta. Taby byly jako navigační element zvoleny z důvodu jejich uživateli dobře známého vzhledu a funkcionality a také protože jsou zároveň indikátorem stavu a jejich přítomnost se nese s dostupností pohodlného swipe gesta. 12

13 9 Chat (mobil) Na mobilních zařízeních se zobrazuje jen fragment pro samotnou hru, anebo fragment pro chat a je možné se mezi nimi přesouvat pomocí tabů nebo swipe gesta. 13

14 Problémy nalezené při testování s uživateli Uživatel 1 1. Není jasné, co znamená přidělený účet (obrazovka 1). Uživatel 2 Doporučení: Změnit text na Učitelem přidělený účet, popř. doplnit text vysvětlující tuto volbu přihlášení. 2. Není jasné, co znamená přidělený účet (obrazovka 1). Doporučení: Změnit text na Učitelem přidělený účet, popř. doplnit text vysvětlující tuto volbu přihlášení. 3. Význam otazníku v kosočtverci (obrazovky 6, 7 a 8) není jasný. Uživatel 3 Doporučení: Změnit text na Tapněte na otazník pro nápovědu ke slovu. 4. Chybí možnost zamezit zapamatování zvoleného způsobu přihlášení ke hře již na přihlašovací obrazovce (obrazovka 1). Doporučení: Přidat zaškrtávací políčko pro nastavení této volby. 5. Nečekané opuštění hry při stisku klávesy zpět na herní obrazovce (obrazovka 6). Doporučení: Přidat popup s výzvou pro potvrzení opuštění hry. 14