OTTO Group

OTTO Mobile checkout process

Rol: Interaction Designer
Duur: Nov 2017 – Feb 2018

De organisatie is Otto B.V. Nederland. Otto B.V. is uitgegroeid tot de grootste homeshopping-organisatie wereldwijd, op Amazon na, met hoofdvestiging in Hamburg. Otto B.V. is momenteel actief in meer dan 20 landen en heeft wereldwijd zo’n 50.000 medewerkers. Dit project is een onderdeel van de costumer dashboard waar ik aan ‘mijn Otto’ zal werken.

Otto is regelmatig bezig met testen van pagina’s via Hotjar. Hotjar is een platform waar je funnels kan creëren en je bezoekers kan volgen hoe zijn in het proces zitten. Na een test op ‘bestaand e-mailadres bij ik ben nieuw’ is naar voren gekomen dat er een usability probleem is. Hieruit bleek dat klanten die zich eerder hebben geregistreerd niet meer kunnen inloggen op hun account. Meestal heeft dit te maken met dat ze waarschijnlijk hun wachtwoord niet meer weten of dat ze zich niet meer kunnen herinneren dat ze ooit een account hebben aangemaakt bij Otto. Als de gebruiker zijn wachtwoord niet meer weet, dan willen ze zich meestal aanmelden als nieuwe klant. Vervolgens krijgen ze een melding dat het e-mailadres al bestaat. Dat is het punt waar het meestal mis loopt en de klanten het proces afbreken.

Data en pijnpunten

Tijdens deze analyse is naar voren gekomen dat gebruikers niet meer weten wat ze moeten doen. Dus heel veel gebruikers haken af bij het checkout proces. Deze analyse ging over een periode van 7 dagen en het bezoekersaantal die in een checkout proces (basket) bevonden waren 9.493 (100%) mensen. Van deze mensen zijn er 3.761 (39,6%) mensen door gegaan naar de inlogpagina. Vanuit de inlogpagina hebben 318 (8,5% van 3.761) mensen een bestaand e-mailadres opgegeven en 138 (43,4% van 318) mensen hebben het proces daarna afgebroken omdat ze waarschijnlijk niet wisten hoe ze verder moesten.

Huidige situatie

Scherm 1:
De gebruikers komen op deze pagina terecht als ze zich moeten aanmelden. Bovenin de pagina is ook de proces indicator te zien dat ze al hebben gewinkeld en nu willen uitchecken.

Allereerst denkt de gebruiker dat ze meestal een nieuwe gebruiker zijn en kiezen ze de optie ‘ik ben nieuw bij OTTO’.

Scherm 2:
Na het invoeren van het bestaande e-mail- adres krijgt de gebruiker het volgende scherm te zien. De gebruiker weet zo niet precies waar je het wachtwoord kan wijzigen. Echter wordt dit wel in de error-melding aangegeven.

Scherm 3:
Op het moment dat de gebruiker een verkeerde e-mailadres of wachtwoord invoert, krijgt de gebruiker de bovenstaande error-melding.

Usability problemen

  • De gebruiker weet meestal niet of de e-mailadres al eerder is geregistreerd
  • Het is voor de gebruiker onduidelijk om wachtwoord te herstellen
  • Door de kleur van de error melding schrikt de gebruiker af
  • De tekst in de error melding is lang waardoor de gebruiker informatie mist

Final design

Scherm 1:
Vergeleken met het oude ontwerp vraag ik nu aan de gebruikers of ze al een account hebben of dat ze nieuw zijn bij Otto. Op het moment dat de gebruikers op ‘ik heb al een account’ klikken gaan ze door naar ‘inloggen’, zie afbeelding 5 verkeerde inloggegevens. Natuurlijk zonder de error melding wat nu te zien is.

Ook geldt dit voor ‘ik ben nieuw bij Otto’. De gebruiker gaat automatisch naar de volgende pagina, zie afbeelding 5 verkeerde inloggegevens. De card ‘inloggen’ is dan ingeklapt. Dat betekent dat de gebruiker de card ‘ik ben nieuw bij Otto’ te zien krijgt.

Scherm 2:
Op het moment dat de gebruiker het verkeer- de e-mailadres of wachtwoord typt, krijgt de gebruiker de volgende melding: ‘De combinatie van het ingevoerde e-mailadres en wachtwoord is onjuist’.

Wel blijft het ingevoerde e-mailadres pre-filled. De reden hiervoor is dat de gebruiker kan controleren of het juiste e-mailadres is opgegeven en niet opnieuw hoeft te typen als het e-mail- adres juist is opgegeven.

Scherm 3:
Als de gebruiker per ongeluk of onbewust een bestaande e-mailadres invoert bij ‘ik ben nieuw bij Otto’, dan krijgt de gebruiker de melding ‘Welkom terug! Je e-mailadres is al bekend bij ons, vul nu je wachtwoord nog in’.

Ook komt er een groene vinkje naast het e-mail- adres om te bevestigen dat dit e-mailadres bij ons bekend is. Hierna kan de gebruiker zijn wachtwoord opgeven of een nieuw wachtwoord aanvragen via ‘wachtwoord vergeten?’