Et re-design av billett-bekreftelsesiden til SAS
Siden jeg originalt er fra vĂ„rt lands nordligste fylke, men bor og arbeider i hovedstaden, betyr det at jeg fĂ„r meg noen flyturer frem og tilbake hvert Ă„r.Â
Vi har bÄde SAS og Norwegian-fly som kan transportere meg hjem til hÞytidene. Men jeg tar hovedsaklig SAS. Og det gjÞr jeg fordi jeg er veldig fornÞyd med tjenesten som de leverer. Med unntak av en ting. Bekreftelsessiden for billett-bestillinger pÄ sas.no. Den er, i motsetning til resten av SAS-sidene, rotete, vanskelig Ä finne informasjon pÄ, og krever (etter min mening) for mye bÄde av nye og returnerende brukere.
Jeg hadde noen timer til overs pĂ„ jobb for et par uker siden og bestemte meg for Ă„ bruke noen av dem til Ă„ forbedre brukervennligheten til siden. Med utgangspunkt i hvordan den sĂ„ ut da jeg bestilte billett hjem fra juleferien i Ă„r.Â
Link til stor versjon av bilde.
Prosessen
Jeg satte noen begrensninger for prosjektet. I utgangspunktet Þnsket jeg ikke Ä legge til nye elementer, men heller prÞve Ä omstrukturere den informasjonen som allerede eksisterer pÄ siden. Jeg Þnsket ogsÄ tydeliggjÞre hva som er informasjon til brukeren, og hva som er handlinger som kan utfÞres av brukeren.
Bare sÄ det er sagt sÄ er jeg ikke grafisk designer. Mitt problem med siden er ikke at den er uattraktiv, men at det er vanskelig Ä raskt finne den informasjonen du Þnsker Ä finne. SÄ alle farger, skrifttyper, og andre grafiske elementer som jeg har brukt i redesignet har jeg lÄnt (eller hentet) fra andre steder pÄ sas.no
SÄ. FÞr jeg kunne begynne med oppbyggingen av den nye siden, startet jeg med Ä dekonstruere den nÄvÊrende siden. For Ä fÄ en oversikt over sidens ulike elementer og komponenter.
Her er oversikten jeg jobbet ut fra etter dekonstruksjonen.
Elementer
Den reisende
Pris
Betaling
Bonusprogram
Avbestillingsforsikring
Tilleggstjenester
Bestillingsreferanse
Bekreftelse sendt til
Strekkode
Reisen
Id
Linker
Send pÄ e-post
Skriv ut
Lagre i kalenderen
Avbestill
Endre bestilling
Tilbake til Startsiden
Deretter sÄ jeg om jeg kunne gruppere komponentene i logiske bolker. FÞr jeg gikk i gang med wireframing og selve designet. De hovedkategoriene som jeg landet pÄ var Betaling, Reisende og Reisen. Ved hjelp av disse gruppene fikk alle elementene (etter min mening) en fornuftig plassering.
Men la oss ta dette fra toppen av, og begynne med de Þverste elementene pÄ siden.
Endring og kansellering
Det som tidligere var to uanselige linker helt nede i venstre hjÞrne valgte jeg Ä flytte helt til toppen, og gi veldig tydelige og distingte knapper. NÄr du fÞrst har oppdaget at du har kjÞpt billetter til feil avreisetidspunkt (eller til feil by, som jeg har gjort ved et par anledninger) sÄ er det trygt Ä vite at du har en kanselerings-knapp lett tilgjengelig.
Slik kan du avverge en potensielt stressende situasjon, og redusere behovet for Ä ta en telefon til brukerstÞtte. NÄr SAS i tillegg har 24 timers Äpent kjÞp pÄ billettene sine, sÄ burde en tydeligere knapp ikke fÞre med seg sÄ mange problemer.
Bestillingsreferanse
Noe av det jeg har sett at flest personer har problemer med er Ä finne (og lese av) er bestillingsreferansen for reisen sin. Den stÄr Þverst pÄ siden nÄ, med en stor og tydelig skrifttype. Sammen med strekkoden, dersom brukeren skulle Þnske Ä bruke den.
Tanken bak det grafiske skille mellom tall og bokstaver har jeg fĂ„tt fra en av passordtjenestene jeg har benyttet meg av. IdĂ©en er at du aldri skal ha behov for Ă„ vurdere om det er et ett-tall eller en âlâ, eller om det er null eller en âOâ.
Har den en farge sÄ er det et nummer. Er den svart, en bokstav.
Jeg valgte Ä legge inn strekkoden to ganger, en pÄ hÞyre og en pÄ venstre, slik at brukeren raskt kunne skanne koden uten Ä mÄtte snu arket rundt fordi de tilfeldigvis stod feil vei i forhold til innsjekkingsautomaten.
Knapper
De tre handlingene som tidligere lÄ bortgjemt i en klynge av linker, nede i hÞyre hjÞrne, har fÄtt hver sin knapp og er plassert pÄ en egen rad.
Betaling
Fremstillingen av kostandene for turen var i utgangspunktet god. Det eneste jeg har endret pÄ er at alle prisene er hÞyre-justert, slik at regnestykket blir enklere Ä lese. Og at jeg har gjort en litt mindre drastisk utheving av totalsummen.
Hvilket kort som ble brukt for Ă„ betale kostnadene for reisen fant jeg naturlig Ă„ legge til her.
Den reisende
Bekreftelse sendt til ble endret til E-post, da det for det fĂžrste fĂžlger samme merkelapps-bruk som de andre verdiene i denne bolken. Navn inneholder navnet, Mobil inneholder mobilnummeret o.s.v. For det andre begynner det Ă„ bli en ganske standard prosedyre at bekreftelsen sendes til den e-postadressen som du har spesifisert. Jeg la i stedet til en knapp hvor du kan re-sende bekreftelsen hvis den ikke har ankommet.
Jeg endret Telefon til Mobil fordi jeg fÞlte at det var mer presist, og fordi det er dette nummeret du fÄr innsjekk- og avviks-meldinger til. Noe som forutsetter bruk av en mobiltelefon.
Et eventuelt bonusprogram er ogsÄ knyttet til individer som gjennomfÞrer reisen, og ble av den grunn lagt til i denne bolken. Jeg flyttet ogsÄ linken til Hvor mange Eurobonuspoeng tjener jeg? fra det nedre venstre hjÞrnet (rett under Se alle skatter, avgifter og tillegg) til under merkelappen Bonusprogram.
Man kan kanskje argumentere for at en avbestillingsforsikring har mest med selve reisen Ä gjÞre. Men for meg sÄ er forsikringen sterkere knyttet til personen enn den er til reisen. Det stÄr en del om forsikringen pÄ dagens bekreftelsesside som jeg har fjernet. Noe av dette er informasjons om du burde fÄtt i forkant av kjÞpet, og det resterende er ting du bare trenger i tilfelle du har noen spÞrsmÄl rundt forsikringen. Jeg har lagt alt slikt under en Les mer link, men det kan nok (og burde kanskje) lÞses pÄ en bedre mÄte.
Reise
Noe av det jeg personlig har hatt problemer med er Ă„ sjekke tidspunkt og rute for flyvningen min. Jeg forsĂžkte derfor Ă„ sette opp tydelige avgang- og ankomst-grupperinger.
Jeg valgte ogsÄ Ä bruke en stÞrre illlustrasjon av flykroppen. Det er to grunner til det. For det fÞrste for Ä tydeliggjÞre et element som allerede er pÄ siden, men ogsÄ for Ä indikere reisens retning (med hjelpsommme retningspiler). Det Äpner ogsÄ opp muligheter for Ä eventuelt vise hvilket sete brukeren har valgt Ä forhÄndsbestille. Eller Ä tydeligere vise forskjellene pÄ ulike billett-typene, noe som blir gjort i dag men som jeg tror de fleste ikke er klar over. Faktisk var det nesten ingen av de jeg viste mitt forslag til som visste at det befant seg en fly-illustrasjon (med billett-informasjon) pÄ den siden som brukes i dag.
Informasjonen om eventuelle elektroniske billetter er etter min mening noe som er tilknyttet avreise og har derfor blitt plassert her. Jeg vurderte en stund Ä legge det sammen med informasjonen om den som reiser. Men jeg kom frem til at bruken av billetten, i hvertfall for meg, er sterkt knyttet sammen med den avgangen som jeg skal bruke den pÄ.
Under ankomst-seksjonen har jeg valgt Ä legge inn noe av de mulighetene som er Ä finne i annonsene pÄ hÞyre side av skjermen. NÄ kan det virke som om man blander sammen to ting her. Bekreftelsen og reklame.
Vurderingen min er at den reklamen som ligger pÄ hÞyre siden av skjermen ikke er kommet dit tilfeldig. Det mÄ vÊre en eller annen type samarbeid mellom SAS og drosje- og bilutleievirksomhetene som reklamerer pÄ siden. Dessverre er annonser noe som folk i stor grad begynner Ä bli ganske blinde for.
Derfor tenkte jeg at en alternativ mĂ„te Ă„ presentere dette innholdet pĂ„ er Ă„ gi brukerene muligheten til Ă„ bestille disse tjenesten nĂ„r de mentalt gĂ„r gjennom reisen sin. Her er det ikke usannsynlig at de tenker âJeg tar en drosje fra flyplassenâ, og da har de umiddelbart en knapp hvor de kan bestille det, akkurat nĂ„r de har vurdert behovet for en slik tjeneste.
For Ä skille mellom tjenester som SAS leverer og disse sekundÊr-tjenestene valgte jeg Ä gi disse knappene en annen utforming enn de andre som finns pÄ siden.
Muligheten for Ă„ reservere et sete i forkant, eller kjĂžpe plass til ekstra innsjekket bagasje er tilknyttet hele reisen og ble derfor plassert midt mellom avgang og ankomst.
Resultatet
Og her har du resultatet av redesignet.
Link til stor versjon av bilde.
Jeg fÞler at det er viktig Ä pÄpeke to ting. For det fÞrste sÄ er dette resultatet av en veldig rask prosess som ikke var ment Ä produsere den mest nyvinnende av design. Og for det andre sÄ er det basert hovedsakelig pÄ mine vurderinger og obersvasjoner. Jeg har ikke samlet inn data fra andre brukere for Ä finne ut om dette faktisk er en god bekreftelsesside. Hele dette redesignet burde derfor vurderes for hva det er, en liten design-Þvelse.
Transit og tur-retur-reiser
Jeg lagde ogsÄ noen forslag pÄ reiser med mellomlandinger og flybytte, og tur-retur-reiser.
Transit
Link til stor versjon av bilde.
Jeg har lagt inn en glidene (grafisk) overgang mellom hver del av reisen. Som blant annet inneholder informasjon om hvor langt tid det er mellom flyvningene. Og litt i samme tankegang som bestilling av transport-muligheter har jeg lagt inn muligheten for Ă„ bestille et hotell.
Tur-retur
Link til stor versjon av bilde.
For Ä understreke den omvendte reiseretningen har jeg i returreisen snudd fly-illustrasjonen og avgang- og ankomst-bolkene. Jeg har ogsÄ, i motsetning til transit-forslaget, prÞvd Ä legge inn et tydeligere mellomrom mellom flyvningen til destinasjonsstedet, og flyvningen tilbake igjen. Og inne i det mellomrommet ligger det informasjon om hvor lenge oppholdet er planlagt Ä vare.
- Arnt

















