Molslinjen on-the-go

Hvad nu hvis man kunne reservere en færgebillet nemt og hurtigt i bilen? Hvad nu hvis man kunne bruge Molslinjens mobil app på Apple CarPlay i bilen?

Med en minimal brugerrejse, hensyntagen til en helt anden brugerkontekst, og stik imod den gode forretning om mersalg, så vil Apple CarPlay app’en sørge for at brugeren kan reservere en færgebillet og intet andet. Bilisten skal køre bil, når bilisten kører bil.

Case Study: Designforslag af Molslinjens mobil app på Apple CarPlay.

Fokus punkter: UX & UI design.

Platform: Apple CarPlay.

Værktøjer: Figma, Illustrator, Photoshop.

Designprocessens faser

Research

Hvad er CarPlay app’ens formål?

CarPlay Molslinjen app’en skal lade brugeren reservere billet til den næste mulige afgang let og hurtigt. På en simpel måde skal brugeren kunne se, om vedkommende kan nå at køre mod færgelejet, og hvad en færgebillet koster.

I studiet fravælges mange funktioner fra mobil app’en for at begrænse brugerens interaktion med CarPlay app’en, da bilisten først og fremmest skal koncentrere sig om vejen.

Hvem er brugerne?

I studiet antager jeg, at brugerne benytter sig af Molslinjen ofte. De har faste passager-profiler, anhænger, biler m.m. registreret i mobil app’en. Måske de har et arbejdsliv, hvor de både arbejder i Jylland og København, og derfor rejser meget. Måske de ikke altid ved om de kan nå den næste færge eller om de skal køre over broen for at komme hjem hurtigst muligt. Måske de er kommet lidt sent ud fra et møde, og må tjekke op hurtigt, om de kan nå den næste færge.

Det er i hvert fald en gruppe brugere, som ikke har alt planlagt, og som godt vil tage en hurtig beslutning.

For neden har jeg udviklet proto-personaer, som er udviklet på baggrund af egne antagelser og erfaringer. De er derfor ikke baseret på nye undersøgelser. Ikke desto mindre er det et nyttigt værktøj til til at kickstarte produktudviklingen med begrænsede ressourcer.

Proto-personaer

User Journey Mapping af eksisterende app

Molslinjens mobile app er karakteriseret af mange trin, med mange tilvalg både til køretøj og mad og drikke. Derudover er der funktioner, hvor man kan registrere biler og nye passagere. Grundet EU lovgivning, er det essentielt med mange informationer om hver passager.

Fra startside til brugeren kan se en billet, skal man igennem 8 trin.

Definering

Ny User Journey Flow

Fra 8 til 6 trin

Her blev der arbejdet med at konkretisere primære og sekundære funktioner, i forhold til en billetreservations-situation i Apple CarPlay. Hvad der før i mobil app var need-to-have, er ikke det samme i Apple CarPlay. 

Forskellen på mobil og CarPlay app

Apple CarPlay app’en skal ikke kunne det samme som mobil app’en, da det er to forskellige kontekster. 

Jeg ser mobil app’en i en kontekst, hvor kunden er i en planlægningsfase. Her kan brugeren få så meget information som muligt.

I en anden kontekst, hvor brugeren allerede sidder i bilen på vej til færgen, eller skal til at køre, der skal de bare have den næste mulige færgeafgang og tage en hurtig beslutning om man kan nå den eller ej.

Diagram over forretningens mål med app vs Apple CarPlay
Diagram over brugerens mål med app vs Apple CarPlay

Hvad skal bevares fra den eksisterende app?

Ved at holde den nye brugerejse op mod den eksisterende app, kan der tages valg omkring hvilke funktioner og informationer, der skal med videre.

Koncept-udvikling

Indledende håndskitser

Konceptudviklingen startede med en langt række håndskitser sideløbende med hurtige figma skitser. Blyant og papir giver mig oftest en hurtig start på konceptudviklingen.

Lo-Fi digitale skitser

Første grove digitale skitse, hvor der bliver arbejdet med lidt forskellige koncepter. Jeg bruger også her en hurtig collage teknik, hvor jeg klipper eksisterende elementer direkte ind i skitsen.

Visuelt udtryk - Designkoncept til ældre skærme

Apple CarPlay har været på markedet siden 2014 og det betyder, at i de biler der kører på vejene, vil nogen have touch-skærme af ældre dato.

Derfor vælger jeg i dette projekt, at gå med designkoncepter, som arbejder med få farver og stærke kontraster. Jeg benytter mig ikke af de mange mellemtoner og de mange grå og blå nuancer i den eksisterende app, da jeg gerne vil øge læsbarheden, så bilisten hurtigst muligt kan koncentere sig om vejen, selv på en mindre og ældre skærm.

