SL:s nya webb

Vad jag gjort

Jag drev arbetet genom hela produktutvecklingen med ett hypotesbaserat och användarcentrerat angreppssätt. För att förstå hur människor faktiskt använde tjänsten kartlade vi beteenden och behov genom intervjuer, workshops och användartester, både ute i verklig trafikmiljö och i mer kontrollerade testsituationer. En viktig del av min roll var att omvandla insikterna till konkreta och testbara koncept och prototyper som kunde valideras och vidareutvecklas. Jag var också med och byggde upp ett skalbart designsystem som skapade förutsättningar för konsekvent och effektiv implementation i nära samarbete med utvecklingsteamet. Tillgänglighet enligt WCAG behandlades som en grundläggande designparameter och integrerades i det övergripande systemtänkandet, snarare än som en separat kontrollpunkt i slutet av processen.

Kund

Länkar

Visa nya sl.se

Designarbetet

Designarbetet utfördes i 2-3 veckors designsprintar. I varje sprint ingick designworkshop kring ett givet tema med deltagare från SL och utvecklarteam. Användarinsikter samlades in i så gott som varje sprint. Nedan listas några av de användarcentrerade metoder som ingått i designarbetet.

Kundresor

I projektets start skapade vi ett antal kundresor för att beskriva olika resenärstypers upplevelser. Dessa vara baserade på personas som SL skapat sedan tidigare, samt på djupintervjuer och användartest kring den tidigare SL-sajten, reseappar och resevanor. Kundresorna levandegjorde jag genom tecknade storyboards och de fungerade som ett sätt att behålla fokus påresenären under projektets gång.

Alternativa lösningar

Oftast designade vi flera lösningar på olika designproblem. Detta för att inte låsa oss till våra egna idéer. Vi visade, diskuterade och testade alternativen med användare och kunde på så sätt fördjupa insikten om vilken design som verkar vara på rätt väg.

Användningstest

Under designarbetet har hundratals användarinsikter samlats in. Användartest har varit ett sätt att samla insikter. Vi utförde användartest i SL-trafiken med hjälp av prototyper som fungerade i mobilen. Andra test gjordes på datorn i kontoret under mer kontrollerade former.

Användartest utfördes i trafiken med mobilprototyper eller på kontoret med dator- och mobilprototyper.

Kvantitativa metoder

Vi använde också kvantitativa metoder för att analysera designhypoteser. Exempel på detta är experiment där vi jämförde olika designhypoteser i trafiken, genom att låta resenärerna lösa uppgifter i mobilen. Olika grupper fick använda olika designer. Det gick relativt fort att få in svar och vi kunde uttala oss om huruvida en design var signifikant bättre på givna punkter. I bilden nedan handlade det om svarshastighet på ljus- jämfört med mörk grafisk design. Vi använde också andra kvantitativa metoder såsom kortsortering med faktoranalys och trädtest.

Experiment som jämförde svarshastighet på ljus- och mörk grafisk design.

Struktur - kortsortering och faktoranalys

Hur webbsidan strukturerades var baserat på användares mentala modeller, vilka vi fick inblick i genom så kallad kortsortering. En mängd användare fick samla resebegrepp i grupper på det sätt de ansåg dem höra hemma. Faktoranalys är ett sätt att finna återkommande generella grupper, som kan lämpa sig att använda i exempelvis en huvudnavigation.

Kortsortering och faktoranalys var ett bra sätt att få insikt i resenärers mentala modeller.

Struktur - trädtest

Trädtest var ett sätt att jämföra alternativa hypoteser på struktur. Vi testade fyra varianter på huvudnavigation och kunde finna den som gick både snabbast att hitta i och som innebar minst felnavigation.

Analys av hur användare navigerade i två olika strukturer, här var alternativ 2 både snabbare och innebar mindre felnavigation.

Designsystem

Ett designsystem och styleguide skapades i Sketch. Detta underlättade för att göra UI designen konsekvent.

Tillgänglighet

Tillgänglighet var en viktig del av designarbetet. Vi tillämpade WCAG nivå 2 och gjorde tillgänglighetstester i samarbete med Synskadades Riksförbund.