UX-design och UI-design är inte samma sak

Det är fortfarande inte helt ovanligt att folk blandar ihop UI med UX, det är inte heller förvånande. Både UX och UI har en stor påverkan på hur en produkt uppfattas visuellt, men de har helt olika funktioner i produktutvecklingen. I denna artikel kommer vi förtydliga hur de kompletterar varandra.

Eftersom en produkt inte kan ha UX utan UI och tvärt om så behöver dessa två professioner jobba tillsammans för att kunna uppnå en älskvärd produkt.

User Experience design (UX)

Kort och gott handlar UX (användarupplevelse) om att skapa den totala upplevelsen av en produkt. Ett bra UX-arbete resulterar i en bra grund där man löser de behov som finns för användaren. Det skapar även en skiss som User Interfacet bygger vidare på för att bli så bra som möjligt. Vill du veta mer om User Experience kan du läsa om det här.

User Interface design (UI)

UI är en förkortning för User Interface (användargränssnitt) och handlar inte bara om vilken känsla eller vilka intryck ett gränssnitt ger användaren. Utan även hur den kan guida och hjälpa användaren genom intuitiv design. UI-design är gränssnitt för interaktion med maskiner och system och är en starkt bidragande faktor i hur en produkt upplevs genom att fokusera på typsnitt, bilder, färger, former, knappar och animationer – med andra ord, samtliga grafiska element.

Jämförelse mellan UX och UI professionernaJämförelse mellan UX- och UI-professionerna

Med UX så kommer vi fram till vad, varför och hur vi ska skapa en produkt utifrån problemlösning och användarnas behov. För att undersökningarna, skisserna och grundarbetet ska få bästa möjliga effekt så ansvarar UI-designern för att förmedla detta på ett intuitivt sätt genom det gränssnittet som är bäst lämpad för produktens ändamål.

Hur jobbar UX och UI tillsammans?

Eftersom en produkt inte kan ha UX utan UI och tvärt om så behöver dessa två professioner jobba tillsammans för att kunna uppnå en älskvärd produkt.

En produkt som ser fantastisk ut, men är svår att använda har bra UI men dålig UX. En annan produkt som fungerar väldigt bra, men uppfattas svårtolkad har bra UX men svag UI. I båda fallen så har den svagaste länken i en produkt negativt inflytande på upplevelsen samt varumärket.

Det som gör ett bra UX och UI-arbete är när användarna använder en produkt och inte ens tänker på att det fungerar bra. När det bara fungerar och användaren kommer igenom produkten eller tjänsten problemfritt. Det är inte alltid man får beröm, men så länge det inte kommer negativa tankar eller känslor, så har målet blivit uppnått.

Kortfattad förklaring på processen:
UX-arbetet börjar med att göra användarundersökningar för att hitta problemområden och mappar ut hela användarresan som följs av skisser på en ny lösning. I till exempel en mobil-applikation lägger UX-arbetet grunden för bland annat prestanda, informationsarkitektur, navigeringsmönster, feedback och innehåll för att applikationen ska uppfylla de behoven som användaren har. Här har vi alltså full fokus på användarnyttan för den tilltänkta målgruppen, där vi bryter ner alla delar av produktens kvalitet.

Därav tar UI-arbetet över och ser på de grafiska elementen och skapar ett intuitivt gränssnitt i pixel-perfekt design med expertisen på storlek och mellanrum för knappar, bilder, text osv. Även ser över färgval och animationer som ska hjälpa användarens olika behov samt göra produkten estetiskt tilltalande. Här ordnar man även så att innehållet blir anpassat efter skärmens olika storlekar. Man tappar givetvis inte bort användaren här heller, den fortsätter vara lika viktig genom hela arbetet. Det är inte heller sällan en UI-designer behöver förhålla sig till ett företags grafiska profil i den skapande lösningen, vilket kan ge en extra komplexitet och kräva estetisk finkänslighet.

illustration skillnad mellan UI och UI
Under processens gång så testas produkten innan lansering för att undersöka att produktutvecklingen går åt rätt håll och att de problem UX hittat har blivit lösta. Produkten uppdateras och ändras för varje test baserat på responsen från användarna. Här kommer det täta samarbetet mellan UX och UI in, att layouten och gränssnittet utvecklas med fokus på användarnas behov, baserat på både strukturerat innehåll och visuell design.

Även om dessa två områden är olika professioner som kräver sin expertis, så kan det mycket väl vara så att det är en och samma person som gör både UX och UI arbetet. Vi ska inte blanda ihop profession och expertis med personer.

För att gå hela vägen till produktion så kommer nästa profession med i bilden och det är utvecklaren (som i sig grenar ut sig i flera spetsområden), som skriver kod och gör att produkten kommer till liv. Här är det både UX och UI som kommunicerar med utvecklaren för att ständigt hålla en utmanande och realistisk målbild över slutresultatet.


Exempel
I en mobil-applikation så finns det olika grafiska element som ska beskriva vilket innehåll vi hittar bakom dem. En meny kan se ut på olika sätt, hur menyknappen är designad ger en beskrivning på hur den kommer att synas efter att användaren har tryckt på knappen. Består menyn av tre små streck horisontellt under varandra så får jag upp en lista. Är det nio små punkter i tre rader under varandra, så kommer jag nog få upp en meny med små ikoner eller bilder. Dessa har lite humoristiskt fått smeknamn efter olika maträtter som kan finnas på ”menyn”.

digitala menyer

Det är UI-designern som bestämmer vilken meny som passar sig bäst efter innehållet som UX-designern har placerat där. Även hur den ska framträda efter knapp- eller fingertrycket. Om den ska växa fram, komma in från sidan av skärmen eller rullas ner. Hur snabbt det ska gå måste också bestämmas. Detta är väsentliga aspekter att ha i åtanke för UI-designern för att det ska upplevas naturligt och igenkännande för användaren.

Sammanfattning

Skillnaderna mellan dessa två professioner är lite grovt jämfört med funktion och estetik. Båda krävs för att en produkt ska uppnå det vi behöver så att helhetsupplevelsen blir så bra som möjligt i längden. De introduceras i olika delar av projektprocessen men är sammanlänkade hela tiden under utvecklingen för att leverera en älskvärd produkt.




QA-session om UX

Den 16 november sitter jag och Deni Aganovic och svarar på frågor om hur du skapar rätt förutsättningar för ett bra UX-arbete, samt hur du arbetar med det i hela organisationen.
Anmäl dig via länken nedan. 
Q&A - session UX

Alla blogginlägg

Vi rekommenderar också