I forrige innlegg skrev jeg om haptisk respons, cursor og pølsefingre. Her er resten av mine tips for å oppnå behagelig og effektiv interaksjon på touch-skjerm.

Tips for å omgå visuelle forstyrrelser fra hånden

En utfordring med touch-grensesnitt er at fingeren og hånden nødvendigvis må dekke en del av skjermen når man interagerer. Dette kan oppleves forstyrrende for brukeren, og dessuten føre til feil.

iPhone bruker forskjøvede bekreftelsesområder

1. Design forstørrede eller forskjøvede respons-områder
   For å unngå at fingeren dekker knappen fullstendig når man trykker på den, kan man designe en knapp som temporært blir større eller forskyves litt for å bekrefte trykket.
2. Vurder plassering av ”label” og ledetekster over knappene
   Hvis ”label” står midt på knappen, eller under knappen, dekkes den mest sannsynlig når brukeren trykker. Sjansene er større for at den forblir synlig under interaksjon, hvis den står over eller øverst på knappen.
3. Vurder bruk av tidsforsinkelse på tilbakemeldingene
   Hvis du lar knappen vise bekreftelsestilstand litt lengre enn vanlig, kan brukeren få mulighet til å se effekten av sin interaksjon når hånden trekkes tilbake.
4. Plasser knapper langs skjermkanten
   En av fordelene ved å plassere knapper langs kanten av skjermen – særlig langs bunnen (og høyre kant for høyrehendte) – er at hånden dekker så lite som mulig av skjermen når man interagerer med disse.

Generelle tips for å ivareta brukeropplevelsen

En touch-skjerm er et forløsende fleksibelt alternativ til fysiske operasjonspaneler. Men siden konteksttilpasninger og variasjoner er så tilgjengelige, er det fort gjort å bli ”revet med” som designer. Her er noen fallgruver man bør være obs på.

1. Ikke vær for kreativ
   Vanlig trykk er den enkleste formen for interaksjon. Bruk det, hvis det ikke er en god grunn til å gjøre noe annet.Slide-funksjoner og andre gestures kan se fancy ut fra design-, utviklings- og markedsperspektiv, men brukeren vil ikke nødvendigvis være like entusiastisk.
2. Begrens valgmuligheter
   Hicks lov bør være kjent for de fleste som jobber med interaksjon og usability. Den påpeker hvordan brukseffektiviteten synker i takt med antall tilgjengelige valg. Fordi skjermplass ofte er et tema på touch-grensesnitt, får Hicks lov nå en dobbelt virkning.Derfor; prioriter de viktigste eller mest sannsynlige valgene for brukeren, og vurder å gjemme resten under en ”mer”-knapp, eller lignende.
3. Vær konsistent
   Fordi touch-grensesnitt fremdeles er en ny teknologi i massemarkedet, er konvensjoner i en bratt formingsfase. Det gjør det desto viktigere å være konsistent i bruken av knapper og kontroller, slik at løsningen blir så forutsigbar som mulig.
4. Input av tekst og nummer
   Et komplett alfanumerisk tastatur vil ta stor plass på et touch-grensesnitt, og er dessuten ofte anstrengende å benytte seg av. Gi brukeren gode default-valg der det er mulig, for å minske behovet for tastatur. For øvrig kan det være en god løsning at tastaturet kun vises når brukeren er i en input-kontekst.
5. Skill mellom input og output
   Hvis touch-grensesnittet brukes i kombinasjon med andre skjermer for output; vær klar over at brukeren vil måtte rette oppmerksomheten frem og tilbake mellom de tilgjengelige skjermene. I et slikt scenario kan det være fornuftig å begrense touch-grensesnittet til et input-panel (kontrollpanel), slik at all annen informativ lesning samles på de øvrige output-skjermene. Tenk på brukerens mentale modell av hele systemet, og hvordan du kan bidra til å gjøre denne så lite kompleks som mulig.

Tips for å unngå ”gorillaarm”

Mennesker er ikke bygget for å utføre små og presise bevegelser med armene opp. En uheldig virkning av vertikalt orienterte touch-skjermer er at brukerne etter hvert merker slitasje på grunn av ”uvanlig” muskelbruk. Dette fenomenet kalles ”Gorillaarm”, og har fått mesteparten av skylden for at touch-teknologien ikke fikk et forventet gjennombrudd på 80-tallet.

