960% ökad användning av Systembolagets app

Sveriges statliga alkoholmonopol. År 2021 hade appen vuxit ur sitt ursprungliga syfte, glidit ifrån webbplatsen, belamrats med funktioner ingen använde och skavde i varje viktigt flöde.

960% ökad användning av Systembolagets app

Appen hade byggts ut av olika team genom åren, vart och ett med beslut fattade isolerat från de andra. Resultatet blev en produkt som kändes avskild från webbplatsen, full av funktioner ingen använde och som gjorde de vanligaste uppgifterna krångligare än de behövde vara.

Jag satte designriktningen från dag ett: få appen i linje med webbplattformen, skära bort det som inte bar sin egen vikt och bygga om kärnflödena utifrån hur kunderna faktiskt använde produkten. Det innebar att leda discovery-arbetet, lägga upp researchen, äga prioriteringsramverket och stå för kvaliteten hela vägen fram till lansering.

Projektmål

Samordna plattformarna

Skapa visuell och funktionell paritet mellan appen och Systembolaget.se. Att växla mellan dem ska kännas sömlöst, inte som att byta produkt.

Fixa kärnflödena

Designa om butiksval, produktupptäckt och hanteringen av inköpslistor, de tre flöden som kunderna använde mest, och var mest frustrerade över.

Få upp användningen

Förvandla en produkt som folk stod ut med till en de sökte sig till. Och mäta skillnaden.

Så ledde jag arbetet

Data före åsikter

Jag började med en kvantitativ analys av den befintliga appen: användningsgrad, avhopp per skärm och hur funktionerna faktiskt användes. Det gav en rangordnad karta över felpunkterna redan innan en enda researchsession var bokad, och konkreta bevis för att utmana interna antaganden. Flera funktioner som teamet ville skydda hade i praktiken noll användning. De skars bort.

Ett researchprogram med flera metoder

Jag lade upp researchen: en heuristisk utvärdering av varje viktigt flöde, intervjuer med kundtjänstpersonal som såg de återkommande problemen på nära håll, och användarenkäter som vi stämde av mot kvantitativa data. Varje metod bar sin plats. Den heuristiska genomgången blottlade strukturella problem, kundtjänstintervjuerna fångade den känslomässiga friktionen och enkäterna bekräftade båda i stor skala.

Interaktionslogiken låst före visuell design

Jag wireframade och användartestade varje större flödesförändring innan något high fidelity-arbete drog igång. Den disciplinen tog bort en hel kategori av sena omtag och lät den visuella designfasen röra sig i en helt annan takt.

Prioritering som ett designansvar

Med över 20 identifierade problem spelade ordningsföljden lika stor roll som själva lösningarna. Jag byggde ett poängramverk utifrån användarnytta och implementeringskostnad och använde det för att sätta leveransordningen. Vad som hamnade i sprint ett snarare än sprint fyra var ett designbeslut, och ett viktigt sådant.

Vad användarna faktiskt behövde

Research från intervjuer, data från kundtjänstens kanaler och enkäter pekade alla mot samma fem återkommande uppgifter som kunderna försökte lösa, inga som den befintliga appen klarade särskilt bra.

Kolla sortimentet i närmaste butik

Se vilka produkter som finns i en viss butik innan man åker dit.

Hitta produkter och kolla tillgänglighet

Söka på namn, typ eller ursprung och bekräfta lagersaldo i rätt butik.

Hitta produkter i butiken

Veta vilken hylla en produkt står i, inte bara att butiken har den.

Skapa och hantera inköpslistor

Bygga listor i appen och hålla dem synkade med webbplatsen.

Spara och betygsätta favoriter

Hålla koll på produkterna de gillar och dela med sig via betyg.

Vad researchen avslöjade

Listor synkades inte

Inköpslistor som skapades i appen fördes aldrig över till webbplatsen. För kunder som planerade på flera enheter var funktionen i praktiken trasig.

För många steg för att spara en produkt

Att lägga en produkt i en lista krävde att man klickade sig genom tre separata vyer. Friktionen var så hög att de flesta hade slutat försöka.

Visuellt i otakt med webben

Appen och Systembolaget.se hade glidit ifrån varandra i färg, typografi och komponentmönster. Att växla mellan dem kändes som att använda en produkt från ett helt annat företag.

