Project Report

Inhoudsopgave

Context

INOVA is geen standaard full-service marketingbureau, maar een bedrijf met meer dan 50 ‘toekomstbouwers’ met expertise in marketing, communicatie, creatie en development. Zij helpen bedrijven en merken zoals Remia, Dr. Oetker, NTF, Bruynzeel, Den Mulder, Jumbo, Cogas en Amber om te groeien en hun doelen te bereiken.

 

 

In 2022 is INOVA een investeringstraject met Den Mulder begonnen. Den Mulder is een boomkwekerij met een webshop waar ruim 2000 bomen en tuinplanten uit eigen productie worden aangeboden, aangevuld met producten van andere contractkwekers, wat resulteert in een zeer ruim aanbod van meer dan 9000 verschillende boom- en plantsoorten.

 

 

INOVA is een investeringstraject met Den Mulder gestart om hen te laten groeien door middel van marketingcampagnes. Daarbij is afgesproken dat INOVA gedurende vijf jaar x% van alle B2C (business-to-consumer) omzet van Den Mulder ontvangt. De afgelopen twee jaar is de prognose van de verwachte omzet niet behaald, waardoor de urgentie vanuit INOVA hoog is. Om ervoor te zorgen dat de investering winstgevend wordt, moet de omzet uit B2C-verkoop verhoogd worden. Dit willen ze bereiken door de huidige gebruikerservaring van de website te verbeteren, specifiek voor particuliere klanten.

 

 

Het gewenste resultaat is dat dit jaar en de komende jaren de omzetprognose wel wordt behaald, en dat een groter deel van de winst afkomstig is van B2C-klanten, zodat er dit jaar nog break-even gespeeld kan worden. Als dit niet het geval is, zal INOVA uiteindelijk een negatieve ROI (Return on Investment) hebben.

 

 

Daarnaast wil Den Mulder, op basis van eigen onderzoek, de consumentenervaring en conversies verbeteren. Ze willen echter de focus behouden op het vinden van de perfecte boom voor alle groenliefhebbers, zonder een schreeuwerige webshop te worden of geassocieerd te worden met een plantencentrum.

 

 

De opdracht houdt in dat de huidige website volledig wordt vernieuwd. Dit betekent dat de website wordt omgezet naar een sneller en moderner e-commerce platform dat het beste past bij de eisen van dit project. Het plan is nu om hier Shopify voor te gebruiken, maar uit onderzoek zal blijken of dit daadwerkelijk de beste optie is of dat er betere alternatieven zijn.

 

 

De vernieuwde branding blijft, maar de lay-out kan worden aangepast op basis van de huidige analyses die moeten worden onderzocht. Het belangrijkste is dat de website geschikt moet zijn voor de nieuwe particuliere doelgroep. De huidige doelgroep (professionals) heeft vaak voldoende kennis van bomen en planten, maar bij de nieuwe doelgroep (particulieren) moet de focus meer liggen op het geven van duidelijke informatie die particulieren helpt bij de aankoop van groenartikelen.

 

 

De opdracht omvat het analyseren van de huidige website op gebruikersfouten, het ontwerpen van verschillende iteraties voor het nieuwe ontwerp en het testen van het ontwerp bij de doelgroep. Ik zal de website dus niet volledig programmeren, dit wordt gedaan door het development team.

 

 

Uit deze opdracht is de volgende onderzoeksvraag voortgekomen:

“Hoe kan de gebruikerservaring van de Den Mulder Boomteelt website worden geoptimaliseerd om in de toekomst de conversie van particuliere (B2C) klanten te verhogen, met behoud van consistentie van de huidige huisstijl en professionele (B2B) website?”

 

