FX Media

Brukergrensesnitt (UI)

Kort forklart

Brukergrensesnitt (user interface, forkortet UI) er den visuelle og interaktive delen av nettsiden: knapper, menyer, farger, skrifttyper, ikoner og layout. Der brukeropplevelsen (UX) handler om hvordan det føles å bruke siden, handler UI om hvordan den ser ut og responderer. De to henger tett sammen, men er ikke det samme.

Hva er et brukergrensesnitt?

Brukergrensesnittet er kontaktflaten mellom mennesket og nettsiden: alt som kan ses, leses og klikkes på. Det omfatter fargepalett, typografi, knappestiler, skjemafelt, ikoner, bilder og hvordan alt dette er plassert på skjermen. Et godt UI kommuniserer uten ord: den viktigste knappen ser viktigst ut, det som hører sammen står sammen, og du forstår intuitivt hva som kan klikkes.

Skillet mot UX er enklest å huske slik: UI er det du ser, UX er det du opplever. En restaurant kan ha vakker innredning (UI) og likevel gi elendig service (UX). På nett trenger du begge, og for en liten bedrift er UI ofte førsteinntrykket som avgjør om den brukeropplevelsen i det hele tatt får en sjanse.

Hvorfor design avgjør tilliten

Besøkende vurderer troverdigheten din på under et sekund, og den vurderingen er nesten utelukkende visuell. En side som ser utdatert eller rotete ut, tolkes ubevisst som at bedriften er det samme, uansett hvor dyktig du faktisk er i faget. For lokale tjenestebedrifter, der kunden skal slippe deg inn i hjemmet sitt eller legge helsa si i hendene dine, er den visuelle tilliten ofte det som skiller en henvendelse fra et tilbakeklikk.

UI er også merkevare i praksis. Konsekvent bruk av farger, logo og tone gjør at folk kjenner deg igjen på tvers av nettside, annonser og sosiale medier, en rød tråd som bygger gjenkjennelse over tid.

Visuelt hierarki: å styre blikket

  • Størrelse og vekt: det viktigste (overskriften og call-to-action) skal være størst og tydeligst.
  • Kontrast: én tydelig aksentfarge til knapper og lenker, mot en ellers rolig palett. Hvis alt roper, hører ingen noe.
  • Luft: hvitrom rundt elementer gjør siden lettere å lese og får innholdet til å virke mer eksklusivt. Trange sider oppleves billige.
  • Konsistens: like ting skal se like ut. Samme knappestil, samme avstander og samme skrifttyper på hele siden.

Designsystem, også for små bedrifter

Et designsystem er et sett med faste valg: to skrifttyper, en definert fargepalett, faste knappestiler og faste avstander. Store selskaper har hundresiders systemer; en småbedrift trenger bare én side med regler. Poenget er det samme: hver nye undersider, annonse eller kampanje bygges av de samme klossene, så alt henger sammen visuelt, og du slipper å ta de samme designvalgene om igjen hver gang. En sterk visuell identitet gjør også alt annet markedsarbeid mer effektivt.

Konkret eksempel

Et snekkerfirma i Melhus hadde en nettside fra 2015: liten skrift, sju farger, uskarpe bilder og en 'Send'-knapp i grått. Firmaet leverte håndverk i toppklasse, men tapte anbud mot konkurrenter med halvparten så lang erfaring, og penere nettsider. Etter et redesign med rene linjer, store bilder av egne prosjekter, én tydelig aksentfarge og konsekvent typografi doblet henvendelsene seg på tre måneder, og firmaet kunne prise seg 10–15 prosent høyere. Samme håndverk, ny innpakning.

Vanlige feil

  • For mange farger og skrifttyper. Det visuelle støyet drukner budskapet.
  • Generiske arkivbilder av smilende modeller i stedet for ekte bilder av folkene og arbeidet ditt.
  • Knapper og lenker som ikke ser klikkbare ut, eller er for små for tommelen på mobil. Responsivt design gjelder også detaljene.
  • Design som prioriterer 'kult' over tydelig. Effekter og animasjoner skal støtte innholdet, ikke konkurrere med det.

Slik kommer du i gang

Sammenlign siden din med de tre beste konkurrentene i markedet ditt, sett fra mobil. Ser din minst troverdig ut, taper du kunder på det hver uke. Start med det som gir mest: ekte bilder, én aksentfarge, konsekvent typografi og en tydelig hovedknapp. Større grep (full visuell profil og redesign) er et prosjekt der et byrå typisk tar fra 15 000 kr og oppover, avhengig av omfang.

Ofte stilte spørsmål

Hva er forskjellen på UI og UX?

UI er det visuelle grensesnittet: farger, knapper, typografi og layout. UX er totalopplevelsen: om folk finner frem, forstår og får gjort det de kom for. UI er en del av UX: en pen side med håpløs struktur gir fortsatt dårlig brukeropplevelse.

Hva koster et nytt design på nettsiden?

En visuell overhaling av en eksisterende småbedriftsside koster typisk 15 000 til 60 000 kr hos et norsk byrå, avhengig av antall sider og om innhold og struktur også skal fornyes. Et helt ny nettside med design, tekst og oppsett ligger gjerne mellom 30 000 og 100 000 kr.

Trenger en liten bedrift et designsystem?

Ja, men i miniversjon: én side som definerer logo, to skrifttyper, fargepalett og knappestil. Det sikrer at nettside, annonser og sosiale medier ser ut som samme bedrift, og sparer deg for tid og ad hoc-valg hver gang noe nytt skal lages.

Nettsider

Vil du ha hjelp med dette i praksis?

Å forstå begrepene er første steg. Å få det til å fungere for bedriften din er neste. Det er der vi kommer inn.