Případová studie: Jak navrhnout úspěšný e-shop

Dostal jsem důvěru provést redesign e-shopu přední české pražírny kávy. Povedlo se. Za 2 měsíce po spuštění navštěvuje e-shop o 22% více uživatelů a tržby se zvýšily o 11%.

Zatím se jen rozjíždíme. E-shop čeká na kompletní přeindexaci od vyhledávačů a pro přesnější vyhodnocení sbíráme data. Už teď jsme ale dílčí cíle několikanásobně překonali.

Aktualizace: po 3 měsících zvýšení tržeb o 17% a rosteme o desítky procent

Co všechno jsme pro úspěšnou změnu udělali?

O Coffeespot

Coffeespot je rodinná pražírna kávy. Najdete ji v obci Huštěnovice v malebném kraji moravského Slovácka. Od roku 2011 působí na českém trhu nejen jako pražírna kávy s kamennou prodejnou, ale spustili i svůj e-shopem. Nestojí za nimi žádný investor. Vše, co dělají získali na základě svých vlastních zkušeností i chyb.

Svou kávu pravidelně dodávají např. do sítě prodejen Sklizeno nebo do Levandulové farmy. Jsou součástí komunity nejznámějších foodblogerů v ČR - Gastrokroužek.

Před navázáním spolupráce klient řešil technické problémy s e-shopem a poptával možnost jeho celkové optimalizace. Kontaktoval mě na doporučení.

Pražírna kávy Coffeespot
Jiří Plšek - vrchní pražič kávy Coffeespot

Jak jsem postupoval

Jak správně provést redesign e-shopu? Neexistuje univerzální odpověď. Každý projekt má jiné cíle a svá časová, finanční nebo technická omezení.

Design není to samé jako grafická podoba. Design řeší, jak věci fungují. Při práci používám designové myšlení - proces řešení konkrétního problému.

Designové myšlení
Můj designový proces

Krok #1 - Poznávání

Ptám se. Hodně se ptám a zjišťuji. Pro zvolení optimálního řešení jsem nejprve potřeboval poznat:

  • Klientovo podnikání (pozice na trhu, cílová skupina, konkurence, marketingové kanály)
  • Sortiment (zboží, marže, co se prodává, co se neprodává)
  • Současný stav (data z analytiky, chování návštěvníků webu, rozhodovací proces)
  • Slabé a silné stránky (na čem můžeme stavět)
  • Konkurenční výhody (čím se odlišíme od ostatních)
  • Procesy ve firmě (komunikace, kompetence, vytíženost)

Používám speciální vstupní dotazník, sady otázek a procesů.

Kdo je zákazník

Pro další zajištění odpovědí na otázky jsem provedl uživatelský výzkum mezi zákazníky. Samozřejmě jsem musel provést zkušební objednávku a kávu ochutnat. Hned na začátku mě Coffeespot náležitě vybavil a spolupráce mohla začít.

Instagram Lukáš Dubina
Instagram - zásilka z e-shopu dorazila, jde se testovat

Krok #2 - Vize, cíle

E-shop chceme efektivně rozvíjet i do budoucna. Proto jsme si stanovili vizi a cíle, kam se chceme dostat v časovém horizontu. Vize vás neustále nutí se posunovat vpřed. Cíle slouží k tomu, aby konkrétně a měřitelně splnily vizi.

Vize

Jasnou vizí Coffeespot je zaměření na prodej a pražení té nejlepší výběrové kávy. Vysokou kvalitu si udržet a neustále zlepšovat. Kávu nabízet zákazníkům na e-shopu, přímo v pražírně a také na nové pobočce v Praze.

Pražírna kávy Coffeespot
Vize Coffeespot - pražit tu nejlepší výběrovou kávu v ČR

Většina konkurence vsází na nízkou cenu nebo prodej příslušenství pro přípravu kávy. Doplňky jako mlýnky na kávu, moka konvičky, aeropress nebo filtry jsou velmi vyhledávané a poptávané zboží. Mohly by být zdrojem zisku a nových zákazníků.

Teroreticky by nám mohly fungovat tyto 3 hypotézy:

  • Díky SEO bychom mohli získávat zákazníky přirozeným způsobem
  • Zbožové srovnávače (např. Heureka, Zbozi.cz) - levný a rychlý způsob, jak dostat zákazníky na web, konverzní poměr vysoký. Čerstvě pražená káva se ale na zbožových srovnávačích prodávat moc nedá (s čím byste ji chtěli objektivně srovnávat, když je to originální výrobek?), a tak by zase došlo na prodej příslušenství.
  • Cross-selling - pomocí křížového prodeje nabízet zákazníkům další produkty. Např. Pepa má v košíku kávu na filtr, a tak mu nabídneme ještě mlýnek, aeropress a náhradní filtry.

Touto cestou však jít nechceme, přestože na e-shopu několik drobných doplňků nabízíme (jsou to ale spíše doprodeje). Pokud si zákazník koupí mlýnek na kávu, pravděpodobně se z něj nestane věrný a dlouhodobý zákazník. A až se mu utrhne u mlýnku klička (vím, o čem mluvím), budeme řešit reklamace. Za mlýnek však ale pražírna kávy nemůže a vznikají zbytečně negativní emoce a časové nároky spojené s rychlým vyřízením reklamace.

Cílem Coffeespot není ani účast na různých akcích, jako jsou festivaly nebo konference, přestože je to v současnosti velmi žádané a může to být dobrá příležitost, jak “být viděn”. Coffeespot má sice k dispozici vlastní “mobilní kavárnu”, ale raději s klidným svědomím doporučí konkurenci, která se na toto zaměřuje.

Cíle

Myslíte si, že hlavním cílem je zvýšení obratu? Ano, nepletete se. Společně s tím jsme ale stanovili i dílčí cíle, které jsou spojeny s marketingem a uživatelskou přívětivostí e-shopu. Jako např:

  • změna informační architektury e-shopu
  • zvýšení konverzního poměru e-shopu
  • zvýšení počtu organických návštěv z vyhledávačů
  • odstranění technických problémů
  • zvýšení povědomí o značce

K utřídění myšlenek jsme provedli SWOT analýzu.

Identifikovali jsme:
  • silné stránky (co nám pomáhá růst)
  • slabé stránky (kde jsme na tom hůře než konkurence)
  • příležitosti (např. nenaplněné potřeby zákazníků)
  • hrozby (např. co může snížit poptávku)

SWOT analýza pomůže definovat, na čem můžete při redesignu stavět a co nás může naopak poškodit.

Krok #3 - Výzkum

Abychom mohli efektivně začít plnit naši vizi, bylo třeba zanalyzovat stávající stav.

Začal jsem kvantitativním průzkumem - analýzou chování lidí na webu.

S analytikou se doposud moc nepracovalo, proto jsem už na počátku spolupráce nasadil nové analytické nástroje a přenastavil ty stávající, aby nám poskytly přesnější data o tom, z jakých zdrojů k nám lidé chodí, které stránky se podílí na konverzích, co lidi zajímá, co hledají na e-shopu nebo kde se ztrácejí.

Lukáš Dubina - UX designer
Ponořil jsem se do zkoumání analytiky

Jedno ze zajímavých zjištění bylo, že uživatelé na webu často využívají:

  • řazení produktů na stránce
  • drobečkovou navigaci, pokud jsou v detailu produktu

Velmi často bylo používáno i vyhledávání, přestože bylo defaultně schované. Po napojení vyhledávání na Google Analytics mi data z vyhledávání pomohla při návrhu nového e-shopu i obsahu. Další (užitečnější) data zde nemohu kvůli případné konkurenci publikovat.

heatmapa e-shopu a webu
Grafické zobrazení interakce návštěvníků pomocí heatmapy
Kvantitativní výzkum
Z heatmap zjistíme, o jaká místa webu mají uživatelé zájem a která naopak ignorují (nezjistíme ale proč)


Tvořím pro lidi, a proto je vhodné vše ověřit. Po úvodní analýze a stanovení hypotéz následovalo dotazníkové šetření. Sestavil jsem speciální dotazník, který jsme rozeslali stávajícím zákazníkům.

Získali jsme 523 unikátních odpovědí. Skvělé poznatky zahájení prací na novém e-shopu.

Co jsme např. zjistili:

  • 82 % zákazníků nakupuje opakovaně
  • Lidé chtějí platbu kartou online
  • Zákazníkům chybí doplňkové zboží a příslušenství k přípravě kávy
  • Lidé chtějí uvést stupnici kyselosti kávy
  • Lidí chtějí info o stupni pražení káv
  • E-shop je extrémně pomalý
Kvantitativní výzkum
Kvantitativním výzkumem jsme získali 523 unikátních odpovědí

Následoval kvalitativní průzkum - rozhovory s lidmi a Guerilla uživatelské testování - to není tak přesné jako standardní uživatelské testování, ale je rychlejší, levnější a i přes jeho limity poskytlo zajímavé pohledy. Vzhledem k tématu probíhalo nejčastěji v kavárně.

Závěry z výzkumu jsme porovnali s naší vizí. I přesto, že jsme dostali jasnou zpětnou vazbu, co lidem chybí, rozhodli jsme, že některé poznatky nebudeme realizovat.

Např.:

  • Lidem chybí zboží a příslušenství na přípravu kávy = nezapadá do naší vize (viz. výše)
  • Lidé chtějí uvést stupnici kyselosti kávy = příliš subjektivní, každý člověk má jiné vnímání kyselosti, co je pro Frantu neutrální, může považovat Eliška za kyselé. Zbytečně by vznikaly dotazy a nespokojenost.

Z výzkumu jsme si také ověřili, kdo je naším potencionálním zákazníkem, jak máme komunikovat a tvořit obsah.

Lukáš Dubina - Value Proposition Canvas ukázka / příklad
Designování reálných potřeb zákazníků (Value Proposition Canvas)

Krok #4 - Analýza klíčových slov, informační architektura

Analýzu klíčových slov využívám ve většině případů a bývá hlavním stavebním kamenem při optimalizaci nebo redesignu webu. Díky ní zjistíme např.:

  • přehled o dotazech, které uživatel zadává, když hledá určitý produkt či službu
  • jaké parametry a varianty produktů jsou pro uživatele důležité
  • jaká témata spojená s naším oborem uživatele zajímají a na jaké otázky se snaží najít odpovědi (to můžeme použít pro budoucí obsahovou strategii)

Pro mě jako UX designera je analýza klíčových slov důležitá pro návrh informační struktury webu. Dokážu podle ní lépe určit, jak by měla vypadat:

  • navigace
  • název a design kategorie
  • varianty produktů
  • filtrace produktů
návrh informační architektury e-shopu
Ukázka návrhu informační architektury e-shopu Coffeespot

Pokud tvořím informační architekturu na základě dat, dokážu lépe zajistit, aby na konkrétní hledané klíčové slovo vznikla vhodná vstupní stránka na webu. Tím se zlepší pozice ve vyhledávačích a přivedeme návštěvníky na web.

Analýza klíčových slov
Z analýzy klíčových slov např. vyplynulo, že nám chybí na Seznamu 80% vstupních stránek

Pro SEO u klientských e-shopů využívám spolupráce se skvělými kolegy. V tomto případě se o analýzu, technické nastavení a zapracování on-page faktorů postaral Pepa Kroupa.

Krok #5 - Analýza konkurence

U analýzy konkurence existují různé přístupy. Někdo analýzu konkurence podceňuje a nepovažuje ji za potřebnou. Jiní analýze konkurence naopak věnují až přehnané množství času a úsilí.

Zanalyzoval jsem cca 20 konkurentů. Přímých i nepřímých. Je to málo? Hodně?

Prozkoumal jsem jejich weby, e-shopy, nabídku, reference, důvěryhodnost, cenotvorbu, marketingové aktivity, zákaznickou podporu, technologie a postupy.

TIP: Na analýzu konkurence doporučuji nástroje: Alexa, Similarweb, Majestic, SEMrush, Visualping, Archive.org, Mentions, Ghostery, nástroje od Google a Seznam.cz, lidský faktor.

Analýza konkurence
Ukázka analyzovaného konkurenta - z jakých zdrojů získává návštěvnost a jak se web vyvíjí v čase

Krok #6 - Redesign vs. optimalizace

Redesign webu je zásadní krok a skládá se z mnoha částí. Ne vždy je však potřeba. Často je efektivnější a levnější jít cestou optimalizace. Častá chyba e-shopařů je, že se jim líbí web konkurence, a považují tak změnu grafiky za redesign. Věří, že hezčí e-shop jim zvýší výkonnost.

Redesign se ale netýká jen grafiky. Úprava grafického designu je jen jeden z dílčích kroků. Dokonce není vždy nutné při redesignu měnit grafiku.

V našem případě jsme potřebovali změnit více částí zároveň. Redesign dával smysl.

Redesign vs. optimalizace webu
Pokud není redesign nezbytně nutný, proveďte raději optimalizaci webu

Důvody

Technologický dluh. E-shop běží na krabicovém řešení. Přemýšleli jsme o vytvoření e-shopu na míru, ale nakonec jsme se rozhodli zůstat u Eshop-rychle.cz a technické limity systému obejít (pokud to bude možné).

Použitá šablona byla zastaralá a pomalá. Rychlost webu je v dnešní době důležitá a je zároveň signálem pro vyhledávače. Tento problém byl naprosto zásadní a bylo nutní rychle ho řešit.

Mobilní verze webu obsahovala chyby, byla pomalá a špatně ovladatelná, přesto podíl mobilních uživatelů přesáhl 40 %.

Nekonzistentnost značky. E-shop komunikoval jinak než sociální sítě, e-mail nebo kamenná prodejna. A to jak vizuálně, tak i technicky.

Design

  • e-shop neukazoval silné stránky
  • špatný grafický design
  • unikala spousta SEO příležitostí, např. nepracovalo se s technickým SEO, blog byl na externím webu se špatně zapamatovatelnou doménou a negeneroval e-shopu žádné návštěvy ani objednávky (přestože sám blog návštěvnost měl)

Optimalizace

Přestože jsem se rozhodli pro redesign, na začátku jsme šli cestou optimalizace stávajícího e-shopu. Provedl jsem dílčí úpravy vedoucí k vylepšení a odstranění největšího problému. A to byla rychlost načítání.

Rychlost načítání webu
Původní doba načítání - "...když jsou weby pomalý, nikoho to nebaví..."
  1. Odebral jsem přebytečné skripty, které zpomalovaly načítání a na e-shopu byly spíše historicky
  2. Nastavil jsem asynchronní načítání skriptů
  3. Odebral jsem video, které brzdilo vykreslování stránky
  4. Grafická a datová úprava obrázků - zmenšil jsem velikost grafiky. Některé obrázky byly v nevhodném formátu PNG a v tiskové grafice. Obrázky jsem předělal a datově zmenšil o desítky procent. Doporučuji např. TinyPNG nebo Kraken.io
Rychlost načítání webu
Doba načítání e-shopu po optimalizaci - zkrácení doby načítání o 50 %

Krok #7 - Wireframes

Po ukončení všech analýz nastává proces, který dokáže prezentovat něco hmatatelného - definice rozmístění funkčních prvků na stránce. Odborně se tomu říká wireframe (neboli drátěný model webu). Nejedná se o grafický návrh, protože neobsahuje žádné obrázky.

Wireframe nám umožňuje minimalizovat rozdíl mezi zadáním a výsledným řešením. Lépe pochopíme, jak bude výsledný web vypadat, jak se bude ovládat a jak bude komunikovat.

Wireframe eshopu
ukázka klikacích wireframes e-shopu v aplikaci InVision

Vzhledem k tomu, že e-shop běží na krabicovém řešení a rozmístění prvků na stránce (částečně i obsah a textace) je striktně určeno šablonou, nedá se vymýšlet nekonečné množství wireframů jako u e-shopu na míru. Nebo je pro redesign krabicového řešení wireframe zbytečný?

Přesto však wireframes kreslím alespoň u klíčových stránek. Klientovi pomohou představit si finální podobu e-shopu (která se u redesignu může zásadně lišit) a mně pomohou při tvorbě grafického designu. Součástí wireframu by měl být i obsah (nikoliv jen výplňkový text typu lorem ipsum).

Díky tomu můžeme už klikací wireframe testovat na uživatelích (jako funkční prototyp webu) a případné chyby opravit včas a levně. To jsem zde přesně udělal. Tímto děkuji všem, kteří se testování účastnili (např. moje skvělá kolegyně Pavla Simonsen).

“Prototypy nám umožní vidět věci, které nefungují, a věci, které je třeba, aby fungovaly. Proto vždy testujte.”

Krok #8 - Grafický design

Po dokončení všech předchozích kroků nastává nejoblíbenější část všech zadavatelů a majitelů webů a e-shopů - GRAFICKÝ DESIGN.

Díky předchozím krokům vzniká na pevných základech.

Grafický design e-shopu navrhuji tak, aby:

  • byl nástrojem pro podporu obchodní výkonnosti webu
  • byl jednoduchý, čistý, zaměřený na výkon
  • splňoval pravidla použitelnosti
  • vedl k požadované konverzi
  • obsah byl čitelný a dal se “scanovat”
  • rychle se načítal

Při návrhu grafického designu (a celkově u návrhu e-shopu) mi moc pomohla např. i kniha, kterou Coffeespot napsal a vydal pod hlavičkou Computer Press - Lexikon kávy.

kniha Lexikon kávy
Kniha Lexikon kávy

Uživatelé si nekupují kávu kvůli grafice e-shopu. Grafický design, který jsem navrhl u e-shopu Coffeespot proto není žádné kreativní veledílo. Je zaměřený na výkon, funguje.

Grafický design e-shopu
Kreativní tvoření - můj proces návrhu grafického designu
"Uživatelské rozhraní je jako vtip.
Když musíte lidem vysvětlit, jak funguje, není dobré."

Krok #9 - Tvorba obsahu

Říká se, že „obsah je král“. Něco na tom bude. Lidé nenavštěvují weby kvůli vzhledu. S větší pravděpodobností k vám přijdou proto, že máte skvělý obsah. Přesto obsah většina e-shopařů neřeší a považují ho za něco “navíc”.

Coffeespot má neuvěřitelné know-how a zkušenosti. E-shop to ale bohužel dostatečně obsahově nesděloval, což byla velká škoda. To jsme museli napravit.

Obsahu ve statických sekcích bylo poměrně dost, ale působil nekonzistentně oproti komunikaci např. na sociálních sítích nebo blogu.

Zapracovali jsme na novém obsahu pro:

  • Kategorie a detaily produktů
  • Statické stránky (Homepage, O nás, Pražírna…)
  • Transakční e-maily
  • Benefity a konkurenční výhody e-shopu
  • Mikrotexty
  • Nákupního rádce
  • 404 stránku
  • Nové články na blogu
  • Nafotili jsme nové fotografie produktů
Focení produktů na e-shop
Focení produktů na e-shop

Textový obsah jsme tvořili společně. Coffeespot se vyznačuje výborným osobním přístupem a toto jsme chtěli promítnout i do obsahu. Skvělé texty do statických kategorií nám pomohla usměrnit Maruška Fišerová, která se podílela i na korekci.

Na mikrotexty jsem se zaměřili nejvíce. Nejen proto, že já osobně na nich “ujíždím” a považuji je za velmi důležité, ale i samotné téma je velmi kreativní a často jednou krátkou větou dokážete vyjádřit spoustu emocí a vysvětlit danou situaci lépe než dlouhým odstavcem textu.

Ukázka mikrotextu - microcopy
Na e-shopu jsme např. potřebovali vhodně odprezentovat preferovanou formu kontaktu

Krok #10 - Implementace

Implementace grafického designu a obsahu bývá občas trochu oříšek. Člověk se pohybuje na velmi tenkém ledě a občas dopředu na 100% neví, co půjde a nepůjde zapracovat.

Při práci mě trochu “brzdilo” krabicové řešení Eshop-rychle, které neumožňuje některé systémové prvky e-shopu upravit, přemístit či přepsat obsahově. Je to logické. Systém a jeho šablony jsou univerzální. Pokud by se na jedné šabloně kvůli jednomu e-shopu něco změnilo, úprava se promítne dalším tisícům e-shopařů.

Toto je nevýhoda krabicových řešení. O tom jsem ale už psal samostatný článek a počítal jsem s tím. Většina prvků lze tedy měnit jen v kombinaci s vlastním HTML, CSS a JS. Musel jsem oprášit své "kódérské triky" z dob, kdy jsem ještě denně kódoval a programoval webové stránky na WordPressu.

Hledání limitů a jejich posouvání mě ale baví - takto jsem v minulosti upravil desítky e-shopů na různých technických řešeních - Eshop-rychle, BSshop, Webareal nebo 3IT.

Překážky a řešení

Šablona

Systém Eshop-rychle znám velmi dobře a již několik let se zabývám jeho “ohýbáním” nad rámec jeho možností. 80% úprav se mi podařilo nakonec zapracovat, přestože z pohledu kódu to ale není řešení typu “clean pure code”.

Ty největší úpravy jsou vidět na první pohled - celková změna designu použité šablony PORTO.

Redesign e-shopu na krabicovém řešení
E-shop Coffeespot je postaven na šabloně PORTO

Nejvíce daly zabrat změny v detailu produktu:

  • V testování lidé přehlíželi varianty produktů a stávající zákazníci na ně nebyli zvyklí. Graficky jsem zvýraznil možnost volby velikosti balení.
  • K produktu je možné přes administraci e-shopu přidat odznáček “100% arabica”.
  • Standardní text “skladem” jsem změnil na “Čerstvě upraženo, připraveno k odeslání
Ohnutí a úprava šablon e-shopu
Ukázka mého “hacku” v CSS → výsledek na webu

Další méně viditelné ale důležité části, které většina e-shopových řešení nemá správně zapracované a dají se lehce upravit jsou např:

  • Jasné definování konverzní cesty - v našem případě je konverzní barva tmavě červená. Dle toho jsem upravil všechna tlačítka a pomocné prvky, které zákazníka provázejí a pomáhají mu k úspěšnému dokončení objednávky.
  • Košík - krokovač znázorňuje barevně průchod košíkem, všechny rušivé elementy jako je vyhledávání, navigace a patička jsou skryty pomocí CSS, aby mohl zákazník snadno dokončit objednávku.
Ideální objednávkový proces e-shopu
Krokovač košíku

Technické změny

Při redesignu je vždy třeba dát pozor na propady ve vyhledávání. Změnou informační architektury, domény (z www.kavaprazena.cz na www.coffeespot.cz) i změnou technického řešení (u nás. např. blogu) může e-shop přijít o velké množství vstupních stránek a návštěvníků. Přesměrování url i změnu domény jsme ohlídali:

Google Search Console
Informace z Google Search Console po spuštění redesignu

Nasadili jsme i pokročilejší marketingová "udělátka", jako např. remarketing a personalizaci e-shopu, kdy se každému uživateli upravuje výpis produktů na základě jeho chování.

Personalizace e-shopu
Remarketing e-shopu

Heureka

Problém, který jsem zde řešil poprvé, byla HEUREKA. Protože u e-shopu došlo ke změně domény, bylo třeba vše změnit i v nastavení Heureky.

Heureka by mohla působit nekonzistentně, protože e-shop byl před redesignem pojmenován jako “kavaprazena” a dotazník spokojenosti obsahoval nesprávné logo. Toto by zákazníky mohlo hodně zmást a odradit je od vyplnění zpětné vazby.

Telefonický kontakt na Heureku jsem nikde nedohledal, poslal jsem tedy naivně tento email:

Heureka hodnocení e-shopu
Žádost o změnu domény

