… persze csak elméletben, mert nem Shoprenter platformon fut, de eljátszottunk a gondolattal, hogy hogyan nézne ki, és milyen konverzió növelő elemeket tudna alkalmazni, ha az egyik legújabb design témánkat, a Budapestet használná.
A helyesen irányított vállalkozás – mint a helyesen leélt élet – a tökéletességre törekvés folyamata. A jó vállalkozó folyton kutatja, hogyan javíthatna akár csak a legkisebb mértékben is a folyamatain, és hogyan tehetné hatékonyabbá a gondos irányítása alatt üzemelő gazdasági gépezetet.
A Shoprenternél kiemelt figyelmet szentelünk annak, hogy segítsük a partnercégeinket az online értékesítési felületük tökéletesítésében. A webáruház költöztetés szolgáltatásunkat pontosan olyan vállalkozók számára fejlesztettük ki, akiket hiányérzet fog el, amikor a jelenlegi webáruházukra gondolnak, és akik érzik, hogy az online boltjuk nem használja ki teljes mértékben a webes értékesítés minden konverziónövelő fortélyát.
Ebben a cikkben egy gyakorlati példán keresztül mutatjuk be, milyen változtatásokat alkalmaznánk egy webáruházon a tökéletesítés jegyében. Egy olyan webáruházat kerestünk, ami már most is tetszetős és intelligens dizájnnal rendelkezik, jól konvertál és népszerű, hogy bemutathassuk, miként segítheti a szolgáltatásunk nem csak egy kezdő, hanem a profi és sikeres webáruházakat is abban, hogy jóból kiválóvá váljanak.
A KockaÁruház elképzelt megújulása
A KockaÁruház webshopot választottuk esettanulmányunkhoz, ami jelenleg is roppant népszerű a magyar LEGO-rajongók körében, nem csak a kedvező áraiknak, hanem a könnyen kezelhető webáruházuknak is köszönhetően.
Az alábbiakban bemutatjuk, milyen konverziónövelő technikákat sikerült alkalmaznunk a KockaÁruház oldalain azzal, hogy felépítettük azt a Shoprenter egyik legújabb és legmodernebb Budapest témáját használva.
Bár a KockaÁruház megújulását a látványterveken asztali nézeten készítettük el és mutatjuk be, fontos kiemelni, hogy a Budapest design téma teljes mértékben mobilra optimalizált. Ez azt jelenti, hogy minden elem reszponzív módon, a különböző képernyőméretekhez igazodva jelenik meg, amely ma már elengedhetetlen – a legtöbb webshop forgalmának 60–80%-a már mobilról történik.
Felhasználói élmény javítása a fejlécben
Számos fontos módosítást vezettünk be az oldal fejlécébe. A témánk színes és feltűnő kuponsávja azonnal magára vonja a látogató figyelmét a jelenlegi promócióra, és a felhasználó egyetlen kattintással megszerezheti a kuponkódját.
Mindemellett a Budapest témánk áttekinthetőbbé teszi mind a lenyíló kosár tartalmát, mind a keresési találatokat. A KockaÁruház oldalán jelenleg görgethetővé válnak ezek az elemek, ha túlcsordul a tartalmuk; mi ezzel szemben arra törekszünk, hogy véletlenül se rejtsük el a keresett termékeket a felhasználó elől, így a Shoprenter témáját használva első pillantásra áttekinthető a kosár tartalma és a keresés találatainak listája anélkül, hogy a felhasználónak külön görgetnie kellene.
A kosárban a „Fizetés” gomb a legfontosabb konverziós elem, így a színek módosításával gondoskodtunk arról, hogy minden kétséget kizáró módon az a gomb kapja a legnagyobb hangsúlyt a felületen.
A KockaÁruház menüpontjai nem úgy működnek, ahogyan a webáruházak látogatói számítanak a menüpontok viselkedésére: az almenük nem az egér ráhúzásakor, hanem kattintásra jelennek meg, valamint a bizonyos menüpontokra való kattintás egy új oldalra navigálja a felhasználót.
Az efféle unortodox megoldások könnyen frusztrálhatják azokat a vásárlókat, akik azt várják, hogy a webáruház felülete pontosan úgy működjön, ahogy más oldalakon megszokták, és a frusztrációjuk elüldözheti őket az oldalunkról.
A főoldal további elemeinek megújítása
A Budapest téma bevezetésével modernizáción esett át a főoldal. A témánk banner moduljával sikerült jobban kihangsúlyoznunk a promóciós szöveget és a gombot.
Levegősebbé tettük a főoldal kialakítását a szekciók közötti távolságok növelésével, annak érdekében, hogy elkerüljük, hogy a túlzsúfoltság miatt vizuális zajjá váljanak azok a fontos termékek, amiket itt meg szeretnénk jeleníteni. Az átláthatóság jegyében különválasztottuk a termékek listáját névvel ellátott szekciókká, amelyekben vízszintes lapozással böngészhetőek a termékek.
Az alább beágyazott ablakok segítségével könnyedén átgörgethetjük a webáruház főoldalának jelenlegi és az általunk megálmodott megjelenését.
A KockaÁruház főoldala jelenleg:
Görgess az ablakban, hogy a teljes oldalt áttekinthesd!
A KockaÁruház főoldala UX szakértőnk tanácsa és a mi elképzeléseink szerint:
Görgess az ablakban, hogy a teljes oldalt áttekinthesd!
A főoldal elemei közül 3 modulra külön is felhívnánk a figyelmet:
Akciós termékek látványosabb kiemelése
A KockaÁruház megjelenésének egyik kritikus gyenge pontja az akciós termékek kiemelése a terméklistákban. A Budapest témánk termékkártyái élénk kiemelőszínnel, szembetűnő felirattal és a kedvezmény mértékének százalékos feltüntetésével hangsúlyozzák ki az egyes termékekre vonatkozó akciókat, így a felhasználó az első pillantásra kiszúrja a leárazott termékeket a tömegből.
A termékmegjelenítések optimalizálása mellett további elemekkel bővítettük a főoldalt:
Hírlevél feliratkozó modul
A hírlevél feliratkozást ösztönző modul kulcsfontosságú eleme a főoldalnak, amit külön kiemelünk eltérő háttérszín használatával. A feliratkozásra ösztönzést a jelenlegi webáruházban a főoldali banner utolsó képe látja el, ugyanakkor ezt érdemes külön elemként szerepeltetni a főoldalon.
Vélemények modul
A bizalomnövelés céljából kialakítottunk egy további szekciót a felhasználói értékelések megjelenítésére, ami különösen fontos a KockaÁruház szempontjából. Ebben a szekcióban a webáruház fel tudja használni az Árukeresőn kapott több mint 35 000 ötcsillagos értékelését.
Termékkategória-oldal megújulása
A webáruház jelenlegi termékkategória-oldala:
Ez az oldal is több fontos bővítményt kapott a tervünkben. Az oldal tetején a kategória szöveges leírása fogadja a látogatót, ami a tájékozódás mellett a keresőmotorok általi felfedezést is nagyban elősegíti. A leírás alatt pedig az alkategóriák listája jelenik meg a könnyebb navigáció érdekében.
Külön figyelmet szenteltünk a kategória oldalon arra, hogy maximálisan kihasználjuk a baloldali sáv adta lehetőségeket. Optimalizáltuk a szűrő megjelenítését annak érdekében, hogy könnyen megtalálható és első ránézésre értelmezhető lehessen.
A design téma azt is lehetővé teszi, hogy további, vizuálisan jól elkülönülő modulokkal bővítsük az oldalsávot, maximálisan kihasználva a rendelkezésre álló digitális terünket marketing célokra és a vásárlók bizalmának növelésére (pl. hírlevél feliratkozás, ügyfélszolgálat elérhetőségei).
Termékoldal: ahol a legtöbb vásárlási döntés megszületik
A webáruház jelenlegi termékoldala:
A KockaÁruház termékoldalának különösen fontos tökéletesítéseket nyújthat a Budapest téma. Ez a sablon ugyanis eltérő háttérszínnel vonja a látogató figyelmét arra a szekcióra, ami a legfontosabb termékinformációkat, a termékváltozatokat, az árat, a mennyiségválasztót és a kosárba gombot tartalmazza.
Ezek az információk a termékoldal kulcsfontosságú elemei, ezért kiemelt vizuális hangsúlyban részesítjük őket:
A vizuális hierarchia következő elemeként, közvetlenül a kiemelt szekció alatt megjelenítjük a kiegészítő termékeket is. Ez a kis „cross-selling” modul lehetővé teszi, hogy a látogató egyetlen gombnyomásra a kosárba helyezze a jelenlegi termék mellett a további, ahhoz kapcsolódó termékeket is.
Úgyszintén kulcsfontosságú funkció a lebegő „Kosárba” gombunk, ami akkor is a képernyő kihangsúlyozott eleme marad, ha a felhasználó legörget az oldal alsóbb szekcióihoz, mint a hosszú leírás vagy termék vélemények.
A termékinformációt követően további szekciókkal bővítettük a termékoldalt. Ez a digitális terület az egyik legfontosabb hely a webáruházban, ahol további termékeket ajánlhatunk a látogatónknak – a termékoldal böngészésével a látogatónk a határozott kíváncsiságát demonstrálja, így különösen fontos kihasználni a termékoldalunkat arra, hogy további termékekre hívjuk fel a figyelmét, ha a jelenlegi nem nyerte el a tetszését.
Az ide elhelyezett „Csomagajánlat” modul segítségével a felhasználó egy komplett termékcsomagot tehet a kosárba egyetlen kattintással, ami különösen hasznos azokban az esetekben, ha egymást kiegészítő vagy egymásra épülő termékeket árusítunk.
A „Kapcsolódó termékek” modul pedig elősegíti, hogy a felhasználó további olyan termékeket böngészhessen, amik hasonlítanak ahhoz, ami felkeltette az érdeklődését.
A teljes termékoldal, görgethető vezióban:
Konklúzió
A fent bemutatott változások, ha egyenként nem is tűnnek forradalmi javításnak, hatásukat összeadva jelentős konverziónövelő erőt gyakorolhatnak még egy olyan webáruházra is, amit a jelenlegi formájában is az ország egyik legjobb LEGO-webshopjaként ismernek a rajongók.
Láthatjuk tehát, miként segíthet a Shoprenter abban, hogy a jóból kiváló szintre emeljük a boltunk felhasználói élményét.
A témáinkban felhasználható modulokat a konverzióra és a felhasználói élményre való legnagyobb odafigyeléssel alkottuk meg, így a vállalkozók, akik minket választanak, a UX-tervezőink legjobb szaktudását alkalmazhatják a webáruházukban.
Ha Te is fel szeretnéd frissíteni webáruházad megjelenését és szakértőinkre bíznád a téma váltást, keresd bizalommal csapatunkat – segítségükkel akár 1 nap alatt megújulhat Shoprenteres webáruházad!
Kérj egy díjmentes konzultációt és beszélgessünk webáruházad eredményeiről. Segítünk eldönteni, érdemes-e váltanod és hogy melyik téma illene a legjobban a webshopodhoz.
