Omdesign av EasyParks mobilapp för en bättre parkeringsupplevelse

Uppdrag

Förbättra parkeringsupplevelsen för svenska bilister genom att omdesigna EasyParks mobilapp för parkering.

Tidsram: Tre veckor (2022).

Team: Amin Amini, Emma Bergström, Felicia Holmlund, Michael Bengtsson, Patryk Chodowiec, Petter Byrstedt och Sabina Kasper.

Mina arbetsuppgifter som UX-designer

  • Business Model Canvas
  • User research
  • Användarintervjuer
  • Wireframes
  • Prototypframställning
  • Användbarhetstester

Designprocess

  • Flera intervjuer genomfördes med förare för att bättre förstå deras behov och smärtpunkter.
  • En av flera lösningar som designteamet kom på var en skanner av parkeringsskyltar som gör det möjligt för förare att lätt förstå innebörden av förvirrande parkeringsskyltar.
  • Under flera iterationer av wireframes, prototyper och användartester, lyckades designteamet förbättra den nyutvecklade funktionaliteten men också den befintliga användargränssnittet i EasyParks mobilapp.

Insikter från research

  • Parkering kan vara en frustrerande och stressig upplevelse på grund av faktorer som bristande parkeringsinformation och brist på tid.
  • Det kan vara svårt att förstå vissa kombinationer av parkeringsskyltar. Ibland är informationen på skyltarna otydlig, andra gånger kan tolkningen av en viss skylt vara relevant endast för en specifik plats eller gata.
  • När de är osäkra på om de kan parkera på en viss plats söker intervjuobjekten hjälp genom att googla eller ringa en släkting eller vän.
  • Det finns ofta en del risktagande involverat när man parkerar osäkert om parkeringsreglerna. Även om konsekvenserna kan vara allvarliga i form av höga parkeringsböter så engagerar människor sig i dessa riskabla beteenden på grund av stress och tidsbrist.

Lösning

En Figma-prototyp av EasyPark-appen skapades som möjliggör för förare att skanna svårlästa parkeringsskyltar och även få information om tillgängliga parkeringsplatser över hela Sverige, oavsett parkeringsoperatör.

Screenshot of EasyPark mobile app
Skärmdump på slutgiltig prototyp.

Uppdraget

Detta projekt inleddes med en kollektiv insikt från designteamet: det kan vara orimligt svårt att förstå parkeringsskyltar i Sverige. Obegripliga parkeringsskyltar orsakar inte bara stress och frustration för förare, de kan också leda till tunga böter. Ungefär 1,5 miljoner parkeringsböter utfärdades i Sverige under 2021, vilket resulterade i hela 1 miljard SEK i böter.

Problemställning

Men efter att ha insett att hela parkeringsupplevelsen borde vara fokus för vårt arbete, tog designteamet ett steg tillbaka och beslutade sig för följande problemställning:

Hur kan vi förbättra parkeringsupplevelsen för svenska förare?

Denna helhetsorienterade problembeskrivning gjorde det möjligt för oss att bredare utforska problemområdet i sökandet efter insikter som kan leda till originella lösningar för behov som annars inte möts hos förare.

Research för att förstå behov och utmaningar med parkering

Designteamet genomförde research för att bättre förstå de personliga och samhälleliga aspekterna av parkering i Sverige. Våra nyckelinsikter är:

”Vi insåg att ’parkering’ är ett komplext system som är utformat för att främja inte bara lagligt beteende utan också intäktsströmmar och samhällsplanering av städer och kommuner.”

”Eftersom parkering är komplicerat med många aktörer, aktiviteter och resurser involverade, kan ingen enskild aktör utforma parkeringsupplevelsen för en hel stad, vilket leder till osammanhängande och missnöjda förarupplevelser.”

”För den enskilda föraren kan parkering vara en stressig och potentiellt dyr prövning på grund av komplexa och föränderliga parkeringsregler och risken att få parkeringsböter.”

