Funksjonalitet i to sekunder på iPhone
Under arbeidet med vår første iPhone-applikasjon Trafikanten, dukket det opp flere spennende diskusjoner. En av dem handlet om hva som er mest brukervennlig i løpet av de to sekundene applikasjonen åpnes.
En Splash Screen er skjermbildet som dukker opp når et program lastes/åpnes. Dette gjelder på datamaskinen din, Nintendo Wii-en din og på iPhone. Skal man lage en applikasjon for iPhone, skal man følgelig også lage denne velkomstskjermen. Men hvordan skal skjermen se ut?
En PNG-fil, med full iPhone-skjermstørrelse (320×480px) som skal hete Default, er det apple tillater/krever. Innholdet i den står vi fritt til å løse sånn som vi vil. Og vi i Shortcut vil jo alltid det vi tror er best for brukeren. Men i denne saken tok det lang tid før vi kom til en enighet internt. Det er nemlig to retninger man kan gå, for å lage en optimal splash screen.
Det er enklest å forklare dette med bilder. To ganske like program er Twitter-klientene TwitterFon og Twitteriffic. De har valgt hver sin retning.
Twitteriffic: Den fine, fargerike velkomsthilsenen
Iconfactory har alltid vært overlegne på design, og spesielt gode, deilige ikoner (naturligvis). Så at de ønsker å vise sin fine twitrefugl stort, er kanskje ikke overraskende. Denne fuglen er jo mer kjent som Twitter-ikon, enn Twitters eget. På denne måten får de også tydelig profilert seg selv, med navnet nederst.
Vår kunne da se slik ut:
TwitterFon: Den som later som om den er selve programmet
Kazuho Okuis oppstartsbilde ser helt annerledes ut. Her er det ingen logo, ingen fine bilder, ikke noe produsentnavn. Ingenting. Bare et bilde av slik applikasjonen ser ut, tom for innhold. Dette er den løsningen Apple selv anbefaler, og bruker på mange av sine preinstallerte applikasjoner.
Slik ble vår versjon:
Merk: I henhold til Apples anbefaling, har vi ikke tatt med menynavnene nederst, i motsetning til Kazuho Okuis.
Hva er best?
Hva får brukeren ut av Twitteriffic-fuglen? Ingenting, annet enn en bekreftelse på at programmet åpnes. Det gir faktisk en ganske god følelse å klikke på det lille applikasjonsikonet med en fugl, også kommer fuglen stort. Nesten animert.
Hva med TwitterFons løsning? Gir den en god opplevelse? Her var det vi, brukerekspertene i Shortcut, var uenige. To sterke meninger duellerte i dagevis for og imot denne måten å gjøre det på. Argumentet for: Funksjonaliteten til programmet, med knapper og faner, blir presentert så tidlig som mulig. Slik at brukeren kan forberede seg på hva hun/han ønsker å gjøre. Argumentet mot: Å vise knapper, faner etc. som man ikke kan trykke på er i seg selv dårlig brukervennlighet. Det gir rett og slett en broken følelse av å klikke på noe som ikke responderer.
En interessant artikkel det ble referert mye til under debatten var John Grubers Apple’s Private ‘Default.png’ Cheat. Den ligger litt ned på siden, og er verdt å lese. (Den tar opp bl.a. en tredje splash screen-løsning som Apple selv kan benytte seg av. Men som er utilgjengelig for oss andre. Heldigvis, for det er ikke en særlig god løsning.)
Og vinneren ble…
Jeg var den hos oss som sterkest ønsket TwitterFons eksempel, med en tom applikasjon. Jeg så ikke noe problem med inaktive knapper i to sekunder og jeg mente at The Apple Way is The Best Way. Anbefaler Apple én ting, på en helt ny plattform ingen av oss har særlig erfaring med, er nok dét det beste. Og det er jo sånn deres egne applikasjoner fungerer, så da vil opplevelsen være konsistent på brukerens iPhone.
Vi ble enige om å lage og teste begge deler, i håp om kanskje komme til en enighet når vi opplevde dette i praksis. Og det gjorde vi. Etter at jeg så hvordan overgangen fra den fargerike reklamevelkomstskjermen til ferdig installert applikasjon, opp mot den alternative overgangen, kastet jeg inn håndkle. Det fungerte rett og slett mye bedre og virket mer stabilt å ha et rent bilde, uten noe som indikerer funksjonalitet, som oppstart.
På denne måten fikk vi også vist frem Trafikantens logo med larven også. For det var det ikke plass til noe annet sted, noe jeg skal fortelle mer om i en kommende artikkel om hvordan iPhone-ikonet bør se ut?.
Så Apple tok feil?
Jeg tror ikke det. Jeg tror de har jobbet masse med måten å gjøre dette på, og kommet til en riktig konklusjon. For dem, og deres applikasjoner. I vår Trafikanten-app. ønsket vi å gjøre listen over sist besøkte stoppesteder (som er siden du kommer inn på i programmet) litt tøff, og litt designet. Så det jeg opplevde i vår interne test, var at en tom liste til en full grafisk liste, ble en like stor forandring som fra den blå Trafikanten-larven. Og da mistet den sitt hovedargument om en myk oppstart.
Slik ser den siden ut:
Hvis noen har andre meninger og/eller erfaringer, kommenter gjerne under. Dette er jo fortsatt ganske upløyd mark. Er det ikke?
PS: Registrer deg på produktsiden vår, så får du gratis SMS rett til din iPhone når Trafikanten ligger tilgjengelig i App Store.
Jeg synes alternativ en (logobildet) er den beste løsningen. Skjer ofte at jeg irriterer meg over at knapper ikke reagerer, nå det jeg trykker på egentlig bare er et bilde.
av magnusB, 28/11-2008
Jeg liker argumentet med at brukeren får se knappene og på den måten forberede seg på hva han/hun skal trykke på. Samtidig er jeg også enig i at det er bortkastet å vise knapper man ikke kan trykke på.
Kan man gå for en mellom løsning? Dvs, kan man vise knappene, men på en måte som gjør det opplagt at applikasjonen ikke er klar til å ta i mot kommandoer enda? De fleste grensesnitt har dette allerede, gjerne ved at knapper/menyvalg er fadet ut i en eller annen gråfarge. Har iPhone grensesnittet noe tilsvarende?
av Mike Andersen, 29/11-2008
@mike: Når appen lastes vises et png-bilde som kan inneholde hva man måtte ønske. Så det er i hvertfall teknisk mulig!
av August Lilleaas, Shortcut, 29/11-2008
Vi jobbet med en mellomløsning også, som kombinerte nedtonede knapper og fargerik logo. Men den ble på sett og vis enda mer misvisende. Falt litt mellom to stoler. Med kommunikativ design bør man ofte velge én klar funksjon, kommuniesre én ting av gangen. (Skrekkeksempelet fra virkeligheten er sovesofa; vond å sove i, vond å sitte i.)
Om du har et eksempel på en heldig kombinasjon for iPhone, Mike, hadde det vært gøy å se.
(Grunnen til at den mellomløsningen ikke fikk være med i artikkelen, var for å gjøre poenget med to retninger tydeligere, og unngå at artikkelen ble altfor lang…)
av John Eivind Hallén, Shortcut, 01/12-2008
Hei, er det noen mulighet for å ha en funksjon liknende den som finnes på Trafikantens nettsider, hvor man kan søke opp en reiserute..? Et must når du skal reise med overgang. :-)
av Petter, 18/12-2008
Vi har mange gode idéer som vi måtte kutte fra versjon 1.0. Målet med 1.0 er på mange måter at få ut noe som er bruktbart for de fleste av de som reiser kollektivt dagligt.
Men selvsagt kommer der flere oppdateringer efter det, hvad som ska være med er i stor grad basert på feedback og ønsker fra dere.
av Johan Sørensen, Shortcut, 18/12-2008
Interessant nok er splashscreen-løsningen den samme som Jef Raskin brukte da han lagde Canon Cat (http://is.gd/hokY). I hvert fall hevder han det i The Humane Interface, for jeg har aldri sett en in action.
I hvert fall, når man lastet inn en diskett (dette var 1987) fikk man se et bilde av hva som var på disken. Dette distraherte brukerne lenge nok til at maskinen rakk å lese gjennom innholdet på disken, som forhåpentligvis ikke hadde blitt endret siden sist.
Hvordan løste man det? Når man sparket ut en diskett tok Canon Cat visstnok et skjermskudd av viewport’en som viste diskettinnholdet.
Det er interessant hvordan visse grep kommer tilbake i nye sammenhenger :-)
Stå på, jeg gleder meg til neste versjon!
av Fredrik Matheson, 27/01-2009