Om å designe for mobil

Statistikk fra både Finn.no og nettsider jeg selv har tall fra viser at vi etterhvert kan regne med at 50% av de besøkende kommer fra en smarttelefon eller et lesebrett. Hva gjør dette med måten vi designer på?
Les blogginnlegget – som er et utdrag av foredraget jeg holdt på SkalarFrokosten 6. februar.

Statistikk fra både Finn.no og nettsider jeg selv har tall fra viser at vi etterhvert kan regne med at 50% av de besøkende kommer fra en smarttelefon eller et lesebrett. Hva gjør dette med måten vi designer på?

På en nettside jeg har statistikk fra var antallet mobilbesøkende helt oppe i 75%. Denne nettsiden hadde omtrent 1000 besøkende på en dag, og var stort sett lenket til fra Facebook – noe som forklarer det høye tallet. Likevel; hadde ikke denne nettsiden vært mobiltilpasset ville 750 av de besøkende måtte zoome seg inn og flytte seg sidelengs for å se innholdet, og i verste fall bare forlatt siden uten å prøve.

Da jeg begynte å lage nettsider for snart 15 år var virkelighetsbildet at “De fleste sitter på skjermer med 640×480 i oppløsning. Så da designer vi etter dét.” For mobil lagde vi etterhvert WAP-sider … som var en tekstbasert versjon av nettsiden.

Deretter ble skjermene større og større … Og i dag, etter at Steve Jobs har endret måten vi er på nettet på, ser oversikten over skjermstørrelser slik ut:

android-screen-sizes2

Vi har ingen klare skillelinjer mellom størrelsene på mobil-, lesebrett og desktop-skjermene. Vi må lage innhold som kan tilpasse seg.

Designernes utford… eh … mulighet

At mobilen har blitt en viktig skjerm for kundene dine gir oss som designere et problem. Eller nei, det gjør det ikke. Det hjelper oss designere til å lage bedre ting og gir oss nye muligheter:

ikoner_11. Lite område

Vår minste scene er en bitteliten klubbscene med en liten mikrofon … der det så vidt er plass til oss. Vi kan ikke si så veldig mye, og vi har ofte fem sekunder på oss før vi eventuelt blir buet av scenen. Derfor må vi vite veldig godt hva vi skal si før vi går på.

For 10 år siden kunne jeg fort bli fristet til å lage et webdesign «når jeg først lagde logo». Sånn fungerer det ikke lenger. I dag må vite hva hovedbudskapet vårt er før vi begynner å designe noe.

Dette er grunnen til at vi liker å tenke mobile first – altså å begynne nettsideutviklingen med å designe for mobil. Ikke fordi vi på død og liv skal lage designet for mobiltelefonen først, men fordi mobile first tvinger oss til å ta noen valg.

Vi har tatt disse valgene tidligere også. Men da har det ofte blitt som et forprosjekt for de kundene som vil «gjøre det skikkelig». Da handlet det mer om hva skal øverst i midten på forsiden av nettsiden og hva skal i høyremargen. Nå er vi over i “du har to sekunder til å komme med budskapet ditt: Hva er budskapet ditt?”

Det hender også at vi skal lage noe der ikke mobilbrukerne er så sentrale – for eksempel med internløsninger som på grunn av sikkerheten kun kan brukes av litt gamle PCer. Men også da kan det hende vi begynner med å designe for mobil, fordi det tvinger oss til å ta noen strategiske valg for innholdet.

ikoner_22. Ytelse

Da jeg på begynnelsen av 2000-tallet lagde nettsider satt vi nærmest med kalkulator og regnet ut hvor mange kilobyte som måtte lastes ned for designet vi lagde. Alt ble målt opp mot et 28.8-modem.

Det var en befrielse for noen år siden å kunne si til kunder at; “Nå slipper vi tenke på sånt! Alle har jo så bra internettforbindelse. Kjør på med en film i toppen, baby!”

I dag, i 2014, er vi litt tilbake til 28.8-modemet. Hjemme sitter vi på 10, 20 og 100mBit-linjer. Men når vi er på bussen, toget, på hytta eller på Gran Canaria har vi skremmende ofte et Edge-symbol på mobilen vår. Da må vi tenke gjennom ikke bare hva vi sier, men hvor mange kilobyte vi bruker på å si det.

ikoner_33. Touch

En tredje mulighet vi har når vi skal designe nettsider i 2014 … er at det er en stor del av brukerne som har mange flere muligheter enn å scrolle og klikke.

I dag tenker vi nok fort at «vi har en nettside som må designes til å passe også på et nettbrett og på en smarttelefon». Men både nettbrettet og smarttelefonen er mye mer enn bare mindre skjermer.

På mobil har vi muligheten til:

  • Å vite hvilken retning brukeren holder telefonen (kompass)
  • Å se brukeren, eller se det brukeren ser (kamera x 2)
  • Høre hva brukeren sier (mikrofon)
  • Å vite hvor brukeren er (geo)
  • Å vite hva brukeren heter, hva morra hans heter og om han liker ACDC eller Are Kalvø (Facebook)
  • Osv …

gesture-icons-004

Men likevel benytter vi oss sjeldent av det. Det tenker vi litt for ofte at er app-verdens jobb.

Men nettsidene har de samme mulighetene. Vi trenger virkelig ikke bruke alle! Men veldig ofte tenker jeg at “denne mobilversjonen kunne vært bedre om de hadde benyttet oss av mulighetene”.

Eksempel på en nettside som ikke bare viser "liten versjon" på mobil
Eksempel på en nettside som ikke bare viser «liten versjon» på mobil

Oppsummert

Oppsummert tenker jeg at den nye mobilverden gjør følgende med oss:

  • Den tvinger oss til å ta strategiske valg for innholdet
  • Den tvinger oss til å bruke mindre ressurser for å vise det
  • Den gir oss muligheter til å kommunisere med kundene våre på helt nye måter

Hvordan snakker du med kundene dine via mobilskjermen?

Hvordan utnytter du mulighetene som ligger i en smarttelefon?

Forfatter: Johannes

Grunnlegger og seniordesigner i Brainify, med 21 års erfaring som designer, konseptutvikler, prosjektleder, forretningutvikler og innholdsprodusent for kunder som Vårt Land, Redd Barna, Posten, Aker Solutions og Norad i tillegg til mange mindre bedrifter og frivillige organisasjoner.

3 kommentarer om “Om å designe for mobil”

Legg igjen en kommentar

Fyll inn i feltene under, eller klikk på et ikon for å logge inn:

WordPress.com-logo

Du kommenterer med bruk av din WordPress.com konto. Logg ut / Endre )

Twitter-bilde

Du kommenterer med bruk av din Twitter konto. Logg ut / Endre )

Facebookbilde

Du kommenterer med bruk av din Facebook konto. Logg ut / Endre )

Google+-bilde

Du kommenterer med bruk av din Google+ konto. Logg ut / Endre )

Kobler til %s