//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
Fitness Index webshop főoldal asztali és mobil nézetben
// 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

full coverage

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.
article

Ú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.
search

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.
shopping cart

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.
flowchart

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.
campaign

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

Fitness Index webshop – termékoldal
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.
Fitness Index webshop – termékoldal
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.
Fitness Index webshop – kosár oldal
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.
Fitness Index webshop – akciós termékek oldal
Kampánykezelési elemek
A webshop felkészült a Black Friday és hasonló kampányidőszakok lebonyolítására. Az ügyfél számára olyan szerkeszthető felületek és megoldások készültek, amelyekkel a kampánykommunikáció és az akciós megjelenés önállóan is kezelhető.

Eredmények

// 01

Stabilabb technikai alap nagy forgalomhoz

A WooCommerce-re optimalizált AWS szerverkörnyezet és az átadás utáni performance optimalizáció stabilabb alapot adott a nagyobb termékmennyiség és összetett lekérdezések kezeléséhez.
// 02

Átláthatóbb vásárlói élmény

A terméklisták, termékoldalak, szűrők és checkout folyamat újratervezésével a vásárlói út logikusabbá és könnyebben követhetővé vált.
// 03

Professzionálisabb, frissebb webshopmegjelenés

A facelift során az oldal megtartotta a márka alapkarakterét, de modernebb, letisztultabb és megbízhatóbb digitális megjelenést kapott.
// 04

Kampányidőszakokra felkészített működés

Az oldal nemcsak hétköznapi webshophasználatra, hanem intenzívebb értékesítési időszakokra is fel lett készítve, különös tekintettel a Black Friday kampányokra.
// Esettanulmányok

Idővonal

Felmérés

≈ 3 hét · Üzleti stratégia és rendszerterv

UX & design tervezés

1 hónap

UI design

1 hónap

Fejlesztés

2 hónap · UI design + 2 hét csúszással

Szerver optimalizálás

2 hét · párhuzamosan

Éles környezeti optimalizálás

1 hónap

Utánkövetés

folyamatos
HÓNAPOK 1. 2. 3. 4. 5. 6.
// Kezdjük el

Van egy projektötleted?

Beszéljük meg, vagy írj, ahogy neked kényelmesebb