Funktionsröra

Navigeringen rymde flera funktioner som nästan ingen använde. Bruset gjorde de faktiskt användbara funktionerna svårare att hitta.

Butiksvalet var trasigt

Kunder som handlade i en viss butik fick välja den på nytt om och om igen. Sättet att spara en favoritbutik var undangömt och otydligt.

Produktupptäckt saknade logik

Sök och kategorinavigering matchade inte hur kunderna faktiskt tänker när de letar efter en dryck. Filtren låg dolda och var svåra att använda.

Betyg gömda bakom en gest

Produktbetyg, en av de mest betrodda köpsignalerna, gick bara att nå via en svepning som nästan ingen upptäckte.

UX-flödesdiagram som kartlägger flödena för sök, streckkodsskanning och produktupptäckt över flera appskärmar, använda för att validera interaktionsmönster innan high fidelity-designen.
Flöde för att skapa inköpslista: sekvens över fem skärmar som visar navigering till Mina listor, att skapa en ny lista, namnge den och spara. Omdesignat för att minska antalet steg.
Flöde för att hantera inköpslistor: sekvens över fem skärmar som visar listöversikt, att bläddra bland produkter i en lista samt alternativ för att byta namn och redigera. Ombyggt för att matcha webbplattformens beteende.

Vad jag levererade

Synkade inköpslistor

Jag gjorde om listarkitekturen så att tillståndet synkas mellan app och webb i realtid. För första gången blev listorna tillförlitliga mellan enheter.

Enklare att lägga till i lista

Jag kokade ner det till en enda synlig knapp på produktsidan. Användningen steg markant efter lanseringen.

Enhetligt visuellt språk

Jag förde appen i linje med Systembolaget.se i färg, typografi och komponentmönster, och dokumenterade besluten som en gemensam referens för båda plattformarna.

Rensad navigering

Jag granskade varje punkt i navigeringen mot användningsdata och skar bort dem som inte bar sin vikt. Färre val gjorde de rätta lättare att hitta.

Omdesignat butiksval

Jag byggde om butiksflödet kring sök och en kartvy först. Kunderna kunde hitta och byta butik med två tryck i stället för sex.

Ombyggd produktupptäckt

Jag strukturerade om sök, filter och kategorinavigering utifrån de mentala modeller vi såg i researchen. Att hitta en specifik produkt, eller utforska en kategori, gick från ogenomträngligt till omedelbart.

Synliga betyg

Jag flyttade produktbetygen från en dold svepning till en fast plats på produktsidan. Användningen av betyg sköt i höjden direkt efter lanseringen.

Flöden för butiksval och filtrering som visar hur användarna hittar och byter sin favoritbutik hos Systembolaget, inklusive kartvy, butiksvy och kategorifiltrering.
Översikt över fyra skärmar av den omdesignade Systembolaget-appen: startsida med sök och kategorier, filtrerad lista för att bläddra bland vin, produktsida för en ekologisk produkt och kartvy för butikssök.

Att föra in design i produktbesluten

Delade backloggen med PO:n

Att jobba med produktägaren kring prioriteringarna i backloggen gjorde att designperspektivet fanns i rummet när scope och ordningsföljd avgjordes. Kraven formades tillsammans i stället för att lämnas över.

Designdiskussionerna flyttades tidigare

När avvägningar mellan scope, tid och kvalitet dök upp hade teamet designinput redan från början. Det tog bort en vanlig källa till sena omtag och gjorde att teknik och design löste samma problem.

Resultatet hamnade närmare tanken

Problemen kom upp till ytan innan de blev dyra. Färre beslut behövde omförhandlas under implementeringen. Teamet levererade något som matchade det vi hade planerat att leverera.

Resultat

+960%

Ökad användning efter lanseringen: från nära nog inget engagemang till en produkt folk aktivt öppnade.

+400,000

Aktiva användare i månaden. Varje mål i briefen nåddes och validerades genom användartester.

Ny standard

Redesignen satte kvalitetsribban för allt digitalt arbete som följde, på hela Systembolagets plattform.

Nästa case
Nästa steg

Jag tar mig an ett eller två uppdrag i taget

Jag jobbar inne i ditt team, och resultatet äger vi tillsammans. Skalar du en digital produkt som rör sig långsammare än din ambition, boka ett samtal.