Školní mapy: atlas, který se otevře na správné stránce
Soutěžní návrh digitálního školního atlasu. Projekt nebyl realizovaný, takže ho ukazujeme jako UX a UI studii, ne jako spuštěný produkt. Navrhli jsme vstup kódem od školy, vrstvy mapy, měření a porovnání vydání. Vizuální identita je od sesterského nkz.studio, rozhraní naše.
Papírový atlas má jednu výhodu, kterou weby ztrácejí
Papírový školní atlas se otevře tam, kde je založená tužka. Digitální atlasy, které jsme pro srovnání procházeli, začínají přihlášením, výběrem ročníku a rozcestníkem. Než se žák dostane k mapě, uběhne čas, který ve vyučovací hodině nikdo nemá.
Návrh proto nezačal seznamem funkcí, ale jednou větou: co má žák zvládnout během několika vteřin od chvíle, kdy otevře notebook. Odpověď zněla: vidět mapu, o které učitel mluví.
Čtyři obrazovky, na kterých se rozhodlo
Každá z nich odpovídá na jednu otázku z hodiny zeměpisu.
Vstup bez účtu a bez hesla
Žák dostane od školy kód a tím to končí. Žádná registrace, žádný e-mail, žádné heslo k zapomenutí. Kód nese třídu i předmět, takže atlas se otevře tam, kde třída minule skončila. Škola tím zároveň neodevzdává osobní údaje žáků.
Vrstvy místo dvaceti různých map
Názvy států, hlavní města a zeměpisná síť se zapínají zvlášť. Učitel tím z jedné mapy udělá slepou, aniž by hledal jiný soubor. Přepínač dole vedle toho mění typ mapy: politická, obyvatelstvo, slepá.
Měření a porovnání přímo v mapě
Dvě kliknutí změří vzdálenost a ukážou měřítko. Další dvě postaví dva státy vedle sebe s počtem obyvatel a rozlohou. Jsou to úkony, které se v hodině dělají pořád a v papírovém atlasu je nahrazuje pravítko a rejstřík.
Srovnání vydání jako výuková pomůcka
Posuvník mezi starším a aktuálním vydáním ukáže, jak se mapa za ta léta změnila. Vzniklo to z poznámky, že archivní vydání atlasů leží nevyužitá. Dějepis a zeměpis se tím potkají na jedné obrazovce.
Šest částí návrhu
Rozsah, na kterém se dala odhadnout práce.
Mapa rolí
Žák, učitel a správce školy. Kdo vidí třídu, kdo zadává úlohy a kdo spravuje kódy. Bez toho se nedá rozhodnout, co která obrazovka smí.
Stavy rozhraní
Načítání dlaždic, mapa bez připojení, neplatný kód, prázdný výsledek hledání. U mapové aplikace je čekání běžný stav, ne výjimka.
Hledání s napovídáním
Napovídá z názvů v atlasu: sídla, vodstvo, pohoří. Výběr mapu přiblíží a otevře údaje o místě, takže hledání končí v mapě, ne v seznamu výsledků.
Shrnutí kapitoly
Tři věty, které si žák z mapy odnese. Jazyk se mění podle toho, kdo se dívá: jinak pro žáka, jinak pro učitele.
Slovenská mutace
Rozhraní i názvosloví ve slovenštině. Nebyl to překlad navíc, počítalo se s ním od začátku, protože ovlivňuje délky popisků v mapě.
Škála barev, písma a mezer
Navázaná na identitu od nkz.studio. Barevný pruh v hlavičce a patičce je z ní, stejně jako paleta států v mapě.
Dvě rozhodnutí, která návrh drží
Kód od školy místo účtů pro žáky
Účty pro žáky znamenají správu osobních údajů nezletilých, reset hesel a souhlasy rodičů. Kód na úrovni třídy to celé odstraní a přitom stačí na to, aby se atlas otevřel na správném místě. Cena je, že se nedá sledovat pokrok jednotlivce; to jsme v návrhu pojmenovali jako vědomý ústupek, ne jako opomenutí.
Vrstvy místo rozcestníku map
Nabízelo se udělat seznam hotových map a nechat učitele vybrat. Místo toho je mapa jedna a mění se vypínači. Učitel tak nemusí vědět, jak se která mapa jmenuje, a slepá mapa vznikne v hodině za vteřinu.
Klient vybral jiný směr
Soutěž jsme nevyhráli. Klient zaplatil skicovné a šel jinou cestou, takže se nepostavil ani prototyp. Nemáme tedy čísla o užívání, zpětnou vazbu od učitelů ani nic, co by se dalo vydávat za ověřený výsledek.
Zveřejňujeme to přesto, protože ukazuje, jak vypadá naše UX a UI práce dřív, než se cokoliv naprogramuje: mapa rolí, okrajové stavy, vrstvy místo rozcestníku. To je přesně ta část, kterou u návrhu rozhraní předáváme týmům, které si produkt staví samy.
UX a UI návrhMáte vývojáře a chybí návrh?
Napište, co stavíte a kde je váš tým teď. Ozveme se do dvou pracovních dnů.
Co jsme dělali dál
Walio: věrnostní systém pro podnikyKarta v peněžence, terminál pro obsluhu i portál s reportingem.
Branuál: brand manuál jako web, ne PDFStránky, bloky a knihovna assetů s publikováním. Vlastní produkt studia.
Layered: web, který prodá kurz a odbaví účastníkaRezervace s kapacitou, platba a potvrzení na jednom místě.