Om deze onderzoeksvraag te kunnen beantwoorden zijn de volgende deelvragen opgesteld, welke ik door middel van exploratief onderzoek probeer te beantwoorden.

    1. Hoe verloopt de klantreis en waar kan deze worden verbeterd?
    2. Wie zijn de concurrenten van Den Mulder en hoe lossen zij de problemen op?
    3. Met welke technische & functionele vereisten dient er vanuit de consument, Den Mulder, INOVA en Europese regelgeving rekening gehouden te worden?
    4. Wat is het beste e-commerce platform om te gebruiken het Den Mulder project?
    5. Wat zijn de laatste innovatieve technologieën die de gebruikerservaring van webshops kunnen verbeteren?
    6. Hoe kunnen (micro) animaties een positief effect hebben op de gebruikers ervaring?
    7. Hoe wordt het nieuwe website ontwerp vormgegeven?
    8. Hoe worden de animaties vormgegeven?
    9. Welke UX/UI elementen moeten nog worden aangepast om het nieuwe ontwerp te verbeteren?
    10. Is het ontwerp conversie verhogend ten opzichte van de huidige situatie en wat zijn de vervolgstappen om de conversies verder te verhogen?
    11. Is het ontwerp ethisch verantwoord en hoe zou deze verbeterd kunnen worden?

Proces

Aan het begin van het project is er een projectplan opgesteld. Dit document biedt een overzicht van wat er gedurende de afstudeerstage wordt opgeleverd en welke methodes worden gebruikt om de hoofdonderzoeksvraag te beantwoorden. Zo staat erin beschreven dat er wordt gewerkt volgens de scrum-methodiek, gebruik wordt gemaakt van het DOT-framework en de Double Diamond-methode, waarbij alle vier de fases Discover, Define, Develop en Deliver zijn doorlopen.

 

Allereerst ben ik begonnen met het in kaart brengen van het probleem. Dit heb ik gedaan door antwoord te geven op deelvraag #1 ‘Hoe verloopt de klantreis en waar kan deze worden verbeterd?’. Door het uitvoeren van  een Literature Study en Online Analytics heb ik meer informatie kunnen verzamelen over de gebruikers van de website. Hierdoor heb ik Personas en een Customer Journey kunnen samenstellen om de pijnpunten van de gebruikers te detecteren. 

 

Om antwoord te geven op vraag #2 ‘Wie zijn de concurrenten van Den Mulder en hoe lossen zij UX/UI problemen op?’ heb ik een Benchmark Creation uitgevoerd bij de grootste concurrenten van Den Mulder. Dit onderzoek heeft de UX/UI-problemen van de huidige website bevestigd zoals het niet kunnen vinden van artikelen, onduidelijke informatie en onoverzichtelijke indelingen. Daarnaast heeft dit onderzoek gezorgd voor waardevolle referenties en inspiratie.

 

De resultaten van vraag #1 en #2 heb ik gebruikt om antwoord te geven op vraag #3 ‘Met welke technische & functionele vereisten dient er rekening gehouden te worden?’. Door middel van een Expert Interview en een Literature Study heb ik een Requirements List kunnen samenstellen. Dit onderzoek heeft alle noodzakelijke vereisten in kaart gebracht om onderzoeksvraag #7 te kunnen beantwoorden.

 

Om antwoord te geven op vraag #4 ‘Wat is het beste e-commerceplatform om te gebruiken voor het Den Mulder project?’ heb ik Literature Study en een Expert Interview gehouden om een Comparison Chart te maken. Deze bevestigd dat Shopify daadwerkelijk de beste optie is voor het Den Mulder project en andere soortgelijke projecten, op basis van gebruiksgemak, verkoopfuncties, ontwerpfunctionaliteit en de hulp- en ondersteuningsopties.

 

Om antwoord te geven op vraag #5 ‘Wat zijn de laatste innovatieve technologieën die de gebruikerservaring van webshops kunnen verbeteren?’ heb ik een Literature Study en Trend Analysis uitgevoerd om nieuwe inzichten te verkrijgen die de gebruikerservaring verbeteren. Hierbij heb ik onder andere gekeken naar het toevoegen van een chatbot, AI-gedreven inhoud en micro-animaties.

 

Eén van de resultaten uit vraag #5 is verder onderzocht om antwoord te geven op vraag #6 ‘Hoe kunnen (micro) animaties een positief effect hebben op de gebruikerservaring?’. Door middel van Literature Study is onderzocht hoe animaties een positief effect kunnen hebben op de gebruikerservaring door gebruikers te helpen in plaats van hen af te leiden of te frustreren.

 