Selv om teknologien har bidratt til å minke dette problemet (særlig med tanke på trykkfølsomhet), bør man fremdeles gjøre noen grep for å bekjempe gorillaarmen.

1. Tilrettelegg ergonomisk støtte for arm og håndledd
   Dette er enklest å oppnå for interaksjon nederst på skjermen.
2. Bruk skjermkantene, hvis de er tilgjengelige
   Avhengig av utforming og plassering på skjermen, kan kantene noen ganger fungere som naturlig støtte under interaksjonen. Ved å holde på kanten av skjermen, kan brukeren få god støtte mens han/hun for eksempel opererer med tommelen
3. Tenk gjennom plassering av ofte brukte funksjoner
   De mest brukte funksjonene bør plasseres der brukeren har den beste ergonomiske arbeidsstillingen. Dette gjelder også for funksjoner som krever presisjon.
4. Tilrettelegg for sekvensielle oppgaver
   Hvis brukermønsteret er delvis eller helt forutsigbart, bør man prøve å gruppere knapper som brukes etter hverandre tett sammen. Da minimerer du behovet for bevegelser.

Tips for å hanskes med fingeravtrykk og skitt

Fingeravtrykk, støv og riper er spesielt synlig på mørke bakgrunner.

Hvis du ikke bruker stylus eller hansker, er det umulig å unngå fingeravtrykk på en touch-skjerm. Avhengig av skjermtype og grafikk, kan dette forårsake store visuelle forstyrrelser.

1. Kan du påvirke valg av skjermtype?
   Enkelte skjermtyper er tilrettelagt med optisk beskyttende lag som kan bidra sterkt til å minke dette problemet. Det er store forskjeller her.
2. Vær bevisst bakgrunnsgrafikken
   Fingeravtrykk er generelt mer synlig på mørke bakgrunner enn lyse bakgrunner. Sort er den fargen som er mest sensitiv for både fingeratrykk, støv og skitt – særlig i miljøer med sterke lysrefleksjoner fra vinduer eller lamperAlle visuelle forstyrrelser er dessuten tydeligere på klare (ensfargede) bakgrunner enn mønstrede bakgrunner. Mønstre kan imidlertid bidra til en følelse av kompleksitet, så der er det en balansegang.
3. Skill mellom funksjonalitet og informasjon
   Fingeravtrykkene konsentreres på og rundt interaksjonspunktene. Hvis du kan samle disse på et fast område på skjermen, kan du kanskje forhindre avtrykk på områder som utelukkende har ikke-interaktiv informasjon.

Stay in touch

Det var alt av mine refleksjoner for denne gang, men jeg gleder meg til fortsettelsen. Det er inspirerende å være med å påvirke hvordan verden rundt oss preges av stadig mer allestedsnærværende digitale brukergrensesnitt. Og nå som touch-teknologien er i såpass bratt modning nå, tar det litt tid før gode design- og usability-prinsipper er på plass.

Jeg håper mine tips kan være med å dra oss litt i riktig retning. I tillegg blir jeg gjerne med på diskusjoner om konkrete problemstillinger, dersom noen sitter og ruger på ett eller annet.

I mellomtiden: Lykke til med alle touch-prosjekter der ute!

Hvordan designe vellykkede touch-grensesnitt (1/3)

Hvordan designe vellykkede touch-grensesnitt (2/3)

Touch-teknologien har nylig revolusjonert vårt forhold til digitale flater. Det var kanskje på tide, nå som teknologien snart feirer 40 år, men til gjengjeld er vi i en voldsom modningsprosess akkurat nå. Plutselig kan man forvente høyresponsive multi-touch flater på både konsumelektronikk og bransjeverktøy.

Dette setter nye krav til oss som jobber med brukeropplevelse og interaksjonsdesign. I tillegg til de støvete usability-prinsippene, har vi nå en haug med nye muligheter, begrensninger og prinsipper å boltre oss i. Jeg har hatt gleden av å utforske disse dimensjonen i en rekke prosjekter i det siste, og tenkte jeg kunne dele noen av mine erfaringer her på Kjøkkenfesten.

Når duger ikke touch?

Terskelen er lav for å velge touch-teknologi nå som dette er relativt tilgjengelig og billig, og det er mange åpenbare fordeler. For det første har det fremdeles en wow-effekt, og gir produktet et element av modernitet. I tillegg er det plassbesparende og dynamisk, noe som kan bidra med dramatisk forenkling av produktene. Fordi touch utelukker mus, tastatur og andre knapper, vil dette også kunne oppleves som mer intuitiv interaksjon for brukeren. Både mentalt og fysisk forholder man seg til én digital flate for både input og output – fantastisk!