Det är komplicerat att skapa en AI som kan pålitligt skanna, analysera och tolka parkeringsskyltar. Utmaningarna är både tekniska – t.ex. att använda maskininlärning eller att samla in parkeringsdata för hela Sverige – och juridiska eftersom det finns många gränsfall relaterade till den juridiska tolkningen.

När vi utforskar idén att skapa en lösning som i slutändan kommer att ge juridisk parkeringsrådgivning till förare, måste vad och hur lösningen kommunicerar den juridiska rådgivningen ges stor omtanke. Dåliga eller dåligt kommunicerade råd kan orsaka rättsliga och sociala problem för både föraren (böter), företaget bakom lösningen (dålig PR) och samhället (trafikköer).

Intervjuer med förare

Efter att vi bestämt oss för att ha en mer holistisk problemformulering genomförde vi sju intervjuer med förare, främst bosatta i Stockholm. Vårt mål var att förstå deras beteenden, smärtpunkter, behov, attityder och känslor i relation till parkering.

Insikter från intervjuer

  • Parkering kan vara en frustrerande och stressig upplevelse på grund av faktorer som bristande parkeringsinformation och brist på tid.
  • Det kan vara svårt att förstå vissa kombinationer av parkeringsskyltar. Ibland är informationen på skyltarna otydlig, andra gånger kan tolkningen av en viss skylt vara relevant endast för en specifik plats eller gata.
  • När de är osäkra på om de kan parkera på en viss plats söker intervjuobjekten hjälp genom att googla eller ringa en släkting eller vän.
  • Det finns ofta en del risktagande involverat när man parkerar osäkert om parkeringsreglerna. Även om konsekvenserna kan vara allvarliga i form av höga parkeringsböter så engagerar människor sig i dessa riskabla beteenden på grund av stress och tidsbrist.

En översikt av EasyParks befintliga mobilapp

Eftersom vi beslutade att använda EasyParks mobilapp som grund för allt vårt designarbete kan det vara användbart att kortfattat gå igenom appen.

Första skärmen i EasyPark-appen innehåller parkeringskartan. Det är så föraren hittar en lämplig parkeringsplats, visualiserad som markörer på kartan och kort nedanför kartan.

Tryck på informationsikonen på en parkeringskort och du får grundläggande information om parkeringsplatsen. Denna information är viktig eftersom EasyPark strävar efter att täcka all möjlig parkering i Sverige, inte bara de de själva driver.

Tryck på ”Parkera här” på den tidigare skärmen så hamnar du på parkeringsskärmen där du kan ställa in parkeringsvaraktigheten med hjälp av det rosa rullhjulet och se det motsvarande priset.

Som ett alternativ till rullhjulet kan användaren istället ange parkeringsvaraktigheten genom att välja dag och tid i denna modal som nås genom att trycka på den analoga klockan i det övre vänstra hörnet på föregående skärmbild.

Handritade wireframes

Efter att ha arbetat fram möjliga värdeerbjudanden och kundprofiler skapade designteamet en serie wireframes som skulle fånga kärnan i våra lösningar som en del av EasyPark-appen.

Huvudvyn visar en karta med parkeringsplatser som visas som kort. Korten visar om parkeringsplatserna är avgiftsfria eller inte.

Den befintliga parkeringsvyen har rensats upp och mer detaljerad parkeringsinformation är tillgänglig via parkeringsikonen i det övre vänstra hörnet.

Den detaljerade parkeringsinformationsvyn ger ett tydligt svar på om föraren kan parkera på platsen eller inte.

Det är en möjlig lösning om appen saknar information om den nuvarande parkeringsplatsen att fotografera de närliggande parkeringsskyltarna.

Skyltskannern är tänkt att drivas av en AI tillräckligt intelligent för att identifiera och tolka skyltar i många kombinationer och under många förhållanden.

Ingen AI är ofelbar så föraren behöver verifiera noggrannheten av analysen av parkeringsskyltarna. Om AI-tolkningen är felaktig skulle en möjlig lösning vara att föraren anger den korrekta uppsättningen skyltar.

Digitala wireframes och mockups