Om antwoord te geven op vraag #7 ‘Hoe wordt het nieuwe websiteontwerp vormgegeven?’ heb ik een Prototype (Zie onderstaande Figma) gemaakt. Dit prototype is bepaald op basis van de resultaten uit onderzoek #1, #2 en #3, in combinatie met Literature Study en Co-reflection. Hierdoor weet de klant wat hij kan verwachten en weet het development team hoe alle componenten ontwikkeld moeten worden.

Gedurende de Midterm 360° Review heb ik de voortgang van het project gepresenteerd aan beide assessoren en medestudenten middels een Pitch. Dit heeft waardevolle feedback opgeleverd, zoals ontbrekende onderbouwingen voor de gemaakte ontwerpkeuzes en waarom deze een verbetering zijn ten opzichte van de huidige situatie. Deze feedback is toegepast in de laatste fase, waaronder onderzoek #9.

 

Om antwoord te geven op de vraag #8 ‘Hoe worden de animaties vormgegeven?’ heb ik een Proof of Concept gemaakt. De eenvoudige animaties zijn uitgewerkt in Figma, en voor de complexere animatie is er gebruik gemaakt van de tool Rive. Hierdoor is bepaald hoe de micro-animaties reageren, zodat Den Mulder weet wat ze kunnen verwachten en het development team weet hoe de componenten ontwikkeld moeten worden.

 

Om het ontwerp van #7 te valideren is naar antwoord gezocht op de vraag #9 ‘Welke UX/UI elementen moeten nog worden aangepast om het nieuwe ontwerp te verbeteren?’ heb ik een Usability Test uitgevoerd waarbij het gebruik van het prototype door gebruikers werd geanalyseerd. Dit bevestigde de eerder gevonden resultaten van het oude ontwerp uit onderzoek #1. Ook bleek uit de test dat 100% van de test gebruikers het nieuwe ontwerp een verbetering vond van het oude. Dit kwam volgens hen onder andere door de modernere en frissere uitstraling, de duidelijkere en logischere informatie en het direct kunnen toevoegen van aanbevolen artikelen. Om het ontwerp verder te verbeteren, heb ik een Peer Review gehouden gericht op de conversieoptimalisatie. Hieruit kwamen verbeterpunten, zoals een andere indeling, het toevoegen van knoppen en het toevoegen van aanbevolen combinaties. In een Design Pattern Search zijn andere soortgelijke webshops onderzocht om te zien hoe zij problemen aanpakken. Dit resulteerde in alternatieven voor de dropdown, voor het selecteren van een artikel. In een A/B test. zijn onder andere deze selectievariant en het navigatiemenu onderzocht. Uit deze test bleek dat het ontwerp met de vernieuwde iteraties, ontwerp B (zie onderstaande afbeelding), een verbetering is omdat het overzichtelijker, duidelijker en vertrouwder aanvoelt op basis van de meeste stemmen.

Om antwoord te geven op vraag #10 ‘Is het ontwerp conversie verhogend ten opzichte van de huidige situatie en wat zijn de vervolgstappen om de conversies verder te verhogen?’ zou dit getest moeten worden met de live website, maar deze gegevens zijn momenteel nog niet beschikbaar. Om die reden is er een Expert Interview ingepland met de CRO (conversie rate optimalisation) specialist binnen INOVA. Hieruit is gebleken dat het nieuwe ontwerp vele conversie verbeteringen heeft ten opzichte van het huidige ontwerp. Zoals extra conversie knoppen, verbeterde filters en direct zichtbare ‘voeg toe aan winkelwagen’-knop boven de vouwlijn. Toch zijn er nog verbeterpunten voor een latere fase, maar de grootste conversiepakkers zijn doorgevoerd in deze vijfde versie.

 

Om antwoord te geven op de vraag #11 ‘Is het ontwerp ethisch verantwoord en hoe zou deze verbeterd kunnen worden?’  is er gebruik gemaakt van de Ethical Check met behulp van de Technology Impact Cycle Tool om er zeker van te zijn dat de website de juiste impact heeft. Hieruit is gebleken dat er geen groepen worden buitengesloten omdat het ontwerp voor vrijwel iedereen toegankelijk is, er op de website producten worden verkocht die een positief effect hebben op mens en natuur en er is gekozen voor een verantwoord e-commerceplatform dat gebruik maakt van 100% hernieuwbare energie. Om de website verder te verbeteren, zou er een chatbot kunnen worden toegevoegd of technologie waarmee de consument meer informatie ontvangt over de grootte van de artikelen.

 