Det er imidlertid en del tilfeller der touch ennå ikke er den beste løsningen:

1. Interaksjonsintensitet
   Hvis produktet krever hyppig interaksjon over lang tid vil touch-grensesnitt vanligvis ikke være noen god løsning. Det er vanskelig å legge til rette for god ergonomisk arbeidsstilling når armen og håndleddet ikke hviler på en flate. I tillegg er det vanskelig å oppnå høy effektivitet – særlig der det er behov for mye input av tekst og nummer.
2. Nøyaktighet
   Sammenlignet med pilspissen på cursoren har vi alle tykke pølsefingre som gjør det vanskelig å oppnå nøyaktig berøring. I tillegg er finmotorikken utfordret hvis man må holde hånden opp. Hvis løsningen krever nøyaktighet, er det mulig touch ikke gjør susen.
3. Blind operasjon
   Hvis brukeren må følge med på noe annet mens han/hun interagerer med for eksempel et kontrollpanel er det en stor fordel med taktile skiller på knappene og kontrollene. Touch-skjermer har foreløpig bare én stor flate, som gjør ”blind operasjon” umulig.
4. Enhåndsoperasjon
   Hvis du skal operere på en enhet med samme hånd du holder den i, er det tommelfingeren som gjelder, og med svært begrenset rekkevidde. Dessuten blir multi-touch satt ut av spill. Dette er ikke umulig, men det utfordrer helt klart touch-opplevelsen. Legg merke til at iPhone oftest opereres med to hender.

Design for touch

De fleste usability-prinsippene vi er vante med fra konvensjonelle grensesnitt gjelder fremdeles. Men nå som mus, knapper og tastatur har forsvunnet, må vi ta stilling til en drøss med nye problemstillinger. Morsomt og utfordrende, og massevis å ta tak i!

For å gjøre det litt oversiktlig, prøver jeg å servere mine erfaringer i syv deler:

1. Tips for å kompensere for mangel på haptisk respons
2. Tips for å overleve uten cursor
3. Tips for å tilrettelegge for pølsefingre
4. Tips for å omgå visuelle forstyrrelser fra hånden
5. Generelle tips for å ivareta brukeropplevelsen
6. Tips for å unngå ”gorilla-arm”
7. Tips for å hanskes med fingeravtrykk og skitt

I neste innlegg lover jeg å stupe rett inn i grøten på disse tipsene. Og så håper jeg på å få noen protester eller spørsmål fra andre som har erfaring med lignende.

Stay in touch!

Hvordan designe vellykkede touch-grensesnitt (2/3)

Hvordan designe vellykkede touch-grensesnitt (3/3)

Overraskende vinner årets nettsted

Gulltagen er over for denne gang. Det faglige programmet har vært fremdragende, og deltagerne har kommet inspirert og motivert tilbake til arbeidsplassene sine. I ettertid har det vært både spennende og morsomt å følge debatten i sosiale medier. På twitter har debatten rast. Mange er sjokkerte og overrasket over at Anti-sweden vant prisen for Beste nettsted.

Anti-Sweden er våre naboer på Tullinløkka, men jeg kan ikke annet enn å stemme i. Dette er jo ikke brukervennlig! At man må forklare hvordan man skal navigere på nettstedet holder jo ikke mål overhodet! Uansett hvem målgruppa skal være, finnes det vel ingen som liker å måtte se en lang intro før man kommer til innholdet, lære seg en my måte å navigere på eller måtte lete etter varene man skal handle i butikken.

Tar man et raskt søk påTwitter #antisweden kommer et hav av kommentarer.

Stort engasjement i sosiale medier

Det er ikke bare på twitter debatten har rast. Debatten har gått på facebook, webforum og i blogger. Vinnerne blir av mange anklaget for å ikke ha hatt fokus på tilgjenglighet for alle og universell utforming. Dessverre stemmer dette.

På bloggen til Fredrik Nilsen har innlegget ”Gulltaggen og imna sover i timen” vakt et stort engasjement. Nilsen har fokus på manglende tilgjengelighet for vinnerne av flere kategorier i Gulltaggen, mens mange av de 110 (hundreogti! – i skrivende stund) som har kommentert hiver seg på og fokuserer også på brukervennligheten til nettstedet som vant.

