UX-case study

Bestelbeslissingen stroomlijnen

Coolblue, een toonaangevende elektronicaretailer in Nederland en België, staat bekend om zijn uitzonderlijke klantenservice en speelse marketingstijl. In mijn tijd daar zat het bedrijf midden in een grote transformatie: het moderniseerde zijn backendsystemen om de operatie te stroomlijnen en efficiënter te maken.

Beslistijd vooraf Beslistijd daarna
A clock-face ring chart: the full circle represents one hour, and the ring fills from the top, clockwise, through the 45-minute mark. 0153045
A clock-face ring chart: the full circle represents one hour, and the ring fills from the top, clockwise, through the 3-minute mark. 0153045

30 – 45min

1 – 3min

Productbeschikbaarheid

+36%

Gemeten over 6 maanden

Klant
Rol UX-designer
Team 1 UX-designer, 1 front-end, 3 back-end, 1 product owner
Platform Windows-desktopapplicatie
Het uiteindelijke bestelscherm: één duidelijke beslissing tegelijk
De oplossing: één beslisscherm dat 30-45 minuten spreadsheetwerk verving door een afweging van 1-3 minuten.

Probleem

Waarom dit project?

Coolblue stond voor een kritiek probleem: het bestelproces was traag, onbetrouwbaar en inefficiënt. De kern lag in het omslachtige beslisproces van de inkopers.

Om een artikel bij te bestellen moesten inkopers 17 verschillende gegevenspunten verzamelen en analyseren, waarvan veel moeilijk te vinden waren in het verouderde systeem. Dit handmatige proces, met dataverzameling, spreadsheetberekeningen en handmatige invoer, kostte 30 tot 45 minuten per beslissing.

Daardoor werden veel producten niet op tijd bijbesteld, en de producten die dat wél werden kampten vaak met overvoorraad, met verspilde magazijnruimte en meer risico tot gevolg.

Onze business analisten wezen het trage en onbetrouwbare bestelproces aan als een grote rem op de omzetgroei. Producten die vaak niet leverbaar waren, beperkten ons vermogen om te concurreren en de verkoop te maximaliseren.

Een melding dat een product is uitverkocht in de Coolblue-winkel
Een uitverkocht product is niet alleen frustrerend voor de gebruiker, maar heeft ook een flinke impact op het merk.

Doelen

Gewenst resultaat

Drie doelen bakenden het werk af.

Verhoog de frequentie
Zorgen dat producten vaker worden aangevuld.
Verminder overvoorraad
Overtollige voorraad beperken om magazijnruimte te optimaliseren.
Automatiseer makkelijke beslissingen
Het proces voor routinematige bestellingen stroomlijnen.

Ons team wilde het bestelproces optimaliseren door de productbeschikbaarheid te verhogen, overtollige voorraad te verlagen en routinetaken te automatiseren. Met een lerend systeem dat de gangbare bestelbeslissingen kon afhandelen, wilden we tijd vrijmaken voor strategisch werk zoals langetermijnplanning en onderhandelingen met leveranciers. Dat zou niet alleen de efficiëntie verhogen, maar ook de risico's van menselijke factoren beperken, zoals vergeetachtigheid of verloop, die de voorraadbeschikbaarheid kunnen schaden.

Bijvoorbeeld: in de winter een voorraad barbecues in zwart, rood en groen vastleggen om ze de zomer erop te kunnen verkopen. Dat laat zien hoe de vaardigheden van een inkoper beter tot hun recht komen, want het vraagt actief contact met fabrikanten, onderhandelen over prijs, deals sluiten, enzovoort.

Daarnaast wilden we het geheugen van de inkoper ontlasten. Mensen groeien, stappen over naar een ander bedrijf, worden ziek, vergeten dingen. Al die omstandigheden remmen de voorraadbeschikbaarheid in een winkel.

Team & publiek

Wie bouwde dit, en voor wie?

Een goed gevulde winkel komt de klant direct ten goede, maar deze tool was in de eerste plaats ontworpen voor medewerkers van Coolblue, en dan vooral de inkopers die de bestellingen beheren. Elke inkoper had een standaard desktop-pc met monitor, muis en gamepad.

Samenstelling van het team

