A küldetés

2016-ban az Auchan Magyarország minket bízott meg az ország első Auchan webshopjának létrehozásával. A cél egyértelmű volt: a hipermarketek teljes kínálatát kellett visszaadni úgy, hogy közben az élmény könnyed maradjon, akár egy egyszerű mobilapplikációban. A bevezetés óta folyamatos termékfejlesztési partnerségben dolgozunk együtt a Loginet Systems fejlesztőcsapatával, negyedévente új verziókat szállítva.

Kihívások

• Óriási termékkatalógus – 30 000+ termék lassította a keresést és a navigációt.

• Mobilos lemorzsolódás – Bár a látogatók 55%-a telefonról érkezett, a vásárlási folyamat mobilon kétszer gyakrabban szakadt meg, mint desktopon.

• Öröklött logisztika – az áruházi átvétel és házhoz szállítási időablakok óránként változtak.

Kutatás és insightok

Moderált használhatósági teszteket kombináltunk valós idejű Google Analytics-adatokkal. Hőtérképes elemzéseinkből kiderült, hogy a vásárlók először az akciókat nézték át, majd azonnal egy megbízható, rövid utat kerestek a megszokott termékeikhez. Egy emlékezetes idézet egy elfoglalt szülőtől:

„Csak annyit akarok, hogy a ma esti vacsora a kosárban legyen, mire a gyerekek befejezik a házit.”

Az adatok alátámasztották ezt az érzést: ha a vásárlás 3 érintésnél többet igényelt, a felhasználók jelentős része lemorzsolódott.

Moderált használhatósági tesztlabor

Senior UX kutatóink feladatalapú teszteket végeztek desktop és mobil prototípusokon. Szemkövetéses vizsgálatok és hangos gondolkodásos módszer segítségével azonosítottuk a fennakadásokat a harmadik kattintás után. Az eredményeket még aznap délután a backlogba rögzítettük.

Villámgyors drótváz sprintek

Egy háromfős csapat – vezető dizájner, UX-stratéga, Loginet fejlesztő – minden reggel Miro-ban készített gyors, alacsony részletességű vázlatokat, amelyeket délre validáltak a stakeholderekkel, és az ötödik nap végére kattintható Figma prototípust adtak át. A ciklust addig ismételtük, amíg minden akadályt el nem hárítottunk.

Atomic Design System kialakítása

Az összes UI-elemet alapegységekre bontottuk (térköz, színek, tipográfia), majd ezekből reszponzív komponenseket építettünk Figma-ban. A Storybook segítségével történő átadás biztosította, hogy weben és natív applikációban is egységes legyen a megjelenés, ezáltal 22%-kal csökkentettük a front-end utómunkálatokat.