Presentasjon for IT-forum Nord-Norge, Sjøgata 12, 15. juni 2011

1. Tips og triks for bedre
brukeropplevelser
Vegard A. Johansen
Informasjonsarkitekt / interaksjonsdesigner
vegard@ramsalt.com

2. Ramsalt Lab
● Etablert 2010 etter sammenslåing av Ramsalt Web og
Aurora Labs
● 4 ansatte: Yngve, Martin, Ole og Vegard
● Rådgivning og utvikling av nettløsninger
● Spesialister på webplattformen Drupal
● Ambassadører for fri programvare

3. Drupal
● Er fri programvare = sikkerhet for våre
kunder
● Aktiv utvikling
● Gir få føringer på hvilke løsninger du
kan lage med det
● Er søkemotoroptimalisert
● Kan utvides lett
● Kan integreres lett med både sosiale
medier og interne systemer

4. Drupal i verden

5. Drupal fra oss

6. ..noen flere
● Senter for IKT i utdanningen
● Morgenbladet
● Kommunal Rapport
● Svalbardposten
● Tromsø internasjonale filmfestival
● Kongsberg Sattelite Service
● Nasjonalt senter for samhandling og telemedisin
● Douc Universidad Católica de Chile
● Sparebanken Nord-Norge
● Buktafestivalen
● Eiendomsmegler1
● Rica Ishavshotell,
● Studentparlamentet
● +++

7. Meg
● Vegard A. Johansen
● Hovedfag i medievitenskap fra Universitetet i København
● 34 år, samboer og 0,9 barn (ett i august)
● Arbeidet på Universitetet i Tromsø, Grey Digital i
København, Nasjonalt senter for samhandling og
telemedisin, freelance webutvikler og nå på Ramsalt Lab.

8. Informasjonsarkitektur
Informasjonsarkitektur handler om å sortere, kategorisere og
organisere innhold på den mest logiske måten for brukeren.
Hensikten er å gjøre informasjonen oversiktlig og forståelig
og å effektivisere navigasjon og gjenfinning. (Halogen)
~
Ofte brukt som stillingsbetegnelse på oss som arbeider med
de mer strategiske og konseptuelle aspektene av webutvikling.

10. Bransjeutvikling
● Programmereren ● Prosjektlederen
● Webredaktøren
● Webskribenten
● Markedsføreren
● Søkemotoroptimalisereren
● Designeren
● Informasjonsarkitekten
● Interaksjonsdesigneren
● Stategen
○ sosiale medie-stategen
● Dialogsjef (community manager)
● Programmereren
● Driftseksperten
● ++

11. Hovedområder
● Strategi
● Design / estetikk
● Brukeropplevelse
● Teknologi
● Markedsføring (inkludert søkemotoroptimalisering)

12. "Brukeropplevelse"
totalopplevelsen en bruker
har ved anvendelse av et
produkt, tjeneste eller et
system

13. "Nyttig"
Er den mest etterspurte /
nyttigste informasjonen
sentralt plassert, og der
brukerne ønsker å finne
det?
Lider du av nyhetssyken?

15. "Brukervennlig"
● Lett å lære
● Effektiv å bruke
● Lett å huske
● Relativt feilfritt og
feiltolerant
● Behagelig å bruke

16. "Finnbar"
Brukeres mulighet til å finne
relevante websider, og å finne
relevant informasjon på de.
Ekstern
● Søkemotoroptimalisering
● Optimalisering for sosiale
medier: "Like", "Share"
Intern
● Finn lett frem i
eksisterende informasjon
hos deg

17. "Tilgjengelig"
Universell tilrettelegging:
Nettstedet kan brukes av
alle uansett
funksjonshemming
● WAI / WCAG
● 6-8% er fargeblinde
● Google er en blind
bruker
● Tilgjengelighet =
søkemotoroptimert

19. Resten
Kredibel
● Hva gir tillit og
kredibilitet?
● Overbevisningspsykologi
Attråverdig
● Hva påvirker oss på et
mer emosjonelt plan?
Verdifull
● Sluttmålet: må gi verdi til
de som står bak (flere
medlemmer, mer salg
etc.)

20. Spørsmål så langt?

21. "It's not rocket science"
- Steve Krug

22. Metodikker, uten brukere
● Interne søkelogger, Google analytics og Google
webmaster tools
● Split-testing
● WAI / WCAG-validatorer + fargeblindfilter +
skjermleserfilter
● Heuristikker / ekspertevalueringer

23. Google Analytics

24. Google Webmaster Tools

25. Meta descriptions og Google (og Facebook)

26. Sosiale medier

27. Sosiale medier

28. Noen ting å ta med
● Førstesiden ikke alltid viktigst! (bruk footer)
● Hva gir treff? Nyheter eller faktasider? Sier bounce rate
noe?
● Tilsvarer din ordbruk brukernes ordbruk?
● Utnytter du sosiale medier?
● Optimere sidene med mest treff
● Fjerne sider som ikke har treff

29. Split-testing
● Google Website Optimizer
● Styr brukere mot to eller flere forskjellige inngangsporter,
mål resultatene

34. Split-testing

35. Validatorer
● Automatisk validering av sider etter standarder: HTML, WAI
/ WCAG
● www.cynthiasays.com / validator.w3.org

37. Heuristikker (indikatorer) / ekspertevalueringer

38. Heuristikker (indikatorer) / ekspertevalueringer
● Bør ikke brukes ukritisk, men veldig bra som sjekklister og
for å gjøre seg oppmerksom på ting man kanskje ikke har
tenkt på
● Må kunne tolke og forstå resultatene
● Bedre på tilgjengelighet enn på brukervennlighet, da
tilgjengelighet ofte handler om rene tekniske
implementeringer.

39. Spørsmål så langt?

40. Metodikker, med brukere
● Brukertester
○ Lag scenarier basert på strategi / mål:
■ Finn parkeringsplass i forbindelse med fødsel på
UNN.
■ Ditt scenarie?
○ 3-5 korte tester identifiserer nesten alltid noe
○ Juster, test på nytt.
● (Papir)prototypetesting og Kortsortering

41. Prototypetesting

42. Prototypetesting

43. Prototypetesting

44. Prototypetesting

45. Kortsortering
● La brukerne sortere innholdet ditt, gir unik innsikt i hva de
assosierer med det.
● Flere metoder, men skriv eksempelvis alle titler på
undersider på post-it-lapper, og la brukerne sortere dem i
frie eller faste kategorier.

46. Kortsortering
Siste nytt
om tilbudene
kontakt oss
nettbaserte kurs
guider og veiledninger
fagnett
opptak
oversikt
videokonferanser
om helsekompetanse
brukerveiledninger
våre tjenester

48. Kortsortering - finn logiske inngangsporter til innholdet

52. Andre metodikker
● Spørreundersøkelser
● Andre kvalitative metoder (workshops, intervjuer)
● Personas

54. Oppsummering
● Ramsalt, Drupal, Vegard
● Hovedområder i bransjen
● Teoretisk bakteppe
● Metodikker uten brukere
○ søkelogger / analyseverktøy
○ integrere med sosiale medier / trafikk-kilder
○ split-testing
○ validatorer / sjekklister
● Metodikker med brukere
○ brukertester
○ kortsortering
○ workshops / intervju / personas

55. Spørsmål? Kommentarer?
vegard@ramsalt.com
www.ramsalt.com
www.facebook.com/ramsaltlab
www.twitter.com/ramsalt