Pár héttel ezelőtt a zárt Facebook csoportunkban (Shoprenter Klub) jelentettük be elsőként a jó hírt, hogy egy újabb szolgáltatással bővült a Shoprenter ökoszisztéma. A szolgáltatás lényege, hogy segítünk ügyfeleinknek webáruházuk kinézetének módosításában. A szolgáltatás keretében frontend fejlesztőnk az előzetesen átbeszélt igényeket fogja megvalósítani a webáruházban meghatározott időkereten belül.
A saját rendszerünket nálunk jobban senki sem ismeri, így garantált, hogy a lehető legrövidebb idő alatt a legjobb minőségű támogatásra tehetsz szert a saját fejlesztőinktől.
Na de nézzük is, hogy mit jelent ez a gyakorlatban. A szolgáltatás bevezetése előtt az első pilot projektjeink között szerepelt a Szent András Sörfőzde webáruház, akikkel egy fél napot dolgoztunk együtt*. Az üzemeltetők szerettek volna pár megjelenésbeli változtatást, valamint a mobil nézetet akarták tovább optimalizálni.
*A szolgáltatás a bevezetést követően már napidíjas rendszerben működik.
Röviden a Szent András Sörfőzdéről
A Szent András Sörfőzde története közel 30 évvel ezelőtt kezdődött és ez idő alatt saját receptúrákat és új sörfajtákat fejlesztett ki a folyamatos kísérletezés során. Ők voltak például az elsők, akik Magyarországon valódi gyümölcsből készült sört dobtak a piacra, valamint elsőként léptek a sörök palackozásának útjára is.
Folyamatos fejlődésüknek köszönhetően ma már több mint félszáz hazai és nemzetközi díj büszke tulajdonosai, többek között ilyen az Ország Söre vagy az Év Sörfőzdéje díj.
Termékportfóliójukban több mint 30 féle sörtípus található meg, ugyanakkor a folyamatos kísérletezés hívei, így a Teszt András nevű kedvezményezésükben egy-egy alapanyaggal, egy-egy sör újragondolásával, vagy a sörfőzők képzeletének (és néha az eszközök technikai) határaival játszanak.
Webáruházukat a COVID kezdetén hozták létre. Ehhez a Shoprenter Gold csomagját és az Amsterdam design témát választották. Viszonylag kicsi, körülbelül 110 termékszámmal üzemel a webáruház jelenleg.
Online üzletük továbbfejlesztése kapcsán keresett meg minket Magyar Péter a cégtől, és az e-mailes egyeztetés után az alábbi igényeiket 1-2 napon belül meg is valósítottuk (nettó fejlesztési időben ez 5 óra volt csupán).
1. Fejléc átalakítása
A gyári Amsterdam design téma fejlécében a logó és a bal oldali szöveges menüpontok méretezésén változtattunk, ahol a logó fókuszáltabb megjelenítése volt a fő cél.
A keresés mező pozícióján is módosítottunk, ezentúl nem a kategóriák menüsorában jelenik meg az asztali nézeten, hanem alatta, így a termékkategóriák keresés közben is láthatók maradnak.
Ezen felül apróbb színezések eltüntetését is kérték tőlünk.
Gyári Amsterdam design téma:
A Szent András Sörfőzde módosított fejléce:
Alapértelmezetten a hamburger menüben a termékkategóriák és az információs menüpontok jelennek meg Amsterdam téma esetében.
A webáruház szerette volna, ha az információs menüpontok helyett itt is ugyanazok a menüpontok szerepelnének, mint ami asztali nézetben is látható a fejléc bal oldalán:
- Rólunk
- Heti ajándék
- Blog
- GYIK
Emellett egy speciális, a webáruház színvilágához passzoló kiemelést kértek a Heti ajándék menüpontra.
Gyári Amsterdam design téma:
A Szent András Sörfőzde módosított hamburger menüje mobilon:
3. Felhasználói élmény javítása mobilon
Ahogy desktop nézeten is, ugyanúgy mobil nézeten is hangsúlyosabb kiemelést kapott a logó a fejlécben.
A másik fontos változás a mobilon megjelenő bannereknél történt. Az Amsterdam design téma bannerkezelő moduljának egyik lehetősége, hogy tölthetünk fel külön bannereket, melyek csak mobil eszközökön jelennek meg.
Ennél a webshopnál a főoldalon a bannerek alatt 2 db infografika volt beillesztve egy egyedi HTML modulba képként. Ezzel az volt a probléma, hogy ha mobilon böngésztük az oldalt, akkor a képekre alkalmazott reszponzivitás szabályai lettek alkalmazva, azaz nem lógott ki, megjelent a kép a mobilos kijelző képernyőjéhez igazodva, ugyanakkor olvashatatlan volt a méretarányok miatt.
Így nézett ki a mobil nézet eredetileg:
Mobil nézet a módosítás után:
Ezt azzal orvosoltuk, hogy HTML kódok segítségével építettük fel a modul tartalmát, ami korábban egy kép volt. Ez minden szempontból előnyös, ugyanis:
- Mobil eszközön is olvasható a modulban szereplő tartalom (a webáruház előnykommunikációja).
- Gyorsabb lett az oldalbetöltés, ugyanis csökkent a letöltendő adatok mérete, így az előző ponttal együtt javul a felhasználói élmény.
- Asztali és mobil nézetben is küldünk releváns adatokat a keresőrobotok számára, így a SEO-ra is pozitív hatása van.
Szeretnél Te is nagyobb hangsúlyt fektetni a felhasználói élményre (User Experience – röviden: UX)? Akkor a UX elemzésünk pont neked való! Ismerd meg Te is, hogy melyek azok a kisebb-nagyobb hibák a webshopodban, melynek kijavításával a látogatóid és vevőid igényeit jobban ki tudod elégíteni!
Visszajelzések a fejlesztésről
Ahogy fentebb is írtunk a megvalósítás csupán 1-2 napot vett igénybe és ügyelünk állítása szerint minden gördülékenyen, időben és precízen történt az elvárásaiknak megfelelően.
“Elégedettek vagyunk a munka minőségével és a gyorsaságával. A kapcsolattartónkkal folytatott megbeszélés is gördülékenyen ment, úgy éreztük megtaláltuk a közös hangot. A csapat azonban minden kérdéshez, problémához kreatívan állt hozzá, így nem csak elvégezték a kiszabott munkát, de szakmailag javasoltak is optimális megoldásokat” – Magyar Péter (Szent András Sörfőzde).
A közös munka végeztével nemcsak a projektre kérdeztünk rá, hanem közkedvelt termékeik kapcsán is beszélgettünk picit. 🙂 Arra a kérdésre, hogy mely söröket ajánlják leginkább, ezt válaszolta Péter:
“Mindegyiket, de persze fontos, hogy alapból milyen típusú söröket kedveltek. Aki nem sörös, annak egy gyümölcsöset, aki a hagyományosabb ízeket szereti, annak egy Muttit, vagy Magyar Vándort, aki pedig valami különleges IPA sörre vágyik, annak egy Ködfelhőt ajánlanék.”
Bízd ránk az átalakításokat
Ha az előbb javasolt ízletes sörök kortyolgatása mellett Te is szeretnéd, hogy webáruházadban megvalósítsuk egyedi igényeid, keress minket bátran és beszéljük át az elképzeléseid!
Inspirációként említünk pár dolgot, ami egy nap fejlesztésbe belefér:
- egyedi aloldal tervezés
- egyedi kategória lenyíló
- egyedi Shoprenter hírlevél sablon tervezés
- dinamikus modul fejlesztés
- formázott címlapi SEO szöveg
- mobilra optimalizált fejlesztés
- mozgó elemek
- A/B tesztelés
- design téma váltás
- téma testreszabása
- tömeges termék módosítás
- modul beállítások
- menedzselés
- 3. feles megoldások beillesztése frontend kódba
- egyedi design klónozás és beállítás
Ha nem találtad a listában amire szükséged lenne, érdeklődj nálunk és egyeztessünk.
Legyen a Te webáruházad is olyan, amilyennek igazán megálmodtad! Kérd frontend fejlesztőink segítségét és valósítsd meg egyedi igényeidet profik segítségével!
A szerzőről:
A társszerzőről:
