Happybee
Een redesign met impact, dankzij de Design Thinking Methode
Veel succesvolle webshops waren er al vroeg bij. Ze begonnen te pionieren voor 2010, antieke tijden in e-commerce. Zo’n voorsprong heeft voordelen, maar kan ook gaan knellen. Waar jongere concurrenten meteen lanceren met de nieuwste technieken en designs, draaien pioniers soms nog op oude systemen en met klassieke designs. Deze shops zijn vaak meesters in aanpassen, maar op enig moment is het tijd voor een meer fundamentele update. En dat is goed nieuws, want een migratie of redesign is een uitgelezen kans om het toch al vaak glorieuze succes van dit soort webshops naar een nog hoger plan te tillen.
Happybee is een webwinkel voor hoger segment kinderkleding. De shop zag het licht in 2008, en groeide uit tot een van de grootste spelers in haar markt. Yellowgrape en Happybee werken al jaren samen, op het gebied van data, performance, automation en personalisatie. Nu was het tijd om de shop futureproof te maken. Het CMS was verouderd en de look & feel van de shop gedateerd. Als we het doen, doen we het goed – dat was het heilige uitgangspunt. In deze casus laten we zien hoe je systematisch toewerkt naar een redesign met maximale impact.
Met een mooi design kun je goede sier maken, maar dat is wat ons betreft niet het hoofddoel. De kracht van een goed design is primair functioneel; met het design beïnvloed je de beleving van de klant. Dat kan positief of negatief uitpakken. Een goed design faciliteert de klant op haar zoektocht. Maar zitten er struikelblokken in je ontwerp, dan is een bezoeker snel gevlogen. Als we praten over een (re)design met impact, gaat het vooral over deze functionele kant van het ontwerp.
Om niks aan het toeval over te laten, werken we bij Yellowgrape altijd met de Design Thinking Methode. Met deze methode kruip je radicaal in de beleving van de klant. In een aantal heldere stappen onderzoek en toets je welke impact je keuzes hebben op bezoekers. Het is nogal een trendbreuk met de ontwerpmethodes van weleer, waarbij originaliteit en creatieve impulsen vaak leidraad zijn. Niks mis met de good old onderbuik, maar wie zeker wil zijn van impact, kan zijn veronderstellingen maar beter toetsen. Daarvoor gebruiken we Design Thinking Methode.
Voor het redesign van Happybee zijn we gestart met Remote User Testing. Dat is een laagdrempelige, maar heel effectieve manier om inzicht te krijgen in hoe bezoekers een site ervaren. We werken hierbij samen met onze partner User Sense. Hoe gaat het in z’n werk? Tien mensen (representatief voor de klanten van Happybee) bezoeken in hun natuurlijke omgeving de huidige webshop. Speciale software volgt hun handelingen, ze worden gefilmd en geven verbaal feedback over hun ervaringen en bevindingen.
Wat vonden onze testers
Los van de concrete bevindingen, werd weer eens bevestigd hoe meedogenloos je als shop wordt afgerekend op slechte, eerste indrukken. Als het aan het begin niet lekker loopt, beïnvloedt dat de hele klantreis, met een negatieve impact op conversie als gevolg. Dit is precies waarom een goed design alle verschil kan maken, en je hierbij de beleving van de klant als uitgangspunt moet nemen.
Remote User Testing biedt waardevolle inzichten, maar het is niet genoeg als basis voor een nieuw design. We kijken ook naar de markt, analyseren de concurrentie, identificeren roadblocks en verkennen logische customer journeys. Alle data en inzichten die we verzamelen, vinden hun plek in kraakheldere Affinity Maps, het tweede hoofdstation op de reis van Design Thinking.
Vorm volgt inhoud
Affinity Maps clusteren inzichten per thema. Touchpoints binnen de klantreis vinden hun plek en de eerste contouren van de structuur tekenen zich als vanzelf af; vorm volgt inhoud. Door grondig vooronderzoek vast te leggen in een Affinity Map waarborg je dat alle inzichten ook echt een plek krijgen. Het is ook weer een mooi moment om met de klant om tafel te zitten. Dit ligt er nu. Zitten we op goede koers?
In de Affinity Maps hebben we alle bouwstenen voor Happybee gedefinieerd. Nu is het tijd om met de steentjes te spelen! We gaan het Wireframe Design optuigen. Dit is het functionele skelet van de nieuwe shop. Mede door de uitkomst van de Remote User Testing besloten we de mobiele site als vertrekpunt te nemen. Dat zou een vruchtbare keuze blijken. Het is bovendien een prettige manier van werken, omdat mobile dwingt tot eenvoud. Zo houd je focus op de essentiële zaken, en dat is het waar het wireframe op draait. Pas toen we Happybee hadden voorzien van een perfecte blauwdruk voor haar mobiele site, hebben we de desktopversie geoptimaliseerd.
Een van de grote uitdagingen voor een partij als Happybee is een gebruiksvriendelijke sortering van haar reusachtige assortiment. De shop heeft 175 merken in de etalage. Hoe vind je wat je zoekt en hoe houd je onderweg het overzicht? Dat is de million dollar question. Uit de Remote User Testing was bovendien gebleken dat sommige mensen in de war raakten van de filtering. Een redesign is hét uitgelezen moment om dit probleem te tackelen.
Uitgangspunt numero uno: vergemakkelijking. Wat we zagen, is dat het productassortiment voor jongens en meisjes tussen 2 en 16 jaar (de grootste klantgroep) bijna gelijk was. We besloten daarom tot een radicale koerswijziging: het samenvoegen van de genders. Een schot in de roos, zo zou blijken. Met nog maar twee hoofdcategorieën (baby’s en kinderen) werd het navigatiemenu direct een stuk overzichtelijker. We hebben veel tijd gestoken in het aanleggen van een logische, kraakheldere filtering. Uitkomen bij de producten die je zoekt, is nu kinderspel.
Als rechtgeaarde nerds by nature laten we een redesign natuurlijk niet onbenut als kans voor ultiem optimalisatiegeluk. We injecteren de laatste e-commerce standaarden en implementeren alle mogelijke best practises. Natuurlijk zijn we ook niet zuinig met verleidingstechnieken. Zo bieden we de gebruikerservaring die we voor Happybee in gedachten hadden.
Al die mooie plannen moeten natuurlijk wel lekker uit de verf komen. Dat is waar visual design komt kijken.
Het wireframe is nu af. En met het functionele skelet helemaal optimaal ingericht, is het tijd voor een prachtig en effectief visueel design. Uit de Remote User testing kwam het donkere, niet altijd logische passende uiterlijk als belangrijk kritiekpunt naar voren. Sowieso is de norm tegenwoordig om de looks clean en te houden. Je wil de bezoeker van het ene relevante element naar het andere leiden, met zo min mogelijk ruis.
Gelukkig kan ook een minimalistisch ontwerp prikkelend en inspirerend zijn. Voor Happybee maakten we tactvol gebruik van witruimte. Voor de visuele elementen zijn we uitgegaan van organische vormen. Bij een redesign is het natuurlijk de kunst om de een brug te slaan tussen herkenbaarheid en vernieuwing. Welke elementen zijn kenmerkend, onmisbaar en lenen zich voor inbedding of omvorming in een nieuwe, frisse huisstijl? Met die vraag gingen we samen met Happybee naar de tekentafel. We kwamen er een na een paar vruchtbare sessies heel blij vandaan. De nieuwe visuele look is futureproof Happybee to the max!
Het mag duidelijk zijn: er gaat een bak werk in het maken van een mooi en effectief redesign. Je wil dan natuurlijk ook weten wat de impact is. Vinden we bij Yellowgrape nogal wiedes. Sterker nog: we willen het zelf ook weten.
We meten impact in conversie. Nu is de absolute conversieratio een getal waarin vele factoren samenkomen. Denk aan (sale) prijzen, het productaanbod en markt- en economische trends. Een redesign is hier slechts een onderdeel van. Het is de kunst om het effect van dit specifieke onderdeel zo goed mogelijk te isoleren.
Hiervoor gebruiken we Google Analytics data. Door meerdere perioden met elkaar te vergelijken, houden we rekening met enerzijds de markt- en economische trends en anderzijds de seasonality factoren en sale weken, zoals black friday. Het hielp in deze casus dat er bij Happybee in de te onderzoeken periode weinig tot geen organisatorische veranderingen zijn doorgevoerd, zoals veranderingen in het verzend- of retourbeleid.
In de eerste analyse, de jaar-op-jaar vergelijking, representeert de blauwe lijn de conversieratio over 2022, en de oranje over 2021. In eerste instantie kijken we alleen naar de blauwe lijn (2022). Relevant is de knik die ontstaat in mei 2022. Vanaf dat moment stijgt de conversieratio en blijft ook op het nieuwe niveau. Laat dit nu precies het moment zijn dat het redesign live is gegaan.
Als we een stapje verder gaan en de conversieratio over 2022 met 2021 vergelijken, is er een uplift in de conversieratio van ruim 40%. De grootste uplift is behaald op mobiele apparaten, een uplift van bijna 44%, gevolgd door 37% uplift op desktop.
Naast de jaar-op-jaar vergelijking, is er een analyse gemaakt over de resultaten in 2022. Hierbij is de periode voor livegang van het redesign (1 januari - 30 april) afgezet tegen een gelijke periode na livegang van het design (1 mei - 31 augustus). Op deze manier zullen markt- en economische trends minder van invloed zijn, maar kunnen seasonality factoren weer een grotere rol spelen. Ook binnen deze analyse vallen de resultaten alles behalve tegen. Over het totaal is er een uplift van 30% in de conversieratio, met een toename van 10% op desktop en 36% op mobiel.
Leggen we beide analyses naast elkaar, dan mogen we voorzichtig concluderen dat het redesign een impact heeft gehad van 30% tot 40% op de totale conversieratio. Dat zijn heel fijne cijfers. Niet alleen omdat ze aantonen dat het werk goed is gedaan, maar natuurlijk ook omdat je met dit soort cijfers een redesign in no time terugverdient.
Het werk houdt niet op bij de live-gang. Bij Yellowgrape geloven we heel sterk in duurzaam optimaliseren. Een site of shop is niet statisch. Het is als een levend organisme die onder invloed van talloze factoren voortdurend transformeert. Er zijn acties, klanten krijgen nieuwe voorkeuren, economische trends veranderen, er ontstaat nieuwe technieken en best practises… de lijst is eindeloos.
Vergelijk het met een nieuwe auto: die is de dag na aankoop een duit minder waard. Een redesign verliest – als je het niet bijhoudt – meteen haar relevantie. Natuurlijk kun je er even tegenaan, oogt alles fris en futureproof, maar op detailniveau, onder de motorkap, is er al snel weer ruimte voor kleine en grotere optimalisaties. Met doorlopende A/B testen houden we alles scherp en goed gesmeerd. Ook de impact van die inzet maken we natuurlijk inzichtelijk. We willen graag zeker weten of je ons wel royaal terug verdient.