Aan het einde van de stage heb ik een reflectie geschreven, waarin ik terugkijk naar het project en mijn eigen handelen. Zo staat er opschreven wat er goed ging zoals het uitbreiden van mijn design vaardigheden en wat ik in het vervolg anders zou doen waaronder het beter voorbereiden van de presentatie en het nog beter bewaken van de planning.

 

Om het stageproject af te ronden heb ik een advies rapport geschreven. Hierin staat het project omschreven, de gevonden resultaten, het eindresultaat van de vijfde versie voor desktop en tweede versie voor mobiel. Tot slot geef ik mijn advies aan INOVA en Den Mulder om het project in de toekomst verder te optimaliseren.

 

In het logboek zijn de geklokte uren met beschrijvingen te zien, zo kan er worden teruggezien waar ik aan heb gewerkt en hoelang ik hierover heb gedaan.

Conclusies en aanbevelingen

In dit onderzoek is er gezocht naar een antwoord op de vraag ‘Hoe kan de gebruikerservaring van de Den Mulder Boomteelt website worden geoptimaliseerd om in de toekomst de conversie van particuliere (B2C) klanten te verhogen, met behoud van consistentie van de huidige huisstijl en professionele (B2B) website?’

 

De resultaten tonen aan dat particuliere gebruikers problemen ervaren met het zoeken, bestellen en begrijpen van informatie op de huidige website van Den Mulder. Een nieuw ontwerp met een verbeterde indeling, overzichtelijke menustructuur, meer begrijpelijke uitleg, gepersonaliseerde artikelen en betere zoek- en filterfunctionaliteit zorgen gegarandeerd voor een verbeterde gebruikerservaring, zo blijkt uit een kwalitatieve gebruikerstest.

 

Uit een literatuuronderzoek blijkt dat het toevoegen van AI-gedreven inhoud zorgt voor een gepersonaliseerde winkelervaring. Ook chatbots en virtuele assistenten helpen klanten bij het vinden van de juiste groen artikelen. Resultaten uit een gebruikerstest bevestigen dat particuliere gebruikers een gepersonaliseerde winkelervaring en chatbots verwachten bij een webshop en hier ook gebruik van zouden maken. Uit hetzelfde literatuuronderzoek blijkt dat het toevoegen van micro-interacties ervoor zorgt dat gebruikers beter zien welke objecten klikbaar zijn. Dit maakt de gebruikerservaring dynamischer en aantrekkelijker, waardoor gebruikers langer betrokken blijven en de kans op conversie wordt verhoogd.

 

Uit de resultaten van een kwantitatieve A/B-test blijkt dat 64% van de testgebruikers een voorkeur heeft voor het selecteren van artikelen met meerdere knoppen, omdat dit als overzichtelijker en duidelijker wordt beschouwd dan een dropdown met meerdere keuzemogelijkheden. Op basis van de positieve onderzoeksresultaten uit de gebruikerstest en het expertinterview kan worden aangenomen dat het nieuwe ontwerp hoogstwaarschijnlijk conversie verhogend werkt ten opzichte van de huidige website. Dit zal blijken wanneer de website live staat en volledig functioneert zoals behoren.

 

Dus, er kan met zekerheid worden geconcludeerd dat het nieuwe ontwerp zorgt voor een geoptimaliseerde gebruikerservaring voor particuliere klanten. Dat indirect in combinatie met de  toegevoegde conversie verhogende onderdelen zal zorgen voor een hogere conversie. Echter, er is altijd ruimte voor verdere optimalisatie en zal de toename van conversies moeten blijken wanneer de website live staat.

 