Het team bestond uit één front-enddeveloper (XAML voor Windows-applicaties), één product owner, drie back-enddevelopers (.NET) en een UX-designer (ik). De applicatie was gemaakt om uitsluitend op Windows-desktops te draaien, in lijn met de hardwareconfiguratie die het bedrijf ondersteunde.

Mijn verantwoordelijkheden

Als eerste UX-designer die zich in de backofficesystemen van Coolblue verdiepte, had ik een breed takenpakket. Ik moest de bedrijfsvoering, de dynamiek met partners en de specifieke behoeften van de inkopers grondig doorgronden. Ook sprak ik met stakeholders om hun perspectief op te halen en te begrijpen wat hun beslissingen beïnvloedde, inclusief de aanzienlijke invloed van de CEO.

Scope en beperkingen

Beperkingen

In plaats van A/B-testen beoordeelden we de prestaties van het product aan de hand van belangrijke businessmetrics. Met een relatief kleine gebruikersgroep van 12-24 personen was het haalbaar om kwalitatief en verkennend onderzoek, zoals gebruikersinterviews, met alle gebruikers te doen.

Proces

Stap voor stap

Deze tekst beschrijft het product zoals het was in mijn tijd bij Coolblue. Ik denk dat het sindsdien flink is doorontwikkeld. De oorspronkelijke versie was bijvoorbeeld gemaakt voor Windows-desktops, terwijl Coolblue inmiddels is overgestapt op een webapp.

01

Gebruikersinterviews

Als pionier in UX-design voor de backofficesystemen van Coolblue startte ik dit project voordat er een eigen product owner was aangesteld. Om de bedrijfsprocessen volledig te begrijpen, deed ik interviews en observaties met verschillende medewerkers van Coolblue. Daarmee maakte ik me de interne logistiek, de doelen rond klantbeleving en de fijne kneepjes van het bestelproces eigen.

Customer journey map

De afbeelding toont de volledige klantreis, van eerste overweging tot aankoop. Deze visuele weergave helpt klanten door het koopproces, nog voordat ze actief met het product bezig zijn.

02

Werk zoals zij

Om het proces praktisch te doorgronden, speelde ik zelf inkoper en plaatste ik bestellingen met de bestaande tools. Die directe ervaring leverde waardevolle inzichten op in de fijne kneepjes van het beslisproces en bracht drie factoren aan het licht die de keuzes van inkopers sturen.

  • Moet ik nu bijbestellen?

    De software bepaalde de behoefte aan bijbestellen door producten met een lage voorraad te signaleren. Om inkopers te helpen beslissen, toonde het systeem de relevante informatie.

  • Zo ja, hoeveel moet ik bijbestellen?

    De optimale bestelhoeveelheid hing af van zaken als beschikbare magazijnruimte en de voorraad bij de leverancier, die niet altijd direct te zien waren. Sommige leveranciers gaven realtime voorraadinformatie, andere niet, en contractafspraken en levertijden verschilden per leverancier.

  • Kan ik bij de gekozen leverancier bijbestellen?

    Dat hangt af van de punten hierboven: contracten, levertijd, inzicht in de voorraad.

Om de beperkingen van het magazijn en de bestaande tools beter te begrijpen, bracht het team twee bezoeken aan de magazijnen.

03

Ideatiesessies

In gezamenlijke brainstormsessies, begeleid door de product owner, zagen we dat veel bestelbeslissingen te automatiseren waren terwijl de complexe taken bij de inkopers konden blijven. Die gesprekken lieten ook zien hoe cruciaal het bestelproces is binnen de hele operatie van Coolblue.

3.1. Het oude proces in kaart brengen

Om het product goed te kunnen ontwerpen, richtten we ons op het begrijpen van de interacties tussen gebruikers en zowel fysieke als digitale systemen in verschillende bedrijfsonderdelen. Ik maakte een visuele reeks die de stappen toont die een inkoper zet om te beslissen of een bepaald product bijbesteld moet worden.

04

Wireframing

Ik maakte de eerste wireframes die de workflow van de tool schetsten. Onder druk van de CEO kregen we de opdracht een tool te ontwerpen die zo gebruiksvriendelijk was dat je hem zelfs met een Xbox-gamepad kon bedienen. Ik las dat eerst als een metafoor voor eenvoud, maar het werd duidelijk dat compatibiliteit met de Xbox-controller een echte eis was.

