Hopp til innhold
Fagartikkel

Brukeropplevelse og brukergrensesnitt

I første rekke handler utvikling av nettsider om å skape en god brukeropplevelse. Det vil si at brukerne av et nettsted skal forstå strukturen og klare å orientere seg slik at de finner det de leter etter.
Video: Klipp og lim / CC BY-SA 4.0

Når du skal planlegge nettsider for en oppdragsgiver, er det viktig å forstå hva oppdragsgiveren ønsker med nettstedet. Hva er grunnen til at oppdragsgiveren vil opprette nettstedet, og hvilken målgruppe er den rettet mot? Dette er utgangspunktet. Videre i planleggingen må du finne ut hvordan brukeren skal kunne finne eller gjøre det han eller hun ønsker på nettsiden eller i appen.

Design av brukeropplevelse

Når du jobber med design av brukeropplevelsen, er du opptatt av å planlegge og designe navigasjonen til brukeren. Hvordan skal du skape en god opplevelse for brukeren din? Hvordan skaper du flyt i navigasjonen på nettstedet og gjør det enkelt å finne fram for dem som leter eller skal gjøre noe bestemt?

Seks bokser med pil mellom. I den første er det en strekmann med tenkeboble med teksten "Trenger en film fra NDLA". De fire neste boksene viser enkle skisser av nettside med oransje bokser som viser hvordan en nettside og skjerm ser ut når brukeren skal finne fram fra et søk i søkemotor til navigering inne på ønsket nettside. I den siste boksen ser vi en fornøyd strekmann som sier "Fant den!". Illustrasjon.
Slik kan en brukersti se ut. Den viser hvordan en person kommer seg fram på en nettside. Bilde: Stina Åshildsdatter Grolid, Albertine Aaberge / CC BY-SA 4.0

En brukersti viser hvordan en bruker kan navigere på en nettside. Den gir oversikt over hva brukeren trykker på, og rekkefølgen det skjer i. Slik kan du se for deg hvordan en typisk person kommer til siden din, leter og så finner fram. For nettstedet FrittOrd-konkurransen kan du for eksempel forestille deg at en lærer sender eleven sin inn i nettstedet som beskriver konkurransen. Eleven sjekker innleveringsfristen og rammene for konkurransen og setter i gang med idéarbeidet.

Personas

Det kan ofte være nyttig å lage brukerstier for ulike typer personer. Personas, eller "liksom-personer", brukes for å forstå hvordan brukerne opplever løsningen.

Du skaper ulike personas og lager brukerstier for hvordan folk med ulik alder og kjønn vil kunne oppleve navigasjonen på et nettsted. Gjør du et bildesøk på "UX storyboard", vil du se at det kan legges mye arbeid i brukerfortellinger.

Brukeropplevelse og brukergrensesnitt

Skisse som viser hva som er brukeropplevelse (UX), og hva som er brukergrensesnitt (UI). Brukeropplevelse knyttes til brukertesting, prototyper, brukerstier, personas og nettstedskart. Brukergrensesnitt knyttes til layout, visuell profil og merkevare. Det går ei pil ut fra brukeropplevelse til wireframes. Ei pil går videre ut fra wireframes og ned til brukergrensesnitt. Illustrasjon.
Bilde: Stina Åshildsdatter Grolid, Albertine Aaberge / CC BY-SA 4.0

Når nettsider eller apper for mobile enheter blir planlagt, er det to innfallsvinkler som er vanlige å ha:

  • Den ene er å være opptatt av hvordan brukeren navigerer, beveger seg og finner fram. Målet er å gi en opplevelse av flyt og at brukeren ikke føler seg stoppet i systemet.
  • Den andre er å vektlegge utseende. Hvilke farger og skrifttyper skal brukes? Hvilken stil skal det være på bilder og video? Det er viktig å sikre at nettstedet har et design som samsvarer med bedriften eller organisasjonens profil.

Den første vinklingen kaller vi design av brukeropplevelse, og den andre design av brukergrensesnitt. Den ene innfallsvinkelen henger sammen med den andre.

I bransjen blir de engelske forkortelsene UX og UI brukt. UX står for user experience, som betyr "brukeropplevelse", mens UI blir brukt om user interface, som betyr "brukergrensesnitt". Forkortelsene egner seg godt for bruk i nettsøk.

Skillet mellom UX og UI handler også om et skille i arbeidsdeling. Hvis to personer jobber med hver sin innfallvinkel på en nettside, er det viktig at de snakker godt sammen, slik at brukeropplevelsen passer som hånd i hanske med brukergrensesnittet.

Begreper