Omdat de conversies nu nog niet gemeten kunnen worden, wordt het aanbevolen om deze direct na livegang te observeren en actie te ondernemen indien de resultaten anders uitvallen dan verwacht. In de volgende fase kunnen gebruikers opnieuw geanalyseerd worden om de website verder door te ontwikkelen. De onderzoeksresultaten uit dit onderzoek kunnen voor INOVA waardevolle informatie bevatten voor soortgelijke e-commerce projecten, door gebruik te maken van de onderzochte platformen of innovatieve technologieën. Voor Den Mulder kunnen de onderzoeksresultaten waardevolle informatie bevatten om de website in de toekomst te blijven verbeteren.

Leesgids

Evaluatie (Project perspectief)

Situatie: De afgelopen 20 weken heb ik mijn afstudeerstage gevolgd bij full-service marketingbureau INOVA in Meijel. Hier heb ik de mogelijkheid gekregen om een herontwerp van de Den Mulder Boomteelt website te maken, onder begeleiding van Pepijn Coenders. Bij dit project waren drie andere INOVA-medewerkers betrokken: Eveline Maas (projectleider), Joost Koopmans (lead developer) en Cristel Verheijen (SEO-marketeer).

 

Taak: Mijn taak was het herontwerpen van de website, zodat deze geoptimaliseerd is om de conversie van particuliere klanten te verhogen, met behoud van de huidige huisstijl. Alle keuzes dienen te worden onderzocht en gevalideerd om er zeker van te zijn dat het gewenste resultaat kan worden behaald.

 

Actie: Aan het begin van het project is er een projectplan opgesteld. Hierin zijn het project beschreven, de scope gedefinieerd, de planning vastgesteld en de onderzoeksvragen met de bijbehorende onderzoeksmethoden uitgekozen. Gedurende het project is er gewerkt volgens de vier fasen van de Double Diamond-methode. Deze methode zorgt ervoor dat er zo veel mogelijk informatie wordt verzameld binnen de beschikbare tijd en dat alleen het juiste probleem wordt aangepakt door middel van definitie. Bij iedere fase zijn de bijbehorende onderzoeksvragen beantwoord met onderzoeksmethoden uit het DOT-framework (of CMD-methodes). Iedere week is de voortgang van het project besproken met Pepijn (stagebegeleider), en regelmatig is er een gesprek ingepland met stakeholders om keuzes, resultaten en verbeterpunten te bespreken.

 

Resultaat: Ondanks een grote wijziging in de opleverdatum voor het ontwerp, is de planning dusdanig aangepast dat alleen de meest noodzakelijke onderdelen zijn onderzocht voordat er aan het ontwerp is begonnen. Hierdoor zijn er onderzoeksvragen weggevallen, gewijzigd of zijn er nieuwe bijgekomen. Desondanks zijn de noodzakelijke onderdelen binnen de beschikbare tijd afgerond door strenge tijdbewaking. Er werd alleen wanneer nodig gecommuniceerd met de stakeholders, de communicatie was duidelijk en gericht. De ontvangen feedback is meegenomen en toegepast. Dit alles heeft geresulteerd in het antwoord op de hoofdonderzoeksvraag, tevreden stakeholders en een ontwerp dat daadwerkelijk gebruikt gaat worden, wat ook voor de gebruikers van de Den Mulder-website een toegevoegde waarde heeft.

 

Reflectie: Over het algemeen is het project goed verlopen. De stakeholders van Den Mulder en INOVA zijn, net als ikzelf, zeer tevreden met het opgeleverde werk, dat waardevolle inzichten en resultaten heeft opgeleverd. Ik ben trots dat het ontwerp daadwerkelijk gebruikt gaat worden, maar ik zie ook nog ruimte voor verbetering, zowel in het ontwerp als in de onderzoeksresultaten. Door de vervroegde deadline werd de planning overhoop gehaald en werd de website al ontwikkeld voordat deze volledig getest was. De onderzoeksdocumenten zijn pas later uitgeschreven, waar ik meer tijd voor nodig had dan ingecalculeerd,. Hierdoor ben ik ook pas redelijk laat begonnen met testen. Waarbij ik er ook achter kwam dat de volgorde bij de A/B-test voor verwarring heeft kunnen zorgen en dat de testopstelling met Maze en Figma niet de beste resultaten opleverde door beperkte functionaliteit. Dit zou ik de volgende keer beter uitproberen voordat ik de test verstuur.