Hva bør Gulltaggen premiere?

Hvorfor  velger Gulltaggen-utdelingen velger å premiere nettsteder som ikke er brukervennlige eller tilgjengelige?  INMA og gulltaggen ønsker å fremme innovasjon, inspirasjon og utvikling.  Hurra for det! Men la det ikke gå på bekostning av alt det andre som er viktig på web. Nettet er en kanal som har andre krav og muligheter enn tradisjonelle kanaler. Brukervennlige og tilgjengelige nettsteder trenger ikke å være konforme, tradisjonelle og kjedelige. Det må være en utfordring til hele bransjen å bidra til å skape innovative nettsteder som gir brukeren en god opplevelse og i tillegg er brukervennlig og universelt utformet. Det er mulig! Det krever bare litt mer innsats og kompetanse.

Hva må til for å lykkes på nett?

Nettstedet må være så brukervennlig at brukerne får til og ønsker å bruke det. Konkurrentene er bare et tastetrykk – eller googlesøk – unna. Stikker kundene er nettstedet dødt.

Egentlig sparker jeg inn åpne dører, men det trengs visst!

Hvorfor  skal man egentlig brukerteste?

Hensikten med brukertesting er å få innspill til å forbedre designet. I alle årene jeg har jobbet med brukertesting har jeg aldri opplevd å gjennomføre en brukertest uten å sitte igjen med a-ha opplevelser. ”Det var altså sånn brukerne opplevde designet vårt!”.  Samme hvor dreven man er i design av brukeropplevelser, vil alltid det å involvere reelle brukere av nettstedet ha en verdi.  

Fancy testlab er ikke det viktigste

Jeg jobbet tidligere i Telenor Mobil, hvor vi hadde vi en fancy testlab med utstyr for millioner. Men det er ikke nødvendig med dyrt utstyr for å få verdifulle innspill i en brukersentrert designprosess. Det aller viktigste er å ha kompetanse til gjennomføring en brukertest på en hensiktsmessig måte.

Brukertesting - Så enkelt kan en brukertest gjøres. Her ser vi en testperson foran PC'n, en testfasilitator og en observatør på andre siden av bordet

Dette trenger du å vite for å drive brukersentrering i praksis

Du påvirker testresultatet med alt du sier og gjør. Derfor er det viktig å ha kunnskap om:

• Hva bør testes?
• Når skal du teste?
• Hvem skal du teste løsningen på?
• Hvordan lage gode oppgaver?
• Hvordan snakke med en testbruker?
• Hvordan bruke funnene videre?

Dette og mer til får du lære på vårt kurs i brukertesting.

Kurset vil være veldig praktisk. Vi vil jobbe med case, og gjennomføre alle trinnene i en brukertest i løpet av kursdagen.

Les mer:

Netlife Research: Gjør det selv: 5 trinn til brukertestet nettsted

På kjøkkenfesten: Brukertest for loners

Den saken ønsker vi å gjøre noe med, og hva er vel da bedre enn å spørre brukerne?

Hva vil du finne på halogen.no? Og hva er det som engasjerer deg på et nettsted?

Ta en titt på halogen.no, og gi oss gjerne innspill og kommentarer.

Tusen takk for hjelpen.

Ble tipset om nettstedet FiveSecondTest.com, som lar deg utføre en lynkjapp brukertest på tilfeldige og villige nettbrukere. Det kan gi deg mange interessante svar – men hva var egentlig spørsmålet?

Konseptet er både enkelt, snedig og pent utført – du laster opp en designskisse, og så får besøkende fem sekundre på å klikke på de områdene av skjermen som de anser som fremtredende. Deretter legger man til en kort forklaring for hvert område man pekte ut, designeren får input og alle er happy. Eller?

Du kan jo prøve en test selv, før vi går videre: http://fivesecondtest.com/test/k3gZF9GJ

På mange måter kan teknikken minne litt om eyetracking, en teknikk som i seg selv både har sterke tilhengere og tilsvarende skeptikere blant svært oppegående brukeropplevelsesfolk, men det er kun ved første øyekast. Snarere er det nærliggende å se dette som en automatisert form for «mysetest», eller squint test, som er en uhyre enkel og effektiv måte å få et blikk for balanse og prioriteringer i designet ditt.