Toch zorgde ik ervoor dat de tool kantoorvriendelijk bleef en soepel werkte met toetsenbord en muis.

05

High-fidelity prototyping

De tool was ontworpen op eenvoud, met één beslissing tegelijk. Ons doel was inkopers precies de meest relevante informatie te geven voor snelle en accurate bestelbeslissingen.

De tool signaleerde automatisch welke artikelen bijbesteld moesten worden, en de inkoper beoordeelde of er besteld werd, hoeveel, en bij welke leverancier (aanvankelijk beperkt tot één). Na een beslissing ververste het scherm en ging het door tot alle bestelbehoeften van die dag waren afgehandeld.

06

Validatie, iteratie & demo's

We valideerden in elke fase in plaats van alles in één keer. Guerrillatesten was simpel: met een link naar het InVision-prototype liepen inkopers zelf door het ontwerp, en ik legde hun feedback vast voor het team.

Na de lancering hield ik na elke sprint feedbacksessies, en uiteindelijk nodigde ik inkopers uit in onze teamruimte om met de live applicatie te werken en het ontwikkelteam rechtstreeks te bevragen. Sprintdemo's, bijgewoond door inkopers en stakeholders, hielden iedereen op één lijn over nieuwe features en de voortgang op onze KPI's.

Het bestelscherm, met product, voorraad, leveranciersopties en verkoophistorie in één weergave
Inkopers die de benodigde gegevenspunten nalopen. Met deze visuele weergaven konden ze inschatten of een product nader onderzoek verdiende voor bijbestellen. Inkopers leunden vaak op eigen hulpmiddelen, zoals spreadsheets, voor extra gegevenspunten, en een gedeelde wiki hielp bij het navigeren door het proces.

Conclusie

Resultaten

1 – 3min

Inkopers nemen bestelbeslissingen in de app nu in 1-3 minuten, een flinke verbetering ten opzichte van de eerdere 30-45 minuten (zelf gerapporteerd).

50 – 60min/dag

Inkopers gaven aan de app zo'n 50-60 minuten per dag te gebruiken, afhankelijk van het aantal inkoopbeslissingen.

+36%

Over een periode van zes maanden steeg de productbeschikbaarheid over het hele assortiment met 36%, inclusief geautomatiseerde bestellingen.

~25%

Ongeveer een kwart van de bestelbeslissingen in het assortiment werd volledig geautomatiseerd door het lerende systeem, waardoor inkopers zich konden richten op onderhandelen met leveranciers en langetermijnplanning.

Lessen

Simpel, niet gamepadcompatibel
We leerden dat de filosofie om het zó simpel te maken dat je de app met een gamepad zou kunnen bedienen de juiste was. Maar hem daadwerkelijk gamepadcompatibel maken was niet nodig. Helaas brachten externe druk en omstandigheden ons daar toch, ondanks onze inspanningen.
Ga direct naar de bron
De transportsector loopt als geheel technologisch achter en is vaak terughoudend in het delen van data. Interne bureaucratie binnen Coolblue en bij leveranciers, in combinatie met gebrekkige afspraken uit het verleden, remden onze voortgang. Rechtstreeks contact met externe partijen bleek van grote waarde.
Eén beslissing tegelijk
Taken één voor één tonen had een sterke theoretische basis, maar onze inkopers merkten al snel dat die aanpak hun gevoel van controle in de weg zat. Voor een betere gebruikservaring moest het scherm opnieuw worden ontworpen, zodat meerdere beslissingen tegelijk of in realtime genomen konden worden.
Meet wat je wilt weten
We hielden overvoorraad niet direct bij, en in gesprekken met logistiek konden we geen duidelijke verschuiving in het gedrag van inkopers rond overtollige voorraad aanwijzen. Zou ik dit opnieuw doen, dan zou ik die metric direct meten in plaats van te leunen op anekdotische gesprekken.
Automatisering komt langzaam
Automatisering invoeren is lastig, zeker met externe afhankelijkheden. Het proces kan traag zijn en is voor eindgebruikers vaak nauwelijks merkbaar. We automatiseerden met succes bijna een kwart van het assortiment, maar de lange doorlooptijd was voor velen frustrerend.