Här är bara några av de digitala wireframes och mockups som vi skapade på olika nivåer av noggrannhet för att utforska våra designidéer och förbättra gränssnittet i den befintliga EasyPark-appen. På sikt skulle vi skapa ett mer enhetligt designsystem för att säkerställa konsekvens och kvalitet.

Första prototypen

Den första versionen av prototypen är den vi använde för användartestning med förare. Kör den genom att klicka på knappen nedan:

Prototypen har det minimala mängden av funktioner som vi kunde designa på några få dagar samtidigt som vi säkerställde att de uppfyllde de tidigare identifierade användarbehoven. Dessa funktioner beskrivs nedan.

Kartan på första sidan har designats om för att ha mer informativa och tydliga parkeringsplatskort.
Sidan för en specifik parkeringsplats är mindre rörig, en mer sammanhängande informationsdesign och detaljerad parkeringsinformation längst ned.

En ny typ av sida skapades för parkeringsplatser som är gratis. Vi använde typografi och textförmedling för att framhäva att parkeringen är gratis. Vi gjorde det också möjligt att ställa in en påminnelse innan parkeringen löper ut, eftersom intervjuerna visade att förare använder en tredjepartsapp för att göra det.

En annan ny sida skapades för parkering som helt enkelt inte är tillgänglig av någon anledning. Vi insåg att denna sida riskerade att bli en återvändsgränd för användaren så vi la till möjligheten att visa parkering i närheten.

En stor ny funktion i EasyPark-appen är skannern för parkeringskyltar, tillgänglig genom [P] ikonen på första sidan. Vi skapade en onboarding till skannern, men användningstesterna visade att det egentligen inte behövdes.

Skannern använder välkända designmönster som en kamera med sökare för att skapa en användarvänlig gränssnitt istället för ett som är visuellt inspirerat av AI.

Enkelheten i skannern fortsätter i hur den presenterar att parkeringsskyltarna har skannats framgångsrikt.

Det skulle vara omöjligt att skapa en perfekt AI som kan skanna och tolka parkeringsskyltar med 100% noggrannhet varje gång. Därför beslutade vi att föraren behöver granska resultaten av skanningen som AI:et tolkar det.

Ibland kan föraren behöva korrigera systemets förståelse för parkeringsskyltarna. Den här delen av gränssnittet var ganska utmanande att designa eftersom uppgiften kan bli tidskrävande och ganska komplex, särskilt eftersom föraren kan befinna sig i en bil eller på en iskall parkeringsplats.

Som en sista steg i skannern informeras föraren om de kan parkera på platsen eller inte. Att gå vidare till betalningssidan är ett naturligt steg men föraren kan också se mer detaljerade resultat av skanningen.

Validering av design genom expertutvärderingar och användningstester

För att validera allt från tidiga idéer till interaktiva prototyper, genomförde vi flera rundor av feedbacksessioner med våra klasskamrater på UX-utbildningen på Nackademin. Vi genomförde också användartester med fyra förare genom att använda en prototyp skapad i Figma.

  • En återkoppling betonade vikten av att tydligt visa om parkering var tillåten eller inte på en specifik plats.

    Det är viktigt för användaren att godkänna tolkningen som AI:n har gjort efter att den har analyserat parkeringsskyltar.

  • Parkeringkartan i EasyPark-appen bör vara filtrerbar så att endast specifika parkeringsplatser – handikapparkering, batteriladdning etc. – visas.

  • Det var svårt för vissa att förstå parkeringskartan och var de befann sig i förhållande till parkeringsplatserna på kartan.

  • Ikonen på kartvyn för skannern var otydlig.

  • Förare hade svårt att hitta skannern. Detta kan ha berott på utformningen av ikonen och/eller dess position i sidhuvudet på första sidan.

  • Vissa förare fann informationsdesignen överväldigande när det gällde att veta om parkering var tillåten på en specifik plats.

  • Kartdesignen på första sidan var förvirrande eftersom flera parkeringsplatser visades bland parkeringskorten. Förare ville bara se parkeringsplatsen på sin nuvarande plats.

