//Esettanulmányok
Fitness Index webshop megújítás – gyorsabb, átláthatóbb és jobban konvertáló vásárlói élmény
A Fitness Index egy nagy forgalmú, ismert webáruház, amelynek korábbi megújítása után komoly teljesítmény- és UX-problémák jelentkeztek. Az AlapDesign feladata az oldal vizuális és felhasználói élményének újragondolása, a vásárlási folyamat áttervezése, valamint a WooCommerce alapú rendszer technikai optimalizálása volt.
UX/UI design
WooCommerce optimalizálás
Webshop facelift
Vásárlási folyamat újratervezés
Termékoldal UX
Termékkártya design
Szűrőrendszer megújítás
Checkout optimalizálás
AWS szerverkörnyezet
Performance optimalizáció
Black Friday kampányfelkészítés
// Együttműködés
Közös munka
// Fitness-Index
Projektötlet
Az ügyfél egy régi, nagy forgalmú, de elavult webshoppal rendelkezett, amelyet egy másik szolgáltatóval korábban már megpróbáltak megújítani. Bár redesign és új oldalfejlesztés is történt, az elkészült webshop rendkívül lassú lett, a vásárlói élmény nem támogatta megfelelően az értékesítést, és az eladások jelentősen visszaestek. A projekt célja ezért nem egyszerűen egy látványosabb felület kialakítása volt, hanem egy olyan webshop-élmény megtervezése és technikai stabilizálása, amely újra alkalmas nagy forgalom, összetett termékkínálat és kampányidőszakok kiszolgálására.
// Alapdesign
A mi feladatunk
Az AlapDesign feladata az oldal meglévő UI-elemeinek faceliftje, a teljes UX és vásárlási folyamat újratervezése, valamint a webshop technikai teljesítményének optimalizálása volt. Megújultak a termékkártyák, a termékoldalak, a szűrési logika és a kosár–pénztár élmény is. A korábbi egyoldalas checkout helyett egy átláthatóbb, több lépéses wizard folyamat készült, amely jobban vezeti a vásárlót a döntéstől a rendelés leadásáig. Emellett kiemelt figyelmet kapott a nagy termékszám, az eltérő kategórialekérdezések és a szerverterhelés kezelése is.
// Alapdesign
Közös stratégia
A projekt lényege az volt, hogy a vizuális frissítés ne önmagában történjen meg, hanem közvetlenül kapcsolódjon a webshop üzleti és technikai működéséhez. A terméklisták, termékkártyák, termékoldalak, szűrők és navigációs elemek úgy lettek újragondolva, hogy egyszerre legyenek átláthatóbbak a vásárlók számára, könnyebben kezelhetők az adminisztrációban, és hatékonyabban működjenek nagy termékmennyiség mellett is. A fejlesztési folyamat részeként egy WooCommerce-re optimalizált AWS szerverkörnyezet is beüzemelésre került, majd az átadás után teljes performance optimalizáció történt.
// Feladatunk
Fő funkciók
Megújított termékkártyák
A termékkártyák átláthatóbb, vásárlásorientált felépítést kaptak, hogy a felhasználó gyorsabban tudjon dönteni a listanézetekben.
Újratervezett termékoldalak
A termékoldalak UX/UI szinten is frissültek, hogy az információk, termékelőnyök, árak és vásárlási lehetőségek logikusabb struktúrában jelenjenek meg.
Fejlettebb szűrőrendszer
A szűrési élmény megújult, hogy a nagy termékmennyiség mellett is könnyebb legyen releváns termékeket találni.
Többlépcsős kosár–pénztár folyamat
A korábbi standard egyoldalas checkout helyett egy vezetett, wizard alapú vásárlási folyamat készült, amely átláthatóbbá teszi a rendelés leadását.
Intuitív kategória- és márkanavigáció
A sok termékkategória és külön márkaoldal miatt új, könnyebben használható menü- és navigációs logika készült.
Kampányokra felkészített webshop
Az oldal Black Friday és egyéb kiemelt kampányidőszakok kezelésére is fel lett készítve, úgy, hogy az ügyfél később saját maga is tudja módosítani a szükséges kampányelemeket.
// Feladatunk
Márkaarculat
A projekt során nem teljes arculatváltás történt, hanem egy célzott, tudatos márkaarculati finomhangolás. A meglévő Fitness Index vizuális világ megőrzése mellett frissültek a színhasználati szabályok, a komponensek megjelenése és az oldal általános digitális karaktere. Külön figyelmet kapott az arculati betűtípus is: a korábban használt font olvashatósági és performance szempontból sem volt ideális, ezért mérés és optimalizálás után egy gyorsabb, tisztább, jobban használható tipográfiai megoldás került bevezetésre.
#000000
#252525
#707070
#FF7008
#FF5400
#E3E3E3
#FFFFFF
// Esettanulmányok
Kiemelt weboldal elemek
Termékkártya rendszer
A termékkártyák a webshop egyik legfontosabb döntési pontjai, ezért új struktúrát kaptak. A cél az volt, hogy a vásárló már a listanézetben is gyorsan értse az árakat, termékelőnyöket és vásárlási lehetőségeket.
Termékoldal felépítés
A termékoldalak új UX-logikája segíti a vásárlót az információk gyorsabb feldolgozásában. A hangsúly a jobb olvashatóságon, a vásárlási döntés támogatásán és a fontos elemek egyértelmű kiemelésén volt.
Kosár és pénztár folyamat
A rendelési folyamat több lépésre bontva, átláthatóbb formában készült el. Ez segíti a vásárlót abban, hogy pontosan értse, hol tart a folyamatban, és milyen adatokat kell még megadnia.
