Reference / Vývoj
Jak nový design ChytráLékárna.cz zvýšil konverzní poměr o 28 %
Po roce a půl provozu původního webu se e-shop ChytráLékárna.cz rozrostl natolik, že přestal vyhovovat jak zákazníkům, tak obchodním cílům klienta. Cílem redesignu bylo dát jasnou prioritu e-shopu a výrazně zlepšit použitelnost celého řešení.
meziroční nárůst konverzního poměru
implementace nového designu
personalizace produktové nabídky
Redesign
Chytré lékárny
Po roce a půl provozu původního webu se e-shop ChytráLékárna.cz rozrostl natolik, že přestal vyhovovat jak zákazníkům, tak obchodním cílům klienta. Web původně kombinoval prezentaci kamenných lékáren s online prodejem, což vedlo ke zhoršené orientaci, složité navigaci a nižší efektivitě nákupního procesu. Cílem redesignu bylo dát jasnou prioritu e-shopu a výrazně zlepšit použitelnost celého řešení.
V čem
spočívala výzva?
Největším a v podstatě jediným problémem první verze webu ChytráLékárna.cz bylo, že se snažil plnit dvě funkce naráz. Web sloužil pro online prodej, ale zároveň fungoval jako prezentace kamenných lékáren. Samotný e-shop se tak nacházel prakticky až ve druhé úrovni navigace a na úvodní stránce soupeřily o pozornost zákazníků online a offline akce. To mělo další negativní efekt, protože zákazníky často mátl rozdíl mezi akční online cenou a cenou v kamenné lékárně.
Během prvního roku provozu rostl jak obrat a počet objednávek e-shopu, tak i počet kategorií produktů. K lékům přibyly například zdravotnické potřeby, erotické pomůcky nebo speciální sekce chlazeného zboží. Původní design tak dosáhl svého limitu a pro další rozvoj bylo nezbytné začít s redesignem s cílem dát zásadní prioritu online prodeji.
Zpět
k rýsovacím prknům
Redesign pro nás znamenal návrat na začátek projektu, protože se změnily priority cílových skupin uživatelů, které měl e-shop obsluhovat. Zásadním způsobem se zvýšila důležitost online prodeje, což se projevilo jak na úvodní stránce, tak i v hlavním menu, které se proměnilo v menu produktové.
Všechny změny jsme zanesli do interaktivního prototypu. Již v průběhu jeho testování bylo zřejmé, že jsme na správné cestě. Uživatelé se lépe orientovali v kategoriích produktů i v akcích a speciálních nabídkách na úvodní straně.
V rámci redesignu jsme přepracovali a rozšířili možnosti filtrování produktů a v neposlední řadě připravili plochy pro personalizovanou nabídku produktů, kterou jsme měli zajištěnu díky domluvené integraci Luigi's Box.
A přišel čas
na „umčo"
Součástí redesignu byla také drobná úprava vizuálního stylu, ze kterého naše art directorka Petra Kašparová vypustila zdobné, ale produkčně náročné ornamenty z původní corporate identity. Vypuštěním některých samoúčelných detailů z designu jsme docílili toho, že si je klient schopen sám připravovat bannery na akce a události. Stačí mu k tomu sada šablon, kterou jsme pro něj v rámci redesignu připravili. Design přitom zůstal jasně odlišitelný od konkurence.
Technické
zpracování
Implementaci nového designu e-shopu zvládlo vývojové oddělení během dvou měsíců. Abychom šetřili náklady, webdesignéři nezpracovávali detailní návrhy všech podstránek. Vývojáři tak vycházeli z design systému a především úpravy textových stránek s designérem pouze konzultovali.
Za zmínku stojí kompletní implementace personalizovaných nabídek s využitím nástroje Luigi's Box. Abychom zachovali možnosti prioritizace výpisů a možnost vkládat do nich bannerové plochy administrátorem e-shopu, zvolili jsme náročnější backendovou implementaci Luigi's Box, který jsme využili naplno. Napojili jsme jak personalizované doporučovače, tak i řazení produktů v kategoriích a nezapomněli jsme ani na upsell a cross-sell nabídky v košíku a objednávce.
A jaké
byly výsledky
Především spokojenější zákazník. Jak ten náš, který je nadšený z e-shopu, kterým může směle konkurovat největším hráčům na trhu, mezi které se pomalu zařazuje, tak i zákazník samotného e-shopu. Ten snadněji najde a nakoupí produkty, po nichž touží. Pro obě tvrzení máme důkazy. Díky redesignu se nám podařilo meziročně zvýšit konverzní poměr o 28 %, což znamená efektivnější kampaně a větší obrat při stejné návštěvnosti.
Jak jsme
postupovali
Jak jsme to všechno udělali a co máme zažité při každé implementaci.
Chci konzultaciAnalýza dat a chování uživatelů
Zkoumali jsme analytická data, nákupní cesty a problematická místa v nákupním procesu. Identifikovali jsme bariéry, které zpomalovaly orientaci v nabídce a snižovaly pravděpodobnost dokončení objednávky.
Návrh struktury a wireframů
Navrhli jsme novou informační architekturu s jasnou prioritou e-shopu. Vytvořili jsme wireframy klíčových stránek, zaměřené na přehlednost kategorií, logiku filtrování a rychlejší cestu k nákupu.
Prototypování a testování
Interaktivní prototypy jsme testovali na reálných scénářích nákupu. Ověřovali jsme srozumitelnost navigace, práci s filtry i čitelnost produktových detailů a návrh průběžně ladili podle zpětné vazby.
Vývoj a nasazení
Na základě otestovaného návrhu jsme připravili finální UI design a podklady pro implementaci. Důraz jsme kladli na konzistenci, snadnou správu obsahu a připravenost e-shopu na další rozvoj a personalizaci nabídky.
Špičkové technologie
a zlomové inovace
Používáme moderní technologie zajišťující vysokou efektivitu vývoje a stabilitu i bezpečnost našich řešení v souladu s normou ISO 27001. Specializujeme se na vývoj v PHP a frameworku Symfony, na frontendu spoléháme na React a jsme implementačními partnery systému pro správu obsahu Sulu CMS.
Webové portály, aplikace, e-shopy i další řešení provozujeme na moderní high-availability architektuře založené na technologiích Docker a Kubernetes.