Chcete si pořídit lampu on-line? Hned vám v hlavě blikne Svět svítidel. Jak by taky ne. Společnost Donoci s.r.o. se za necelých třicet let fungování stala opravdovým velikánem v Česku i na evropských trzích.
O to větší výzva bylo tvořit redesign pro firmu takových rozměrů. Jak ovlivnily technické změny rychlost jednoho z nejbleskovějších webů české e-commerce a jaké nové funkce e-shop doslova rozzářily? Na to si společně posvítíme níže v článku. Navíc v něm najdete i rozhovor s Monikou Pilátovou, která celý projekt na Donoci s.r.o. vedla.
E-shop je plně responzivní
Mistři světla
Donoci s.r.o. osvětluje domovy už od roku 1996. Funguje ve 26 zemích a je tak 2. největším prodejcem osvětlení v Evropě. Součástí týmu je přes 300 zaměstnanců a každodenním pomocníkem je i umělá inteligence. Lampy skladují ve zbrusu nové hale o velikosti 9 000 m2.
Haly, kde je připraveno 2 000 000 lamp skladem
S legendárním online obchodem táhneme za jeden provaz už dobrou řádku let. Dosáhli jsme spolu ocenění Digital Heroes 2023 a titulu vítěze Shop Roku by Heureka od roku 2019 až do 2023.
Jak redesign e-shopu ovlivňuje jeho rychlost
On-line obchod Svět svítidel patří mezi deset nejrychlejších českých e-shopů. Proto bylo maximálně důležité, abychom technickými úpravami negativně neovlivnili jeho bleskové načítání.Tento úkol jsme vyzvali s dlouhodobými parťáky PAGESPEED, kteří pro vás mají užitečné rady, jak během redesignu udržet rychlost e-shopu.
1. Příprava
Dejte si s tvůrcem redesignu vědět dostatečně dopředu a během celého projektu buďte aktivně ve spojení. O velkých technických změnách komunikujte s vývojáři před jejich uskutečněním. Například přechod na moderní javascriptové frameworky bez přípravy může zarýt velký šrám na rychlosti webu.
2. Měření
Už před prvními změnami spusťte měření rychlosti (monitoring PLUS, CrUX data od Google, měření uživatelů RUM…) a analyzujte to během celého projektu. S výsledky seznamujte i další spolupracující týmy.
3. Připomínkování
První kolo připomínek by mělo nastat už ve chvíli, kdy jsou připravené nakódované šablony. Další poté ve fázi stagingu, kdy dojde k napojení na backend stránek. K poslednímu extra důležitému připomínkování dojde ve chvíli, kdy je nový e-shop ostře spuštěn po delší období a dokážete vysledovat změny v chování zákazníků.
Metriky Core Web Vitals během redesignu zůstaly na původní úrovni či se zlepšily, zdroj: PAGESPEED
Díky správným postupům zůstaly metriky během změn na původních hodnotách jako před redesignem. A to je senzační. Děkujeme do PAGESPEED.cz.
Nové klíčové funkcionality
Před samotnou změnou jsme se s klientem věnovali UX, uživatelskému testování i optimalizaci html. Transformací prošlo celkem 26 mutací e-shopu a komplexní redesign Světa svítidel probíhal souběžně uvnitř i navenek on-line obchodu.
V backendu došlo k důkladnému refaktorování softwaru. Vyměnili jsme javascript pluginy, revidovali stávající a aktualizací prošla také databáze. A jaké změny rozzářili frontend webu?
Produktové kategorie z více pohledů
Abychom zákazníkům ulehčili hledání vysněné lampy, produkty na veřejné straně kategorizujeme podle jejich charakteru (vnitřní, venkovní, LED..), podle jejich umístění (ložnice, zahrada...) či podle značky. Vzhledem k obrovskému počtu produktů se dá ve výpisu podkategorií scrollovat. A navíc se přímo mezi podkategoriemi objevuje také poradce s výběrem.
Scrollovací výpis produktových podkategorií
Nákupní rádce přímo mezi podkategoriemi
Nákupní košík rychle a přehledně
V mezikošíku a košíku jsme provedli zásadní změny. Cílem bylo, ať je cesta košíkem přehledná a vyplňování formuláře jednoduché. Dnes košík zahrnuje 3 logické kroky i odpočet dopravy zdarma.
První krok nákupního košíku s odpočtem dopravy zdarma
Formulář s vysvětlivkami ve třetím kroku košíku
Zákaznická registrace i přihlášení během pár sekund
Samozřejmostí byla také implementace nové funkce přihlašování skrze FedCM od Seznam.cz nebo přes Google či Metu. Zákazníkovi se tak vytvoří uživatelský profil na základě existujícího emailového účtu. Ušetří to čas, je to pohodlné a e-shopu poroste databáze. O dalších výhodách této funkce se dočtete v našem článku.
Registrace i přihlášení během pár kliknutí
Slevový kupón na jeden klik
Když zákazníka zaujme pěkná sleva na osvětlení, nemusí si kupón označovat a kopírovat či přepisovat. Ve výrazné horní liště pouze jednou klikne, kupón se automaticky zkopíruje do schránky a pak už ho jen využije v košíku. Uživatel získá svou slevu pouze jedním kliknutím a bude tak více motivovaný k dokončení nákupu.
Informační lišta se slevovým kupónem a CTA
Co na web říká Monika Pilátová, která redesign za Donoci s.r.o. vedla?
Přibližte nám, prosím, jak z vašeho pohledu celý projekt probíhal.
„Musím říct, že ze začátku jsme měli trochu obavy, jelikož jsme si stanovili docela šibeniční termín. Byl prosinec 2023 a my chtěli koncem června 2024 spouštět redesign pro všech našich 27 e-shopů. Přičemž Programia měla na programování vyhrazené přesně čtyři a půl měsíce. Žádné velké zpoždění nepřicházelo v úvahu, protože jsme věděli, že bychom pak spouštěli do vánoční sezony. Takže to byl docela velký tlak na obě strany.
Programia i my jsme dělali vše pro to, aby se termín stihl a nakonec jsme 16.7.2024 úspěšně spustili nový vzhled našich e-shopů. Všichni v okolí mí pak říkali, že nevěří, že někdo dokázal spustit redesign za tak krátkou dobu a jen se zpožděním pár týdnů oproti plánovanému datu."
Programia na weby implementovala několik nových funkcí. Vypíchněte ty za vás nejklíčovější.
„Nový vzhled e-shopů měl být odlehčenou verzí té staré, takže jsme funkce spíše škrtali než přidávali. Především i kvůli mobilní verzi, na kterou jsme kladli velký důraz. Z nových funkcí se mi moc líbí modul Oblíbené kategorie na hlavní stránce e-shopů, díky kterému si můžeme velmi snadno řídit, jaké kategorie na kterých e-shopech mají být. Do budoucna by to mělo být ještě více interaktivní a zákazník by se mohl prokliknout rovnou na dané produkty přímo z dlaždice kategorie."
Je něco, co vás během procesu překvapilo?
„Co nás překvapuje asi neustále, nejen během redesignu, jsou nařízení EU a další legislativní věci, které musíme dodržovat. Mnohdy nám to dosti komplikovalo nejen návrh nového designu, ale především i programování, jelikož jsme museli myslet na všechna nařízení a jejich dodržení. Dle mého názoru, i na úkor přehlednosti pro zákazníka."
Řekněte nám, co jak na takovou změnu reagují vaši zákazníci, partneři či tým.
„Dostává se nám zpětné vazby a je z 90 % pozitivní. Jak z firmy, tak i od zákazníků. Myslím, že to je dáno i tím, že jsme během celého procesu redesignu průběžně komunikovali tuto změnu per celou firmu. Jednotlivé oddělení jsme seznamovali s novým designem. Probírali s nimi, jestli jim nebudou chybět funkce, které chceme dát ze stránek pryč. Jestli souzní se změnami, které připravujeme a zapracovávali i jejich zpětnou vazbu.
Od zákazníků pak především kvůli tomu, že jsme web navrhovali pro ně. Aby se zkrátila nákupní cesta. Aby lépe našli, co hledají. Přidali jsme spoustu parametrů do filtrů, nové dopravce i platby. Takže myslím, že to spolu s novým designem naše zákazník potěšilo."
Monika Pilátová, Donoci s.r.o.
Designový e-shop Svět-svíditel.cz s designovými lampami
Jak redesign hodnotíme my z Programie
„Termín zhotovení projektu byl šibeniční, ale zvládli jsme ho a výsledek hřeje u srdce. :) Hladkému průběhu vývoje určitě pomohly pravidelné call a chaty s klientem. Vývoj však tímto nekončí. Máme v zásobě spoustu nových features a námětů pro další zrychlení e-shopu."
Petr Rzeplinski, specialista Programia
Jestli chcete také rozzářit svůj stávající e-shop, ozvěte se nám do Programie. Společně rozsvítíme váš on-line obchod.