Derudover vil knapdesigns og tekststørrelse være store for netop at gøre disse brugbare på ældre skærme.

Hi-Fi wireframes

Herfra arbejdes der med at få det visuelle udtryk til at ligne den eksisterende Molslinjen app, samtidig med at integrere designet i det brugsmønster Apple CarPlay har.

UX Writing

I den eksisterende app står der: Hvis du kører nu kan du være ved Molslinjen i Aarhus kl. 11:43.
I studiet søger jeg at finde en løsning, hvor mellemregningen er udregnet for brugeren. I stedet for at fortælle, hvornår man ankommer til færgelejet, så får brugeren at vide, hvornår de ankommer i forhold til færgeafgangen, som for eksempel kunne være: Du ankommer 24 min før afgang.

Design-udvikling

UI design koncepter

Eksisterende farver

Kortlægning af eksisterende farver i den grafiske identitet.

Farveblindhed og UI

Ifølge sundhed.dk så rammer farveblindhed 5-8% af alle mænd, men under 1 % af alle kvinder. I forhold til en Apple CarPlay App, hvor brugergruppen er bred på tværs af alder og køn, bør farvevalget tage hensyn i så høj grad det er muligt. 

Simplere valg af passagere

Jeg reducerer, hvor meget brugeren skal scrolle op og ned. Igen er det ud fra antagelsen, at det her er en bruger, som tager færgen ofte og har passagere indtaste i sin mobil app.

Apple CarPlay app’en skal opfordre til at bruge mobil app’en i stedet til at oprette nye passagere.

Forslag til en anden designløsning der reducere behovet for at scrolle.

Endeligt Design

Reserver billet flow

Det endelig design endte med den mørkeblå baggrund som base og lyse elementer.

Færdig mock-up sat op som wireframe.

Evaluering

Opsummering

Projektet har været et designstudie, i hvordan Apple CarPlay fungerer, og især et studie i hvordan man reducerer funktioner, således at bilisten ikke er distraheret fra at køre bil.

På trods af det sædvanlige mersalg, man ser i mobil app’en, så får man måske her en mulighed for at tage fat i en brugergruppe, der bare gerne vil hurtigst muligt frem til deres destination, og hvor fart og komfort prioriteres over pris.

Udfordringer under designprocessen

Det blev tydeligt tidligt i processen, at den største udfordring blev at reducere trinene i brugerrejsen nok. For jo flere trin man prøver at reducere, jo mere information er man nød til at klemme ind på hver side, hvilket hurtig bliver for meget information.

I konteksten af, at visse skærme på eksisterende biler på vejene er af ældre dato, har det været en udfordring at arbejde med høje kontraster. Designtrendsene i dag peger mere på flere mellemtoner og lavere kontraster og dermed '“venligere” design, mens det var mere oplagt i dette studie at gå mod strømmen og arbejde med tydeligere farvekontraster og større elementer og tekststørrelser, for at øge læsbarheden på afstand. .

Den sidste udfordring har været at produktet her er nyt. I mobil app’en køber du altid billetten, mens du i bilen blot reserverer en billet. Det har været en udfordring at tydeliggøre, at man skal købe billetten og eventuelle tillæg ved ankomst til færgelejet.

Opsummering af udfordringerne:

  • at forkorte brugerrejsen, for mere sikker bilkørsel

  • at reducere brugen af farver og nuancer for at øge kontrasten.

  • at arbejde med et nyt “produkt”, som en reservationsbillet

Læringspunkter

Jeg er blevet klogere på at arbejde med en anden slags platform og kontekst som Apple CarPlay er. Her skal jeg sikre mig at distrahere bilisten så lidt som muligt, ved at forkorte brugerrejsen så meget som muligt.

Derudover er jeg blevet lidt skarpere på farver, kontraster og udfordringerne ved farveblindhed.

Opsummering af læringspunkterne:

  • At arbejde Apple CarPlay platformen.

  • At arbejde med farver, .og farveblindhed

Forbedringer

Det kunne være interessant i en brugertest at se, om man kan tillade sige reducere et trin mere i brugerrejsen. Jeg tænker særligt på, om man kan droppe det ene trin, hvor der bliver gjort opmærksom på, at dette blot er en reservation og hvor og hvornår betalingen så sker.

Opsummering af forbedringer.

  • Optimering og reducering af trin i brugerrejsen.

De næste skridt

  • Interaktive protyper

  • Test på en ældre Apple CarPlay skærm

  • en test med brugere, så man kan se hvilke funktioner der er mest brugte, og om nogen helt skal fjernes.

Tak fordi I så med, jeg håber det har givet jer nye indsigter :)

Skal vi tage en uforpligtende snak?

info@xxw.dk
(+45) 42425074