Po několika vyměněných konverzacích jsem zjistil, že Heureka bohužel tento krok neumožňuje a je třeba založit nový profil. Tím ale dojde ke ztrátě historie, certifikace a všech hodnocení. Měli jsme přes 900 recenzí.

To nechceš…

Telefon byl v zaslaném e-mailu, tak jsem se pustil do telefonického vyjednávání. Paní na technické podpoře byla moc milá a celkově mě postavení Heureky k této záležitosti velmi pozitivně překvapilo.

Po několika dnech komunikace (a snad i hodinách strávených na telefonu) celá záležitost skončila takto:

Heureka certifikace e-shopu
Konec dobrý, všechno dobré

Kladné body pro Heureku. Technickou podporu mají ale skvělou a umí se zachovat lidsky.

Výsledky spolupráce

Přestože došlo ke kompletní změně domény (z pohledu vyhledávače = nový web), po spuštění redesignu nedochází k očekávanému (krátkodobému) propadu. Naopak, již po 2 měsících od spuštění redesignu:

  • na web přichází o 22% více nových uživatelů
  • navýšení obratu o 11%
  • průměrná hodnota objednávky + 8%

Aktualizace: po 3 měsících zvýšení tržeb o 17% a rosteme o desítky procent

Výsledky optimalizace webu
Krátce po redesignu

Na předchozí verzi e-shopu návštěvníci často používali vyhledávání. To bylo technicky nevhodně zpracované. Po redesignu se počet návštěvníků, kteří použili vyhledávání a odešli z webu (bez změny nabídky zboží), snížil o 77%.

Už se těším, až Eshop-rychle nasadí přepracovanou verzi.

Výsledky optimalizace webu
Výsledky po úpravě vyhledávání

Další výsledky: vyhodnocujeme data

Náročnost

Začali jsme v říjnu 2017 a nový e-shop jsme spustili na konci ledna 2018.

Proces redesignu zabral:

  • 20 hodin výzkumů a analýz
  • 15 hodin návrhů a tvorby řešení
  • 10 hodin technických úprav
  • 30 hodin implementace
  • 15 hodin konzultací

Zhodnocení ze strany klienta

"Skoro dva roky jsme věděli, že e-shop není designově a funkčně zcela v pořádku. Báli jsme se ale jakékoliv změny, aby to negativně neovlivnilo celou firmu. Lukáše jsme našli díky výborným referencím. Chvíli nám trvalo pochopit, že je opravdový profesionál a přesně ví, co dělá. Bylo to hlavně díky našim negativním zkušenostem s různými agenturami, kdy spolupráce končily zklamáním a zbytečnými výdaji. Během pár měsíců jsme si poradili s celkovým redesignem e-shopu. Mysleli jsme si, že redesignem spolupráce skončí, ale Lukášovy zkušenosti nás i nadále posunují ve všech směrech neskutečně dopředu. I díky tomu máme více času na rozvoj firmy a naše zákazníky, kteří všechny změny vítají s nadšením."

Jiří Plšek

Jiří Plšek
spolumajitel pražírny Coffeespot
www.coffeespot.cz

Mohlo by vás zajímat:

Designové myšlení

Zvýšení obratu e-shopu o 25% za jeden měsíc

Provedli jsme redesign e-shopu se zaměřením na prodlužování řas. Podařilo se nám rapidně zvýšit obrat, návštěvnost a překonat všechny stanovené cíle. Za jeden měsíc.
zjistit více

Plány

Spuštěním redesignu práce na jeho podobě neskončila. E-shop vnímám jako živý organismus. Na rozvoji e-shopu dále pracujeme a optimalizujeme ho k lepším výsledkům.

Co plánujeme:

PPC - PPC neodmyslitelně patří do marketingové strategie každého e-shopu. Doposud e-shop s PPC pracoval, ale správa nebyla efektivní. Např. Sklik spravoval samotný Seznam.cz (markeťáci vědí, jak to Seznam spravuje). Chceme snižovat náklady na prokliky z placené reklamy a přivádět více zákazníků přirozeně. Na to jsem se domluvil se skvělou Jarkou Turkovou. Máme za sebou spoustu společné práce na jiných projektech (např. u Eshop-rychle, 3D FITNESS) a vím, že je to bude mít "drive".

