Vad är egentligen UX & UI design och vad innebär det?

UX-design

UX-design är i grunden en förkortning av “User Experience Design”, vilket är precis vad det låter som – design baserad på användarupplevelsen. Man har alltid användaren i fokus när man jobbar med UX-design. Ett annat begrepp som används när man pratar om UX-design är interaktionsdesign.

Enkelt förklarat skulle vi kunna säga att UX-design handlar om funktionerna på exempelvis en webbsida eller i en applikation och hur hela webbsidan eller applikationen ska vara uppbyggd strukturmässigt med olika typer av element – med en utgångspunkt ifrån användarna och deras upplevelse. Man skulle kunna likna UX-design med ett skelett – den visar uppbyggnaden och funktionerna från grunden. Det visuella och det som fyller ut skelettet kommer vid ett senare steg – även kallat UI-design.

För att du ska få en förståelse för vad UX-design innebär kommer här tre exempel på vad det skulle kunna vara på en webbsida eller i en applikation:

Vilken grid (layout) webbsidan eller applikationen ska ha.
Var en specifik knapp ska placeras på en sida baserad på funktionen
Vilken typ av meny det ska vara och var den ska vara placerad

UX-design levereras ofta som skisser i form av wireframes – skelettet för hur webbsidan eller applikationen är uppbyggd.

Varför är UX-design viktigt?

Att arbeta med UX-design på en webbsida eller i en app är viktigt för att optimera användarupplevelsen. Rent generellt är målet med en webbsida/applikation att besökarna ska stanna kvar så länge som möjligt och även komma tillbaka – därför är det av vikt att ha ett användarperspektiv när man bygger en webbsida eller applikation.

Det som skiljer bra mot dålig UX-design när det kommer till webbsida eller applikation är helt enkelt baserat på besökarens upplevelse. Om besökaren inte upplever någon frustration eller negativ känsla – då är det en bra UX–design. Det är också bra att ha i åtanke att en webbsida eller applikation med bra UX-design sällan får beröm – det är alltid enklare att ge kritik.

Att anpassa webbplatsen efter sina användare kan vara avgörande. Baserat på en studie från Banyard Institute ser vi att 27 % av alla online shoppare (US) övergav en beställning då utcheckningsprocessen var för komplicerad. Vi ser också att 35 % lämnade sin kundkorg när de behövde skapa ett konto för att fortsätta till utcheckningen. (Källa: Amazon Web Services). Därför är det också viktigt att komplettera UX-design med användartester. För något som låter och ser bra ut i teorin, kanske inte funkar i praktiken. Det är som sagt användarna vi ska utgå ifrån – så att komplettera med användartester i detta steg är mer lönsamt i längden.

UI-design

UI-design är i grunden en förkortning för “User Interface design” även kallat för användargränssnitt. Enkelt förklarat så skulle man kunna säga att det är här användarupplevelsen och varumärkesupplevelsen möts. Så med andra ord handlar UI-design inte bara om vilken känsla eller vilka intryck ett gränssnitt ger på exempelvis en webbsida eller i en applikation. Utan även hur den kan guida och hjälpa användaren genom olika typer av designelement för att nå målet eller syftet med webbsidan eller applikationen.

Om UX-design går att likna med ett skelett så skulle UI-design kunna liknas med musklerna, blodomloppet, ja allt annat som får skelettet att fungera och komma till liv. Det är baserat på UX-designen som man skapar UI-designen, men här är det också viktigt att inte bara ha användarens perspektiv utan också varumärkets – hur ska varumärket upplevas och vad är syftet och målet med webbsidan eller applikationen?

I grunden handlar det om att på en webbsida eller i en applikation fånga en känsla kring varumärket – inte bara den att det är enkelt, smidigt och lätt att förstå utifrån användaren. Det är minst lika viktigt att fånga känslan av varumärket och vad målet och syftet är. För UI-design handlar just om att sammanföra användarupplevelsen med varumärkesupplevelsen. Detta gör man med hjälp av grafiska element som ofta går att återfinna i varumärkets grafiska identitet. Det innefattar bland annat:

Färger
Typsnitt
Bildmanér
Ikoner
Illustrationer
Animationer
Former och andra grafiska element.

En viktig sak att ha i åtanke är att en grafisk profil ofta är anpassad för analogt bruk och man kan behöva anpassa denna och komplettera med ytterligare delar för att det ska passa en digital miljö som exempelvis en webbsida eller i en applikation.

Varför är UI-design viktigt?

Som tidigare nämnt är UI-design där man sammanför användarupplevelsen och varumärkesupplevelsen. Varje webbsida och applikation har ett syfte och mål – om vi tar en webbshop som exempel. Då är målet att besökarna ska konvertera genom ett köp. Om UX-design står för uppbyggnaden och strukturen på webbsidan baserat på användarens upplevelse – var knappar för köp ska vara placerade, hur varukorgen är uppbyggd osv. Så är UI-designens uppgift att genom olika designelement underlätta kundresan – vilken färg och typsnitt knappen ska ha, hur varukorgen ska se ut osv.

För en person som besöker din webbplats första gången tar det bara 1/10 sekund för denna att skapa sig ett första intryck. Det är under den tiden som besökaren avgör de om de ska stanna eller lämna din webbplats. Saker som har en negativ påverkan är bland annat för mycket text, komplex design, laddningstid för sidan. (Källa: 8ways)

Webbdesign som skapar engagemang och resultat

Bra UX-design i kombination med bra UI-design är anpassad efter besökarna och användarnas behov och krav – vilket gör att den engagerar. Den hjälper till att hålla besökare och användare på din webbplats eller i din applikation under en längre tid, de hittar fram till önskad information, får en behaglig köpresa och den gör också att de väljer att komma tillbaka – som gör att ni då har större möjlighet att nå ut med ert mål och syfte. Något som är speciellt viktigt nu i dagens digitala samhälle när vår uppmärksamhet och toleransnivå är rekordlåg.