UX/UI-design til indlejrede softwareapplikationer til detailhandel

Den fuldt integrerede tankstationsoplevelse

Detailhandel med benzin

Embedded applikationer

Schweiz

Tankstation i Zürich, Schweiz, hvor brugerundersøgelsen blev udført
PLACERINGSchweiz
TEAMKreativ direktør, UX-researcher, UX-designer, interaktionsdesigner, UI-designer, projektleder, delivery manager, softwarearkitekt, produktejer

Som et af de førende benzinstationsnetværk i Schweiz tilbyder de en verden af detailhandel, herunder supermarkeder, cafeteriaer og bilservice.

Visionen er at forbedre kundeoplevelsen ved at reducere friktionen. Det betyder en revision af brugervenligheden af den kassesoftware, som kassemedarbejderne bruger, og indførelsen af en kundeskærm ved kassen. Ud over den klassiske POS-oplevelse (Point of Sale) ønskede de at designe en betalingsautomat uden for butikken, en mobilapplikation og en carplay-app.

De engagerede vores UX/UI-designbureau til at støtte dette strategiske designprojekt. Vi startede med en grundig brugerundersøgelse på stedet i Schweiz. Derefter udarbejdede vi et nyt end-to-end-kort over kundeoplevelsen og designede UX og UI til hver POS-applikation, én efter én.

VORES BIDRAG

Brugerundersøgelse

UX design

User testing

Prototyping

UI Design - Design System

Information Architecture

Kvalitetssikring

Brugerundersøgelsen blev udført på tankstationen i Kloten nær Zürich

BRUGERUNDERSØGELSE PÅ STEDER I SCHWEIZ

Vores UX-bureaus researchteam tilbragte en uge i Schweiz for at udføre brugerundersøgelser på benzinstationer omkring Zürich. Vi mødte erfarne vagtchefer, stationsledere og folk under uddannelse.

Vi anvendte en blanding af brugerundersøgelsesmetoder, både kvantitative og kvalitative, for at skabe et komplet billede af, hvad der skal ændres. UX-researchen blev udført på tysk, et af UX-designbureauets sproglige kompetencer.

Tankstation, hvor der blev udført brugerundersøgelser til POS-designprojektet
POS-bruger ved kassen på tankstation filmes til observationsstudie af brugerforskning
Interviewer sidder ved et bord på en tankstation i Zürich og taler med en bruger af POS-detailapplikationen

BLIV KONTORIST FOR AT KENDE EN KONTORIST

Formålet med brugerundersøgelsen var at finde ud af, hvilke kompleksiteter og smertepunkter kassemedarbejderne oplever, når de bruger POS-applikationen.

Brugerinterviews gav os et udgangspunkt, men systematisk observation af, hvordan de bruger POS-applikationen til at betjene kunderne, gav os en kvantitativ indsigt i flaskehalse i brugervenligheden. For at gå et niveau dybere arbejdede vores UX/UI-designere sammen med kassemedarbejderne i et participatory research-design. Mens vi spiste frokost med dem, lærte vi om de udfordringer, de står over for ud over POS-brugervenligheden.

User persona of retail POS application shwoing pain points and task breakdown
Præsentation af en kassemedarbejder, der bruger kassesoftware regelmæssigt

HVORDAN UX-SMERTEPUNKTER OPSTÅR I POS-APPS

POS-applikationer håndterer hundredvis af typer af transaktioner. Ved at kortlægge UX-forskningsdata skabte vi en oversigt over scenarier, der skaber problemer.

Der er mønstre i, hvordan UX-smertepunkter opstår. Som regel er der små UX/UI-kompleksiteter, der opbygges i det virkelige liv, og de kompromitterer en transaktion, der tager for lang tid. Disse UX-designproblemer kan kun opdages i det virkelige liv, de kan ikke forudses i designprocessen.

User Experience Diagram, der viser smertepunkter i brugen af point of sale-software

UDFORDRINGER FORSTÆRKES AF KONTEKSTEN

I det virkelige liv fungerer POS-applikationer i en kompleks kontekst. Ved at lave brugerundersøgelser på stedet og deltage direkte, kortlagde vi de kontekstuelle faktorer, der forvrænger POS-systemets anvendelighed.

Vi afdækkede dusinvis af kontekstuelle UX-faktorer, såsom genskin på POS-skærmen forårsaget af ovenlys, eller hvordan bordets layout gør det svært at trykke på nogle områder af POS-touchskærmen.

POS-system på tankstation med højdepunkter, der viser faktorer, der påvirker brugeroplevelsen

SAMMENLIGNENDE ANALYSE AF POS-BRUGERFLOW

Vi har benchmarket brugeroplevelsen af andre POS-systemer. I denne detaljerede analyse sammenlignede og kontrasterede vi løsninger i lyset af de scenarier, som vi afdækkede i brugerundersøgelsen.

Denne systematiske gennemgang af konkurrenternes brugeroplevelsesdesign afslørede et væld af do's and don'ts, der var relevante for projektet. Det hjalp os med at indsnævre den efterfølgende UX-designtilgang.

Sammenlignende analyse af brugerflow i POS-applikationer

PROTOTYPING OG TEST AF LØSNINGER TIL POS-DESIGN

Vi skabte prototyper til forskellige tilgange til brugeroplevelsen. Hver var en kombination af interface-layouts kombineret med en behandling af brugerflowet.

En systematisk sammenligning af fordelene og ulemperne ved hver tilgang blev præsenteret for kundens projektteam, og sammen valgte vi dem, der skulle testes med brugerne. Denne iterative UX-designproces gav os fokus og gjorde det muligt at levere hurtigt. På bare 6 uger havde vi færdiggjort UX-løsningen til POS-applikationen, og udviklingen gik i gang.

