UX eller UI – vad är skillnaden?

UX och UI nämns nästan alltid i samma andetag, och blandas därför lätt ihop. Men de betyder olika saker, och skillnaden är inte akademisk – den avgör vad du faktiskt beställer när du köper design. Här är vad de står för och varför det spelar roll för din plånbok.

Två olika saker som ofta förväxlas

UX står för user experience, alltså användarupplevelsen. Det handlar om helheten: att rätt funktioner finns, att de ligger där man förväntar sig, att flödet från start till mål är logiskt och att produkten faktiskt löser användarens problem. UX är osynligt när det är bra – man märker det först när något känns krångligt.

UI står för user interface, det visuella gränssnittet. Det är allt du ser och rör vid: färger, typografi, knappar, ikoner, avstånd och animationer. UI är det som ger produkten dess utseende och känsla, det första man lägger märke till.

Enklast blir skillnaden med en liknelse. Tänk dig ett hus: UX är planlösningen – att köket ligger nära matplatsen, att man inte måste gå genom sovrummet för att nå badrummet. UI är inredningen – färgerna på väggarna, materialen, ljussättningen. Ett vackert inrett hus med en vansinnig planlösning är fortfarande obekvämt att bo i.

Samma funktion, olika utfall

Det tydligaste sättet att förstå skillnaden är att se hur samma funktion kan lyckas eller misslyckas på var sitt håll.

Bra UX men dålig UI: en bokningsfunktion där stegen är logiska och du snabbt kommer till målet, men allt ser grått, daterat och billigt ut. Det fungerar, men känns inte förtroendeingivande. Du bokar, men med en känsla av att tjänsten inte riktigt håller måttet.

Dålig UX men snygg UI: en påkostad, vacker app där du ändå inte hittar hur du avbokar. Knapparna är eleganta, typografin proffsig – men flödet är förvirrande och du ger till slut upp. Ytan är perfekt, upplevelsen ett misslyckande.

Poängen är att de kan brista oberoende av varandra. Det är just därför man behandlar dem som två skilda discipliner: en snygg produkt är inte automatiskt användbar, och en användbar produkt är inte automatiskt snygg.

Hur rollerna samspelar i teamet

I ett projektteam arbetar UX och UI tätt ihop men svarar på olika frågor, och ofta i en viss ordning.

• UX-arbetet kommer först: researchen, flödena, strukturen och de tidiga skisserna som avgör vad som ska finnas och var.
• UI-arbetet bygger vidare på det: den visuella formgivningen som avgör hur det ska se ut och kännas.
• Utvecklingen tar sedan vid och gör designen till en fungerande produkt.

I mindre projekt bär ofta samma person båda hattarna. I större delas rollerna upp på specialister, ibland kompletterade med research och motion design. Det avgörande är inte hur många titlar som är inblandade, utan att båda perspektiven finns med. Saknas UX-tänket blir det snyggt men obrukbart; saknas UI-tänket blir det logiskt men oinbjudande.

Varför ordningen avgör vad du får för pengarna

Den praktiska slutsatsen för dig som beställare handlar om ordningsföljd. UX ska komma före UI, och skälet är rent ekonomiskt.

Att lägga UI-design på ett flöde som inte är genomtänkt är att polera något som kan behöva rivas. Ett konkret exempel: ett bolag beställer en vacker, färdig visuell design av sin köpprocess. När produkten sedan testas visar det sig att själva flödet är fel tänkt – användarna kommer inte rätt. Nu måste flödet göras om, och därmed måste den påkostade UI-designen ritas om också. Pengarna som lades på ytan innan strukturen satt är i praktiken bortkastade.

Hade ordningen varit den omvända – reda ut och testa flödet först, forma det visuellt sedan – hade UI-arbetet gjorts en gång i stället för två. Struktur före yta är därför inte en smaksak utan ett sätt att inte betala för samma sak flera gånger. Vill du reda ut vad ditt projekt faktiskt behöver, ingår både UX och UI i våra tjänster. Hör av dig så tittar vi på var tyngdpunkten bör ligga.