Lösningen

Efter expertutvärderingarna och användningstesterna så justerades Figma-prototypen. Resultatet kan köras nedan:

Här är en videodemonstration av prototypen:

Löste vi problemet?

Med tanke på det arbete som designteamet har gjort, har vi uppnått vårt mål? Vår problemformulering är:

Hur kan vi förbättra parkeringsupplevelsen för svenska förare?

Den slutliga prototypen är ett försök att besvara problemformuleringen genom att fokusera på väsentliga förändringar i EasyParks mobilapp som identifierats genom vår researtch:

  • En förbättrad parkeringskarta för enklare förståelse.
  • En AI-drivande skanner för att förstå förvirrande parkeringsskyltar.
  • Övergripande förbättringar av informationsdesignen.

Framtida arbete

Här är några nyckelområden som designteamet kan fortsätta arbeta på i framtiden när de arbetar med EasyPark appen.
Illustration of a judge holding a gavel

Designteamet behöver bättre förstå konsekvenserna av att ge juridiska råd till förare, särskilt de som använder skannern. Följderna av att ge felaktiga parkeringsråd kan få allvarliga konsekvenser för den enskilde föraren, exempelvis att få en parkeringsbot eller få bilen bogserad. Vilket rättsligt och etiskt ansvar skulle EasyPark ha när dess app används?

Förbättra användargränssnittet för parkeringsskyltsskannern. Detta är en komplex funktion där förarna behöver förstå och potentiellt korrigera appens analys av parkeringsskyltar. Design-teamet bör till exempel testa korrigeringen av parkeringsskyltar mer ingående.

En av de svåraste designutmaningarna är att hitta balansen mellan att ge enkel parkeringsinformation och se till att förare förstår tillförlitligheten och begränsningarna hos systemet, särskilt AI som körs i skyltskannern.

”Designen av kartvyn behöver fortsatt arbete, möjligen mer användarforskning för att förstå exakt vad som ska visas på kartan och parkeringsutrymmena under kartan.”

Designen och positionen av ikonen för skyltskannern behöver testas med användare. Detta är en viktig funktion och det finns en brist på bästa praxis att förlita sig på.

”På nedre delen av sidan för parkeringsplatser använde vi en svepbar UI-komponent för att visa mer detaljerad parkeringsinformation. Denna design behöver utvärderas vidare eftersom tidiga tester visade att förare hade svårt att märka den. Våra försök att skapa starkare signifiers kanske inte räcker till.

Demo of inconsistent page transitions in the prototype.
🎥 Tryck bild för animering

Rörelsedesignen hos prototypen behöver vara mer konsekvent, särskilt när det gäller sidövergångar som för närvarande varierar i riktning och hastighet. Att följa Android och iOS bästa praxis vore en bra början.

Lärdomar

Designteamet åstadkom mycket på bara tre veckor: Inte bara täckte vi hela designprocessen från användarundersökning till en fungerande prototyp, vi lyckades också arbeta med iterationer som bara varade några dagar och alltid avslutades med feedbacksessioner eller användartester. Detta är en påminnelse om att frekventa användartester är möjliga och nödvändiga.

Illustration of two people engaging in user testing
Illustration of three people standing close to each other

Som alltid är det en logistisk utmaning att hitta deltagare för användartester. Att använda vänner och familj som deltagare, som vi gjorde, är oändligt mycket bättre än inga användartester alls.

”Vi samarbetade inte med EasyPark under projektet. Att ha tillgång till deras kunskap skulle sannolikt ha accelererat vår forskning och gjort den mer robust.”

Illustration of three people working together in a office
Illustration of a design system

”Det är förvånansvärt hur mycket friktion som skapas när det inte finns ett designsystem att använda i Figma. Designteamet spenderade timmar på att arbeta med wireframes och prototyper som varierade kraftigt i designen enbart på grund av detta, arbete som senare var tvungen att göras om för att säkerställa en enhetlig design.”

  • Inläggskategori:Portfolio