High fidelity-prototype af wireframe til indlejret POS-system i benzinhandel
To benzinstationer side om side, der viser detailhandlen i UX-design-casestudiet

SELVBETJENINGSOPLEVELSE TIL TANKSTATIONER

Den udendørs betalingsterminal er starten på selvbetjeningsoplevelsen på tankstationen. Den er tilgængelig 24/7 på fire sprog og i to valutaer. Selvbetjeningsoplevelsen på tankstationer er unik i detailverdenen, fordi benzintransaktioner involverer pumpesystemet.

Terminalens brugergrænseflade blev designet til at fungere under forskellige forhold. For eksempel har ekstrem kulde om vinteren en indvirkning, og om natten tilpasses farverne på brugergrænsefladen for at være mere indbydende.

Brugergrænseflade, der viser brugeroplevelsen af en selvbetjeningsterminal til benzinsalg

ITERATIONER FØRER TIL EN ENKEL BRUGEROPLEVELSE

I en iterativ tilgang med 6 designsprints har vi skabt flere wire-flows og testet dem. Vi forfinede brugergrænsefladen på hver skærm og fjernede grænsefladekomponenter for at reducere kompleksiteten. Hver gang testede vi designet for at sikre, at vi ikke var gået for langt.

Brugerundersøgelsen, der blev udført i de foregående faser, var nyttig til at gøre brugergrænsefladen til selvbetjeningskassen ligetil. For eksempel sætter korte udsagn transaktionsdata i kontekst, og brugerne oplever klarhed.

Illustrationer til vejledning af brugere af selvbetjeningsterminalen til benzinstationer

STØTTE TIL UDVIKLING

Indlejrede systemer har specifikke hardwarefunktioner, og disse blev taget i betragtning i UX/UI-designprocessen. UI-designet afspejler maskinens udseende, og det tager højde for skærmens specifikationer.

Vi gjorde det nemt for udviklerne at implementere selvbetjeningsterminalens brugergrænsefladedesign ved at udarbejde et designsystem. Nu bruger de designsystemet til selv at vedligeholde og opdatere systemet.

UI-design til indlejret system, hvor brugerne vælger betalingsmetode i selvbetjeningskassen
Brugeroplevelsesdetalje, hvor brugere indsender kortoplysninger i selvbetjeningsgrænsefladen
Design systm showing the UI components of the self checkout for petrol retail including buttons, graphics and states

CAR PLAY-APPEN FULDENDER USER EXPERIENCE

For at fuldende kundeoplevelsen har vi designet en car play-applikation. Det er en native app til biler, og den registrerer automatisk, når du kører ind på en tankstation. Den ved også, hvilken pumpe du er stoppet ved. Det eneste, du skal gøre, er at tanke op og køre videre.

Car Play-appen integrerer opdagelse af tankstationer, navigation og tankning. Det reducerer belastningen på butikkens POS-system, og det gør det nemt for brugerne at tanke.

Bilens instrumentbræt med brugergrænseflade til car play-app til benzinstationskæde

CAR PLAY APP SKABT I TO DESIGNSPRINTS

Car play-apps fungerer både med stemme- og touch-kontrol, og UX/UI-designet skal tilpasses til et kørescenarie. Når det er designet korrekt, gør car play det nemmere og mere sikkert at bruge en app.

Car Play-brugeroplevelsen er designet i overensstemmelse med standarderne for Car Play-apps og reglerne for bilindustrien. Vi havde tidligere erfaring med UI-designsoftware som Kanzi, så vi var i stand til at levere applikationen på kun to designsprints.

Ikon for Car Play-app i instrumentbrættet
User interface options for selecting fueling details in car play app
Car play UI design while user is fueling at petrol station
Ui-design til en succesfuld transaktionsskærm i en bilapp til en tankstation
Brugeroplevelsesdesign til mobilapplikation til detailtankstation med bilens instrumentbræt i baggrunden

KONCEPTDESIGN TIL MOBILAPP

Med udgangspunkt i alt det tidligere designarbejde udførte vi yderligere to UX/UI-designsprints for at foreslå en fremtidsorienteret brugeroplevelse til en mobilapp til detailhandlen. Den samler alle elementer i kunderejsen.

Mobilappen er en kritisk komponent i loyalitetsprogrammer og i detailhandlens datamodel. For kunden åbner den op for nye måder at få mest muligt ud af deres gentagne brug af tankstationerne. UI designet afspejler appens visionære natur.

Fem Ui-designs til mobilapplikation til benzinhandel fra Schweiz
Designelementer

A COMPLETE CUSTOMER EXPRIENCE FOR GAS STATIONS

Alle de applikationer, vi har designet, arbejder sammen om at skabe en sammenhængende end-to-end-kundeoplevelse på tankstationer. Selvbetjeningsapplikationerne reducerer belastningen på kassemedarbejderne i butikken, så de kan tilbyde bedre service til kunderne.

Brugeroplevelsen er sammenhængende fra den ene app til den anden, men vi har tilpasset hver enkelt for at afspejle begrænsningerne i indlejrede systemer eller de regler, der gælder for car play-apps. Brugergrænsefladedesignet løfter brandingen og positionerer kunden som en innovativ aktør inden for benzinhandel.

Vores UX-designbureau leverede den manglende ekspertise inden for brugeroplevelsesdesign til skabelsen af hele rækken af digitale produkter. For at levere en komplet service rejste vi til Schweiz for at udføre brugerundersøgelser og forstå den unikke kontekst.

RESULTATER

Komplet dækning af kundeoplevelsen

UX/UI til 5 applikationer leveret på 10 måneder

Support til udviklere i realtid under implementeringen