Skifte beite? Gresset er grønnere hos oss
Sammen sprenger vi grenser for hva web kan være. Vi ser spesielt etter: Tekstforfattere, prosjektledere, designere og interaksjonsdesignere.
Lightbox: Årets interaksjonsdesignteknikk? 4
I Jakob Nielsens siste Alertbox utroper han lightbox til Interaction Design Technique of the Year. Lightbox er i utgangspunktet en javascript-applikasjon som på en enkel og elegant måte trekker brukerens oppmerksomhet mot et element i midten av skjermen ved å dimme bakgrunnen.
Eksempel på bruk av lightbox ved registrering på netvibes.com
Teknikken ble først introdusert som en måte å vise bilder på, men finnes nå i flere varianter som gir muligheter for animasjoner og posisjonering. Den kjennetegnes også ved at den er lett å implimentere, det finnes flere gratis biblioteker (lightbox, thickbox, facebox).
Vi har også funnet et triks for å simulere lightbox når man papirprototyper. Ved å legge matpapir over prototypen dimmer man enkelt ned området rundt for eksempel en dialogboks, og kan lettere spille ut interaksjonen og få tilbakemelding der hvor lightbox er et viktig interaksjonselement.
Lightbox kan enkelt simuleres ved hjelp av matpapir i en papirprototype
Nielsen trekker frem hovedfordelen ved lightbox: Den er umulig å ikke bli lagt merke til av brukeren.
Han lister også opp noen ulemper som vi har lyst til å gjengi her, fritt oversatt:
- En lightbox stanser brukeren fullstendig i sitt arbeid. Ikke bruk det til lavprioritetselementer eller bakgrunnsinformasjon.
- Dette er modale dialogbokser til det ekstreme. Det er teoretisk mulig å støtte interaksjon i det dimmede området, men noe som er dimmet bør være inaktivt.
- Brukere må ofte referere til informasjon i bakgrunnen for å kunne avgjøre det som kommer frem av dialogboksen. Hvis bakgrunnen er dimmet for mye, kan den informasjonen være vanskelig å lese.
Vår erfaring tilsier at bruken av lightbox også må støtte tilbakeknappen i nettleseren. Mange brukere klikker på tilbakeknappen når de føler at de ikke kommer nærmere målet sitt. Da er det viktig at brukeren kommer tilbake der den var før lightboxen tok kontrollen.
Vi er også litt usikre på om lightbox ikke egner seg for bakgrunnsinformasjon, slik Nielsen hevder. Teknikken ble introdusert som en måte å vise bilder på, uten å ta brukeren ut av kontekst. På samme måte kan den fungere fint å vise utdrag av tekst eller viktig informasjon, der hvor denne informasjon trenger å være i fokus – uten å ta brukeren ut av kontekst.
Har du eksempler eller opplevelser på god eller dårlig bruk av lightbox, kommentér eller lenk gjerne til det her.
Lars Kristian Flem har jobbet hos NetLife Research i sommer. Han studerer master i informatikk ved NTNU og blogger vanligvis på tenketing.net.
Tor Løvskogen Bollingmo, 16.08.2008 12:56
Genialt med matpapiret :) Lager dere ofte wireframes analogt?
Lars K, 18.08.2008 11:22
Bruken av analoge wireframes er avhengig av type prosjekt, hvor i prosjektløpet vi er og hvilken type leveranse kunden forventer.
Vi gjorde et prosjekt nylig hvor vi brukte papp-firkanter for å illustrere elementer, knapper og menyer. Å kunne flytte pappbitene rundt på en skisset nettside gjorde at vi fikk flere iterasjoner og flere utkast enn vi hadde gjort hvis vi skulle tegnet de. Enkle skisser på papir kan kommunisere en idé godt, men selv papirprototyper kan bli “verdifulle” i et konseptuelt arbeid. Vi tok bilder av de forskjellige utkastene og kunne diskutere de etterpå – selv om selve prototypen var ødelagt fordi vi hadde laget nye utkast med av de samme pappbitene.
Bilder av de analoge wireframes’ene var en del av den leveransen, fordi det fungerte godt for kunden som utgangspunkt for det videre arbeidet.
Etter konseptfasen lager vi vanligvis digitale wireframes som legger grunnlaget for det grafiske designet. Da blir det lettere å ta hensyn til skjermoppløsning, dynamiske elementer, hvordan siden er semantisk oppbygd, og lignende.
Allmuen, 18.08.2008 15:16
Papp og papir i 2008????? Jeg ler meg ihjel!
Synve, 19.08.2008 15:28
Dobbelt lag – for økt tetthet.
Vi har oppdaget en liten svakhet ved matpapiret-trikset. Dersom man benytter kopi-maskin istedetfor fotografi blir det for lite gjennomsiktig.
Heldigvis kom vår venn Geir Bruskeland på løsningen. Dobbelt lag.