Informační architektura pro e-shop Motocentrum HK

Projekt vznikl jako moje diplomová práce v rámci UX/UI designu a navazoval na přípravu nového e-shopu Motocentra HK. Cílem bylo navrhnout informační architekturu pro specializovaný e-shop s moto oblečením, doplňky, příslušenstvím a náhradními díly.

Starý e-shop měl za sebou roky provozu, postupných úprav a rozšiřování sortimentu. Kvůli tomu vznikla příliš široká a nepřehledná struktura kategorií, ve které bylo pro zákazníky složité rychle najít konkrétní produkty.

Původní e-shop obsahoval více než 2 500 produktů, 19 hlavních kategorií a přes 150 podkategorií první úrovně. Mnoho kategorií vznikalo postupně podle aktuálních potřeb, značek nebo kolekcí, ne podle toho, jak nad sortimentem přemýšlejí zákazníci.

Zákazníci se tak mohli snadno ztratit, hledat stejný typ produktu na více místech nebo spoléhat pouze na vyhledávání. E-shop měl zároveň omezené možnosti filtrace a nebyl dobře propojený s hlavním webem Motocentra HK.

Mojí rolí bylo navrhnout a ověřit novou informační architekturu e-shopu. Nepracovala jsem na samotném UI designu prototypu, ten připravovala agentura Effecto ve vývojovém prostředí nového e-shopu.

Já jsem se zaměřila na UX výzkum, návrh struktury kategorií, testování s uživateli, vyhodnocení výsledků a přípravu doporučení pro další úpravy e-shopu.

Nejdřív jsem zanalyzovala původní stav e-shopu, konkurenční řešení a zvyklosti v e-commerce. Zajímalo mě hlavně to, jak specializované moto e-shopy pracují s kategoriemi, filtrací, náhradními díly a propojením sortimentu.

Potom jsem připravila open card sorting se 42 kartami produktových kategorií. Do testování bylo rekrutováno 71 lidí a 30 z nich card sorting dokončilo. Díky tomu jsem mohla zjistit, jak uživatelé přirozeně seskupují produkty a jaká pojmenování kategorií jim dávají největší smysl.

Na základě výsledků jsem navrhla novou strukturu e-shopu. Místo široké a roztříštěné architektury jsem navrhla užší, hlubší a logičtější systém kategorií, který více pracuje s taxonomiemi a filtry. Díky tomu bylo možné redukovat více než 45 % původně používaných kategorií.

Návrh jsem následně ověřila pomocí tree testingu. Test porovnával původní a novou informační architekturu na stejných 9 úkolech. Test dokončilo 28 participantů. Díky tomu bylo možné porovnat, kde se uživatelé orientují lépe, kde váhají a které produkty by měly být dostupné z více míst.

Po zapracování výsledků byla upravená informační architektura implementována agenturou Effecto do prototypu nového e-shopu. Ten jsem následně otestovala v moderovaném usability testingu s 8 participanty.

Nová informační architektura postavila e-shop na jasnějším rozdělení sortimentu a větším využití filtrace. Cílem nebylo jen „uklidit kategorie“, ale vytvořit systém, který bude odpovídat tomu, jak zákazníci reálně hledají moto vybavení.

Struktura nově pracovala s kategoriemi pro oblečení a doplňky, příslušenství na moto a náhradní díly. U náhradních dílů počítala s filtrací podle značky, modelu a roku výroby motocyklu. U oblečení a doplňků pak s filtry jako značka, velikost, barva, pohlaví a dostupnost.

Testování zároveň ukázalo, že některé produkty uživatelé vnímají víc podle účelu než podle přesného typu produktu. Například zavazadla, interkomy nebo rukavice bylo potřeba řešit citlivěji, protože je lidé hledali ve více různých částech stromu.

Součástí projektu byl audit původní informační architektury, analýza konkurence, open card sorting, návrh nové struktury kategorií, tree testing, vyhodnocení výsledků, moderované usability testingy prototypu a report s doporučeními pro další úpravy.

Nový návrh zlepšil přímou nalezitelnost produktů o 11 %, aniž by se zhoršily časové ukazatele. Úspěšnost prvního kliknutí dosáhla v nové struktuře průměrně 95 %, což ukázalo, že hlavní kategorie byly pro uživatele srozumitelnější.

Usability testing prototypu potvrdil, že uživatelé oceňovali hlavně moderní vzhled, přehlednost, funkční vyhledávání a dobře dostupné kontakty. SUS skóre dosáhlo hodnoty 68 bodů, což ukázalo celkově použitelný systém, ale zároveň prostor pro další zlepšení.

Nejdůležitější doporučení se týkala okamžité aplikace filtrů po výběru parametrů, lepšího zobrazení QR platby, jednoduššího výběru výdejního místa, doplnění velikostních tabulek, jasnějšího propojení webu a e-shopu a úprav kategorizace u problematických produktů.

Projekt mi ukázal, jak velký rozdíl může udělat informační architektura. U e-shopu nestačí mít hezký design a široký sortiment. Zákazník musí hlavně rychle pochopit, kde je, kudy má jít dál a kde najde produkt, který hledá.

Zároveň jsem si ověřila, jak důležité je nespoléhat jen na vlastní logiku nebo zvyklosti firmy. Produkty, které interně dávají smysl v jedné kategorii, mohou zákazníci hledat úplně jinde. Právě testování s reálnými lidmi pomohlo odhalit rozdíl mezi tím, jak je sortiment spravovaný uvnitř firmy, a tím, jak o něm přemýšlí zákazníci.

Největší hodnotu pro mě měl celý iterativní proces. Od analýzy přes card sorting a tree testing až po usability testing prototypu jsem mohla sledovat, jak se z dat postupně skládá konkrétní řešení pro reálný e-shop.