Facebook Ads - Sociální sítě jsou jako stvořené pro toto téma. Budeme pracovat na brand buildingu a vzdělávat všechny příznivce dobré kávy. O Facebook reklamu se postarám osobně. Ačkoliv tuto službu standardně nenabízím (zaměřuji se na UX design a zvyšování konverzí), mám s Facebook reklamou mnoho zkušeností. Několik let navrhuji a realizuji výkonnostní a brandové kampaně např. pro samotný Eshop-rychle a máme skvělé výsledky.

Viděl jsem mnoho spoluprací s agenturami na správu Facebook reklamy a výsledky bych vám nepřál vidět smile. Osobně doporučuji jen se 2 kolegy z oboru, které znám dobře a "s klidným svědomím" bych jim to svěřil. Jsou hodně časově vytížení, takže to "beru na sebe" a budu s nimi konzultovat případné náměty na zlepšení výkonu (díky Honzo a Davide).

Reference
Tohle téma je prostě boží....testujeme kreativy a formáty, vyhodnocujeme, rosteme

Blog - S bodem výše úzce souvisí i blog. Základem úspěchu je vytvořit z návštěvníků zákazníky a ze zákazníků fanoušky. Věrní fanoušci si o pražírně kávy Coffeespot budou číst a doporučovat dále přátelům. Máme připravenou obsahovou strategii.

Také jsme spočítali životní cyklus jednoho aktivního zákazníka a blog by ho mohl pomoci prodloužit. Na vylepšení současného obsahu už vesele pracuje Zuzka Veselá.

Technické řešení - zde víme, že jsme na technickém limitu. Je ale otázkou času, kdy e-shop přeroste současné technické řešení a už teď víme, co budeme muset zlepšit.

Počítáme s tím, že to vyřeší NOVÉ ŠABLONY současného řešení Eshop-rychle, které by měly být hotové do několika měsíců. Měl jsem možnost se přímo podílet na jejich vývoji a navrhnout jejich funkčnost a uživatelskou přívětivost (včetně návrhu nové zákaznické sekce, kde nás teď “tlačí bota” - opakovaná objednávka). Už aby to bylo, jinak ze zpracování současného košíku zešílím smile

zákaznické sekce
Můj návrh zákaznické sekce s opakovanou objednávkou.
Programátoři Eshop-rychle ho nasadí do několika měsíců.

Já osobně mám plán takový, že nadále budu popíjet kvalitní zrnkovou kávu, která bude čerstvě upražená a prakticky zabalená smile

Dárek na Valentýna
Valentýnská nadílka od mých zákazníků chocoMe a Coffeespot

Zajímavosti

  • Za celou dobu spolupráce na redesignu jsme se fyzicky neviděli a nepotkali (jsme od sebe vzdáleni 232 km). Vše jsme v pohodě zvládli po telefonu, po e-mailu a projektovým řízením přes Freelo. Coffeespot mi věřil a veškeré procesy nechal na mně. Ale už bychom se fakt chtěli potkat... (4.4. 2018 - potkali jsme se) smile
Komunikace
Taková naše průměrná doba telefonického hovoru (když se chcete na něco zeptat) smile

Líbil se vám postup? Sdílejte ho s přáteli.



Co mám za sebou?

10+

let zkušeností
v oblasti e-commerce

100+

dokončených velkých
i malých projektů

100 000+

návštěvníků měsíčně
mých vlastních projektů

Nekonečno

nekonečno
kreativních nápadů

Kontakt

Potřebujete navrhnout nový projekt nebo zlepšit ten stávající?
Pojďme si promluvit o možném řešení.

Lukáš Dubina

724 146 006 info@lukasdubina.cz
  • Linkedin
  • Twitter
  • Instagram
  • Facebook
IČ: 76165701
DIČ: CZ8403280589 (plátce DPH)