same shit, different wrapping

Endelig resultat

Hvordan kan jeg tilpasse Wikipedia til forskjellige touchenheter og kontekster, og samtidig tilrettelegge for en god brukeropplevelse på disse enhetene?

En gjennomgang av sluttresultatet på masterprosjektet mitt.

Vi bruker timevis hver dag på å stirre på ulike skjermer. Hver av disse skjermene har en egen kontekst og en egen størrelse. Det er sjeldent du ser noen som rusler rundt med iPad på butikken for å hake av i handlelisten sin. Eller at folk sitter seg ned i godstolen for å lese det nyeste magasinet på en iPhone. Allikevel blir disse brukergruppene ofte behandlet identisk på internett.

I min oppgave har jeg undersøkt hvor stor forskjell det er mellom de ulike touch-skjermene vi bruker til daglig, og hva disse forskjellene har å si for meg som designer. Hvordan kan jeg lage en best mulig løsning for de forskjellige skjermene?

Resultatet av prosjektet mitt er en nytenkning av hvordan Wikipedia kan se ut på smarttelefoner og nettbrett. Innholdet er det samme, men spesielt tilpasset for hver plattform. Versjonen for nettbrett fremhever det visuelle innholdet på Wikipedia og prøver å sette deg inn i en modus hvor du går fra artikkel til artikkel og lærer nye ting. Versjonen for smarttelefon fokuserer på hastighet og raskt å finne informasjonen du er ute etter uten unødvendig nedlastingstid.

En stor del av oppgaven min har gått med til å forenkle begge versjonene mest mulig, slik at det er innholdet som er hovedfokus. For eksempel forstyrres ikke lesingen av linker og referanser, men samtidig kan de hentes frem ved et klikk dersom det er ønskelig.

Detaljer

Søkefeltet

Søkefeltet er plassert på bunnen av skjermen for å naturlig knyttes opp mot tastaturet når det er fremme, samt for å være lett å nå. På touchenheter hvor tastaturet kommet opp på skjermen er dette en mer logisk inndeling av skjermen, fremfor å ha søkefeltet i toppen slik det ofte er vanlig..

Hurtighet

I det du starter opp programmet på smarttelefonen er tastaturet allerede oppe og klar til å søke. Ingting lastes inn før du enten søker, eller velger å gå inn på et av menyelementene på forsiden. Dermed er du klar til å søke med en gang programmet starter.

Enkelt

For å ha mest mulig fokus på innholdet og teksten vises ikke linker og referanser. Disse må skrus på i menyen. På smarttelefonversjonen lastes heller ikke bilder inn, slik at artiklene skal lastes raskest mulig. Bilder er tilgjengelig fra menyvalg hvor du kan se disse i en egen bildemodus.

Fokus

Nettbrettversjonen presenterer artikler i to forskjellige versjoner: En tekstmodus og en bildemodus. På denne måten får du full fokus på teksten når du leser denne, og får presentert bildene størst og penest mulig når du ser på disse. I tekstmodus ser du et felt med bildeutsnitt øverst for å vise noe av bildeinnholdet i den enkelte artikkelen.

Contentscroll

På nettbrettversjonen er innholdsfortegnelsen kombinert med scrollbaren slik at du visuelt kan scrolle gjennom innholdet i artikkelen, og dermed raskt komme til det du er ute etter.

Screencapture

Screencapture fra smarttelefon-versjonen
Screencapture fra nettbrett-versjonen

Kontakt megFølg meg på Twitter