Reflectie – Eigen perspectief

Ik ben zelf erg tevreden over het opgeleverde resultaat, zowel voor het project als voor het portfolio. Tijdens dit proces heb ik nieuwe kennis opgedaan over het analyseren van websitegegevens, het beter ontwerpen van gebruiksvriendelijke websites, het toepassen van animatietechnieken, het uitbreiden van mijn kennis over design tools, het uitvoeren van onderzoeken en het verbeteren van mijn professionele vaardigheden.

 

Bij de midterm had ik het gevoel dat ik er goed voorstond. De probleemstelling leek duidelijk te zijn en de beoordeling van de bedrijfsbegeleider was wat ik verwachtte voor dat moment van de stage. Ik vond echter dat het presenteren niet erg soepel verliep. Dit kwam mede doordat het in het Engels moest, waardoor ik niet altijd gemakkelijk uit mijn woorden kwam. Een betere oefening voor de eindpresentatie zou hierbij helpen. Bij de midterm presentatie miste er nog een onderbouwing voor de gemaakte ontwerpkeuzes en waarom deze een verbetering zijn van de huidige situatie. Mij werd aangeraden om na te denken over het gebruik van nieuwe technologieën om het project innovatiever te maken, wat ook ingezet zou kunnen worden voor andere klanten van INOVA. De ontvangen feedback heb ik meegenomen tijdens de laatste fase. De designkeuzes zijn nog gevalideerd door middel van A/B- en usability-tests. Daarnaast is er een extra onderzoek toegevoegd naar hoe innovatieve technologieën de gebruikerservaring kunnen verbeteren.

 

Gedurende de stage heb ik aan vier van de vijf persoonlijke leerdoelen kunnen werken. Mijn designvaardigheden zijn enorm verbeterd door het ontwerpen van een uitgebreid interactief prototype in Figma. Ik heb geleerd hoe ik de auto layout correct kan toepassen en hoe variabelen werken. Daarnaast heeft de ontvangen feedback van experts mij nieuwe inzichten gegeven voor verbeteringen. Ook heb ik geleerd hoe ik betere animaties kan creëren met nieuwe animatietools zoals Rive. Daarnaast heb ik geleerd hoe ik websitegegevens kan analyseren en wat belangrijk is bij het ontwerpen op het gebied van SEO, SEA en CRO.

 

Mijn professionele vaardigheden zijn verbeterd door het hebben van meer werkervaring in een bedrijfsomgeving. Hierbij heb ik hulp gevraagd aan de desbetreffende persoon wanneer ik dit nodig had, waarbij ik altijd heb gevraagd of deze persoon er tijd voor had en een moment ingepland waarop het voor diegene het beste uitkwam. Daarnaast ben ik mijn afspraken nagekomen en ben ik professioneel te werk gegaan om waardevolle producten op te leveren die voldoen aan de verwachte kwaliteit. Helaas ben ik er niet aan toe gekomen om mijn softwarevaardigheden te verbeteren met dit project. Wel heb ik gebruik gemaakt van een WordPress-website voor het portfolio, waarmee ik heb geleerd dat je vrij snel en eenvoudig een functionerende website online kunt zetten. Dit is zeker iets waar ik vaker gebruik van zal maken.

 

In het vervolg zou ik grotendeels op dezelfde manier te werk gaan. Het opstellen van een projectplan heeft mij een goede houvast gegeven. Ondanks dat ik de planning ruim heb ingedeeld, ben ik niet aan alles toegekomen. Dit komt vooral doordat het voor mij veel tijd en moeite kost om de documenten te typen en te verbeteren, waardoor ik minder tijd had dan verwacht voor het ontwerpen, testen en ontwikkelen. In een overleg met de stagebegeleider is er gekeken naar welke onderdelen weggelaten konden worden. Aan het einde van de stage heb ik nog steeds een goed gevoel en kan ik met zekerheid zeggen dat dit project een meerwaarde heeft gehad voor Den Mulder, INOVA en mijzelf.

Back To Top
Theme Mode