Ved eyetracking får deltagerne i en test reelle oppgaver de skal løse, og småfancy teknologi gjør at man kan måle hvor de til enhver tid ser. Innvendingen går i stor grad ut på at selv om man vet hvor brukerne ser, sier det lite om hvorfor.

Jeg skal ikke gå videre inn på den diskusjonen nå, annet enn for sammenligningens skyld. Likheten stopper ved å måle hva du ser på; den store forskjellen er at ved en «Five Second Test» måles det ikke mens du utfører en realistisk oppgave, du skal aktivt se etter deler av designet som stikker seg ut. Det er noe veldig, veldig annet enn de oppgavene man naturlig utfører på et nettsted – og da måler man gjerne noe helt annet enn hvor effektivt desginet er i en brukssituasjon.

I tillegg blir man altså bedt om å oppgi en kort beskrivelse av hva man har heftet seg ved. Det er en refleksjon man neppe gjør seg bevisst til daglig. En av kjernereglene ved brukertesting er at det er minimal verdi i hva brukerne sier, verdien ligger i hva de gjør (det kan gjerne være diametralt motsatt). Når vi spør brukere om deres meninger, er det vel så mye for å la de tømme seg og «bli hørt» som at det er så viktig input.

For å slutte på en litt positiv fot – all brukerinput er faktisk bedre enn ingen input. Så lenge du er bevisst på hva du måler, og at du liten grad måler hvor effektivt designet er til å hjelpe folk å utføre det de skal, kan en mysetest være nyttig. Enda bedre: Gjør det selv, på eget design! Og spør en kompis, kollega eller kjæreste, så kan du i tillegg få mer utfyllende informasjon.

Men dersom du hverken har venner eller kjæreste, kan FiveSecontTest.com være et godt alternativ.

Mye bra

Jeg synes at de nye sidene er et langt skritt i riktig retning. Tilgjengelighetsmessig er dette et eksempel til etterfølgelse. Html-koden validerer feilfritt, og siten passerer også et godt utvalg av tilgjengelighetstester.

Søk kunne vært enklere

I tråd med Halogens anbefalinger har UiO laget et samlet søk hvor man kan finne både personer og nettsider fra samme søkefelt. Men i tillegg er det et eget personsøk, og enda et søk for emner. Er det virkelig nødvendig å ha tre forskjellige søkefelt?

Dessverre ser det ikke ut til at det redaksjonelle arbeidet i forbindelse med søket er helt ferdig heller. Søker jeg etter en av UiOs profilerte jurister får jeg opp fire ulike treff til samme person (norsk og engelsk side, og hhv. mappe og indeksside).

Navigasjonsløsningen kunne vært mer intuitiv

Jeg er også litt skeptisk til deler av navigasjonsløsningen. UiO har valgt å legge opp til lik struktur innenfor de ulike instituttene. Dette har flere gode sider, blant annet at det gjør enkelt for besøkende å orientere seg innenfor de ulike instituttene uten å måtte «lære» strukturen på nytt, men i kombinasjon med den valgte navigasjonsløsningen tror jeg det kan være med å bidra til forvirring.

Grunnen er at menyen lett kan oppfattes som statisk og global, mens den i realiteten er kontekstuell i forhold til om man navigerer innenfor overordnet informasjon om fakultetet eller de ulike instituttene. Særlig problematisk er dette med menyelementet «Forsiden», som gjerne blir brukt som en redningsbøye for besøkende som har gått seg vill. Om jeg fra forsiden har klikket på et arrangement, så vil menyelementet «Forsiden» ikke lenger ta meg til fakultetets forside, men til forsiden for Institutt for offentlig rett. Selv om den dynamiske logoen/sporingen i toppen endrer seg, tror jeg dette vil skape forvirring.

Dersom jeg kun navigerer innenfor ett institutt, vil ikke dette være noe problem. Men jeg tror at dersom UiO gjorde det enda tydeligere i hvilken del av strukturen jeg befinner seg, og gjør det mer eksplisitt hvilken forside jeg kommer til via «Forsiden», ville vi fått det beste fra begge verdener.

Alltid mange hensyn som skal veies mot hverandre

Det vil alltid være en rekke kompromisser i et slikt prosjekt, og jeg har forståelse for at ikke alle sluttbrukerhensyn alltid går først. Det er et stort arbeid som er gjort nå, og det slutter sikkert ikke med det. Jeg gleder meg til fortsettelsen!