Design av brukargenererte data 1

Nettløysningar i dag genererer store mengder data. Talet på gongar ein har tvitra, talet på venner på Facebook og kor mange som likar eit innlegg du har skrive er eit eksempel på dette. Har du på denne typen data i løysninga di kan du gi meirverdi til brukaren ved å visa dei fram.

Hannah Donovan, interaksjonsdesignar (tidlegare designansvarleg hos LastFM hadde workshop om “Information design for an instrumented world” på Web 2.0 Expo i New York og delte sine tips og erfaringar med oss.

Tre ting du må få oversikt over før du set i gang med designjobben

1. Få oversikt over og forstå dei data du har tilgjengeleg i løysningen

Sannsynlegvis vil ikkje alle data vera interessante å visa fram, så det du må finna ut av er kva du vil oppnå og kvifor du vil oppnå det. Når du har dette klart kan du gå vidare til korleis du skal gjera det.

2. Få tak i reelle data

Det kan enten vera ein dump med data (ei fil, ein database o.l) eller levande data som du får tilgang til gjennom eit API. Finn ut korleis webgrensesnittet (API’et) virkar, kva variablar du kan få ut og i kva format du kan få dei ut.

3. Design med reelle data

Start med å skissa konseptet ut på papir. Deretter må du få inn reelle data (enten direkte i html, eller i minste fall – hent ut reelle data), så designar du grensesnittet med dei data som skal vera der.

Har du desse tre tinga for deg finst det ein verktøykasse med element som kan vera til inspirasjon i designjobben.

Verktøykasse med designelement for å visa fram data

Feed/Straum

Straumen av oppdateringar er alltid levande. Ofte er den animert for å visa at det er sanntidsoppdateringar. Flyten er i eit format der det nyaste alltid kjem øverst. Tenk på kor mykje du kan visa samstundes før det vert overveldande (signal vs. støy).

Straumen av oppdateringar på Twitter

Rangerte lister og topplister

Fungerar bra dersom det er eit konkurranseaspekt i dei data du visar fram. Ha med element som nummer, namn og verdi/talet på poeng.

Mest spelte artistar på LastFM

Status for brukaren

Viser korleis andre brukar det ein legg ut/deler. Til dømes kor mange har sett på profilen din eller kor mange av dine bilete har andre sett på.

Talet på gongar eit bilete har blitt vist på Flickr

Tellarar

Augneblikksbilete av brukarstatistikk. Til dømes talet på følgjarar og personar ein følgjer på Twitter. Omlag tre variablar er passe for at ein skal kunna oppfatta dei ved eit blikk.

Talet på gongar ein har tvitra, kor mange ein følgjer og kor mange som følgjer brukaren på Twitter

Sparklines/minigrafar

Desse minigrafane som Edvard Tufte har laga gir eit raskt overblikk og viser trender i store mengder data på liten plass.

Minigraf i WordPress over visningar av blogginnlegget

Linjediagram

Best på å visa samanhengdande data og trender i datamengden. Sidan data er samanhengande, må du tenkja på at brukaren skal kunna henta ut data frå kvart punkt på grafen. Som å henta ut farten for kvart punkt på løpeturen i grafen frå Runkeeper under.

Graf over løpetur på Runkeeper

Søylediagram

Søylediagrammet blir brukt til å visuelt samanlikna separate data. Til dømes å raskt sjå kva for ein joggetur er lengst.

Søylediagram over løpeturar på NikePlus

Setning

Du får kontekstualisert data i ein samtaleaktig form. Pluss at du kan gjera det meir personleg.

Tala fortel kor mange gongar ein har spelt sangen (LastFM)

Søk i data i sanntid

Søket oppdaterar seg etterkvart som du puttar inn søkeordet, som i søk i Twitter eller Google.

Søket i Twitter oppdaterar seg etterkvart som ein skriv inn søkefrasen

Favoritt/Likar/Elskar/Stjerne/+1

Dette kan du bruka der det er sanntidsstraumar med data som folk kan tenkjast å lika og som dei vil ta vare på. Då må du òg laga ein stad der data som ein merker kan hamna og der ein kan finna det att.

Favorittlåtar i Spotify kan stjernemerkast og finnast att under Favorittar

Resirkulering av data

Med resirkulering av innhald legg du til rette for late brukarar,- dei som ikkje er blant dei 1% som bidrar mest. Til dømes reblogging på Tumblr eller retvitring.

Funksjon for å retvitra ei melding som andre har laga i Twitter

Tommel opp/ned og rangering med stjerner

Dersom det er viktig for deg å få bra innhald på toppen av straumen/feeden din, er det lurt å la brukarane avgjera kva som er bra innhald og leggja dette øverst. Dersom du brukar stjerner må du sørga for at du får fram kva skalaen er; går den frå misfornøgd til fornøgd eller er ei stjerne litt fornøgd og fem superfornøgd. Tommel opp og tommel ned er lettare å forstå intuitivt for brukaren.

Stjernerangering av hotell på TripAdvisor

Varslingar

Varslingar skal visa oppdateringar brukarane ikkje vil gå glipp av. Varsla skal seia i frå om at det er noko nytt som har hendt utan å vera for påtrengande. Vurder støy vs. signal ratioen; kor mykje har du trong for å oppdatera brukaren på.

Varsel om nye oppdateringar på Facebook

Skriv en kommentar

  • *

XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>