Brukervennlige og
effektive nettsider
Are Gjertin Urkegjerde Halland
Informasjonskontoret for kristne folkehøgskoler
Kongsvinger, 8. november 2007
NetLife Research er uavhengige
eksperter pĂĽ brukervennlig design
⢠Brukersentrerte designprosesser
⢠Informasjonsarkitektur og interaksjonsdesign
⢠Brukertesting og eyetracking
⢠Evalueringer, kurs og rüdgivning
Myter om brukervennligheit
⢠Maks tre klikk til alt
⢠Sju elementer i menyen
⢠Unngü scrolling
⢠Mykje funksjonalitet
⢠Ser fint ut
Definisjonar av brukskvalitet
Eit system skal vĂŚre
â lett ĂĽ lĂŚre,
â effektivt,
â lett ĂĽ huske,
â hĂĽndtere feil pĂĽ ein god mĂĽte
â og vĂŚre behagelig ĂĽ bruke
http://www.useit.com/alertbox/20030825.html
Kordan sikre brukervennligheit?
⢠Involver brukarar og brukarkrav i
utviklingsprosessen
⢠Tilpass innhold og teknologi til brukarane,
ikkje omvendt
⢠Gjer løysninga oppgüvefokusert
⢠Følge utbredte retningslinjer
⢠Iterativ utvikling
⢠Brukertest
Perfekt brukervennligheit hjelper ikkje...
⢠... hvis ingen har bruk for tenesta
âI will accept poor usability if I
get what I need, if the total
experience is great. I will reject
perfect usability if I am not
rewarded with a useful,
engaging experience.â
- Donald Norman
Eit spørsmül om tillit
âIf possible, avoid having ads on your site.
If you must have ads, clearly distinguish
the sponsored content from your own.
Avoid pop-up ads, unless you don't mind
annoying users and losing credibility.â
http://credibility.stanford.edu/guidelines
10 retningslinjer for truverdigheit
1. Gjer det lett ĂĽ verifisere innhaldet ditt (lenker ut er bra)
2. Vis at det stĂĽr ein ekte organisasjon bak
3. Vis fram ekspertise gjennom innhald
4. Vis fram ekte og truverdige mennesker
5. Gjer det lett ĂĽ kontakte deg
6. Utform sidene profesjonelt og hensiktsmessig (design)
7. Gjer nettstaden nyttig og brukarvennlig (oppgĂĽvefokusert)
8. Vis at innhaldet er oppdatert
9. Vis stor varsemd med annonser
10. UnngĂĽ feil av alle slag (ogsĂĽ smĂĽfeil)
http://credibility.stanford.edu/guidelines
Lett ĂĽ finne?
Utfordringa er ikkje lenger ĂĽ gjere
informasjon tilgjengeleg, men ĂĽ
besvare informasjonsbehov nĂĽr
dei oppstĂĽr, der dei oppstĂĽr
Verdien som blir skapt er avgjerande
⢠Verdi for brukaren
â Nytteverdi
â Opplevelse
â Return on Experience
⢠Verdi for avsendar
â Inntjening
â Innsparing
â Return on Investment
4 smarte ting ĂĽ tenke pĂĽ
⢠Legg til rett for skumming
⢠Bruk triggerord aktivt
⢠Lag oppgüvefokuserte innganger
⢠Vurder om nyheiter er riktig
1) Folk les ikkje tekstar, dei skummar
⢠Skriv kort og legg til rette for skumming
â Korte setningar
â Korte avsnitt
â Punktlister
â Utheva nøkkelord
2) Folk leiter etter triggerord
⢠Triggerord
â Ordet brukeren âhar i hodet sittâ
â Det du bruker nĂĽr du søker pĂĽ Google
⢠Sjekk søkeloggen hvis du har!
⢠Bruk triggerord aktivt i tekst og lenker
Kva er vĂĽre triggerord?
3) Tenk viktigste oppgĂĽver
⢠Utgangspunkt i personas og scenarier
⢠Lukten av informasjon og triggerord
4) Er nyheiter den beste mĂĽten?
⢠Burde vi heller ha
oppgĂĽvefokuserte
inngangar?
⢠Blogg kan vere eit meir
personleg og betre
alternativ
â(âŚ) etter ei uke har (nyheiten) ingen verdi lenger. Den
er gløymt, og ligg difor og rotnar i arkivet. Og det luktar
ikkje godt om nokon skulle slumpe til ĂĽ finne den.â
http://www.nettskriving.no/skrivetips/2005/10/794553.shtml
Agenda
10.00 â 10.45 Hva er gode brukeropplevelser?
10.45 â 11.15 Kaffepause
11.15 â 12.30 Personas, bruksoppgaver og forretningsmĂĽl
12.30 â 13.30 Lunsj
13.30 â 14.00 Intro til kjernemodellen
14.00 â 15.30 Kjernesider (Gruppearbeid)
15.30 â 16.00 Kaffepause
16.00 â 17.00 Presentasjon og tilbakemeldinger
Agenda
10.00 â 10.45 Hva er gode brukeropplevelser?
10.45 â 11.15 Kaffepause
11.15 â 12.30 Personas, bruksoppgaver og forretningsmĂĽl
12.30 â 13.30 Lunsj
13.30 â 14.00 Intro til kjernemodellen
14.00 â 15.30 Kjernesider (Gruppearbeid)
15.30 â 16.00 Kaffepause
16.00 â 17.00 Presentasjon og tilbakemeldinger
PERSONAS OG SCENARIER
Tre viktige spørsmül
1. Kven er brukarane? 2. Kva mĂĽl har dei?
3. Hvordan kan vi hjelpe dem ĂĽ nĂĽ sine mĂĽl?
1. Kven er brukargruppene?
⢠Mülgrupper er pü ikkje tilstrekkelig
⢠Vi mü vite kven dei faktiske brukargruppene er
⢠Aller helst bør vi snakke med folk for ü finne
ut dette
?
2. Kva mĂĽl har dei?
Døme: NRK
Kva er oppskrifta pĂĽ skillingsbollar?
Døme: Lünekassen
Nür er fristen for ü søke fast rente?
Døme: SFT
Kor mykje PCB-holdig rivningsmateriale er pĂĽ
?
avveie?
3. Korleis kan vi hjelpe folk ĂĽ nĂĽ sine mĂĽl?
⢠Pü internett?
?
â Innhold
â Funksjonalitet
â Design og layout
⢠Og korleis skal nettet forholde seg til andre
kanaler: brosjyrer, kampanjer, kundeservice?
Personas og scenarier
⢠Kva er personas?
â Ikkje reelle brukere
â Ikkje gjennomsnittlege brukere
â Men typiske brukere
⢠Kvifor personas?
â Konkretisering
â Vise brukarane sitt handlingsmønster
â Gi prosjektet brukarfokus
â Styrande for videre utvikling
â Felles referanse for prosjektteamet
â Evalueringsverktøy
Case: Vinmonopolet
Scenario 1
Eli skal ha jentekveld pü lørdag
og vet at hun snart mĂĽ begynne
ü tenke pü ü bestille, helst i løpet
av mandagen. Hun ringer
kundesenteret og ønsker ikke
postoppkrav. Kundesenteret
anbefaler ĂĽ betale med
kredittkort, men Eli er skeptisk til
ĂĽ oppgi dette over telefon.
Kundesenteret anbefaler henne
da ĂĽ ta turen innom nettsidene
til Vinmonopolet og bestille via
nettbutikken. Eli har ikke gjort
dette før, men tar anbefalingen
og gĂĽr inn pĂĽ
www.vinmonopolet.no.
Andre prioriterte brukargrupper
⢠Mat & vinkobleren â Kristian
â Litt perfeksjonist. Opptatt av at vinen passer til
maten.
Ănsker ĂĽ briljere nĂĽr det kommer gjester.
⢠Butikkhandelsplanleggeren - Finn
â Ansvarlig for ĂĽ organisere innkjøp av drikkevarer til
forspillene.
Ănsker ĂĽ kjøpe noe godt ĂĽ drikke til en romantisk
kveld.
Eli - distriktsbrukaren
Finn - butitikkhandel
Kristian â mat&vin-kobler
pris
Rolf â vineksperten
type
land
drue
Oppgave
⢠Grupper pü to og to
⢠Lag ein persona og typiske scenarier
⢠Tid: 20 minutter
Bilde Navn, alder, bakgrunn
eller Viktigste mĂĽl
tegning Viktigste triggerordâ
Bruksscenario: Kordan ville
vedkommande ønske ü
a) finne vĂĽre nettsider og
b) bruke vĂĽre nettsider?
BRUKSOPPGĂ VER
FORRETNINGSMĂ L
Har du mĂĽlsetningar for nettstaden?
Passive mĂĽlsetningar:
⢠âFĂĽ informasjon ut pĂĽ nettâ (men kvifor?)
⢠âHa vĂĽrt pĂĽ det tørreâ (men kven har nytte av
det?)
⢠âLansere pĂĽ tid og budsjettâ (men kva?)
⢠âTre nyheter i vekaâ (men kvifor?)
⢠âFĂĽ fleire besøk til nettsideneâ (men kven?)
⢠âMeir effektiv arbeidsflytâ (men kordan?)
⢠âFĂŚrre henvendelsarâ (men kva slags
henvendelsar?)
Investeringar skal gi avkastning
⢠Design, utvikling og drift av nettstaden din er
ei investering
⢠Alle investeringar bør gi ein mülbar avkastning
⢠Kva slags âavkastningâ kan nettstaden din gi?
⢠Kva slags grep kan du gjere for ü auke
avkastninga?
⢠Kordan kan du müle avkastninga?
Legg inn relevante Calls to Action
Følg med pü konverteringsraten
Antall ønska handlingar * 100
Antall besøkende (potensielle kundar)
210 salg * 100
= 1,75
12 000 besøk pü sida
Agenda
10.00 â 10.45 Hva er gode brukeropplevelser?
10.45 â 11.15 Kaffepause
11.15 â 12.30 Personas, bruksoppgaver og forretningsmĂĽl
12.30 â 13.30 Lunsj
13.30 â 14.00 Intro til kjernemodellen
14.00 â 15.30 Kjernesider (Gruppearbeid)
15.30 â 16.00 Kaffepause
16.00 â 17.00 Presentasjon og tilbakemeldinger
Agenda
10.00 â 10.45 Hva er gode brukeropplevelser?
10.45 â 11.15 Kaffepause
11.15 â 12.30 Personas, bruksoppgaver og forretningsmĂĽl
12.30 â 13.30 Lunsj
13.30 â 14.00 Intro til kjernemodellen
14.00 â 15.30 Kjernesider (Gruppearbeid)
15.30 â 16.00 Kaffepause
16.00 â 17.00 Presentasjon og tilbakemeldinger
KJERNEMODELLEN
Problemet med forsidefikling
Š Joshua Porter: Home alone? The role of content aggregators
Problemet med isolasjon
http://www.flickr.com/photos/brendio/147026911/
Problemet med informasjonsoverlast
100 Exabytes All info / year
Unique info / yea
All human
12 Exabytes documents
produced last
40.000 years
2000 2001 2002 2003 2004 2005 2006 2007 2008 2009
Š Stuart Park, based on Lesk, Berkeley SIMS, Landauer, EMC
Utnytte Calls 2 Action
Forretningsverdi Sosial verdi
ABOUTNESS
FINDABILITY
Vi mĂĽ starte med kjernen
Design med kjernemodellen
PrioritĂŠr og design kjernen
(Prioritert innhald og funksjonalitet som tilfredsstiller brukarmĂĽl)
Design vegar inn til kjernen
(SEO, fasetter, menyar, søk, RSS, nyheitsbrev â alle mulige midler)
Tilby relevante vegar vidare frĂĽ kjernen
(âCalls to Actionâ som møter brukar-, forretnings- og sosiale mĂĽl)
Kjerne, vegar inn og vegar vidare
Mest optimale informasjonsenhet
Kjernen
Balanserer brukar- og forretningsmĂĽl
Eksempel: Kommune
Kjerne: Tenester , t.d. barnehage
Forside Online søknad
Søk om barnehageplass
Søknadsfristen for hovudopptaket er 1. mars, men ein kan søkja
Internt søk barnehageplass heile üret. Du søkjer plass ved ü bruka vür fullelektroniske
Offline søknad
søknadsportal. Her sender du oss søknaden frü dataskjermen:
n Opplysningane gĂĽr direkte inn i vĂĽrt barnehagesystem
Google/SEO n Du für ei kvittering pü at søknaden er motteken Kontaktpunkter
Søk om barnehageplass
InngĂĽande lenker Skriv ut
Spørsmül & svar
Nyheitsbrev - Kor gamalt mü barnet vera før det kan byrja i barnehage? Send til ein venn
Barnet mü vere fylt 10 münader før det kan begynne i barnehagen.
Det kan søkjast plass i inntil 3 barnehagar.
+ Kva er prioriterte grupper?
Brosjyrer + Kor mykje kostar det?
Kart over barnehagar
+ Finst det barnehagar som er opne pĂĽ kvelden og om natta?
+ Kor lang tid tar det før eg für svar pü søknaden?
RSS + Kan eg klage pü utfallet av søknaden?
Lenker til barnehagar
Barnehagar i Førde
Kommunale barnehagar
Førde familiebarnehage Kyrkjevegen barnehage
Slüttebøen 33 Postboks 6
6800 FĂRDE 6800 FĂRDE
57 83 22 47 916 90 359
Eksempel: Finn
Forside Online søknad
Internt søk Offline søknad
Google/SEO Kontaktpunkter
InngĂĽande lenker Skriv ut
Nyheitsbrev Send til ein venn
Brosjyrer Kart over barnehagar
RSS Lenker til barnehagar
PrioritĂŠr det viktigaste elementet
Tilby støtteinfo etter behov
Enkelt, oppgavefokusert design
Kjernen kan ogsĂĽ vĂŚre distribuert
Kjernevariasjonar
Kjerneside Kjerneflyt Mange kjerner
Distribuert kjerne Kjerne-mal Long Tail-kjerne
Design gode vegar inn til kjernen
Internt søk
Forside
RSS
Opne APIer
Affiliates
Nyheitsbrev
Google/SEO
Vegar vidare: Calls to action
Legg i handlevogn
Kjøp brukt
Legg i ønskeliste
Andre kjøpte...
Se ogsĂĽ...
Gi vurdering
Tagg produktet
Temaer og referanser
Inward Paths
Findability Core
Prioritiering Outward Paths
Verdi
Search Engine Epicenter Design Copy Calls to Action Captology
Optimization Ads as interface Simplicity Getting Persuasion Tunelling
Links Search Marketing Real Adaptive Design Agile Rhetorics Kairos Persuasion
Feeds Newsletters Affiliates Development Flow Paths Conversion Statistics
Information scent Offline Human Information Interaction
ROI Social Design
marketing Site navigation Sensemaking Hub-Spoke Tagging Recommendation
Facets Residue Attraction Tags IA2.0 Microformats Systems Viral Marketing
Taxonomies Site Search Best Semantic Web APIs Personal Social Media Optimization
Bets Link-rich frontpages InfoClud
Alternative bruksomrĂĽder
⢠Enkelt, fleksibelt tankeverktøy
⢠Støtteverktøy for intuitive valg
⢠Flygande start pü konseptfasen
⢠Zoom inn pü konsept utan ü lüse
⢠Prioritering for redesign
⢠Kommunikasjonsverktøy
⢠Flytte fokus frü forsida
Prøv sjølv!
Vegar inn Kjerne Vegar vidare
Og la oss bygge eit vakkert...
... informasjonsunivers!
Agenda
10.00 â 10.45 Hva er gode brukeropplevelser?
10.45 â 11.15 Kaffepause
11.15 â 12.30 Personas, bruksoppgaver og forretningsmĂĽl
12.30 â 13.30 Lunsj
13.30 â 14.00 Intro til kjernemodellen
14.00 â 15.30 Kjernesider (Gruppearbeid)
15.30 â 16.00 Kaffepause
16.00 â 17.00 Presentasjon og tilbakemeldinger
1) Finn mulige kjerner
Gruppeoppgave
⢠Lag en liste over de mest üpenbare
kjernene/kjernesidene for din skule
Ănsket resultat
⢠Opplisting pü A4-ark
Tips!
⢠Hva er det brukeren aller helst vil gjøre?
Tid ⢠Hva skal til for at brukeren blir fornøyd?
⢠Hva er det DU aller helst vil oppnü?
⢠5 minutter ⢠En kjerne kan vÌre en side, men ogsü en flyt,
et element, eller noe helt annet...
2) Velg ut ĂŠn kjerne
Gruppeoppgave
⢠Velg ut Ên av kjernene/kjernesidene
(den dere tror er aller viktigs)
⢠Sett en stor ring rundt denne
⢠Denne skal vi jobbe videre med etterpü
Tips!
⢠Hva er det brukeren aller helst vil gjøre?
Tid ⢠Hva skal til for at brukeren blir fornøyd?
⢠Hva er det DU aller helst vil oppnü?
⢠5 minutter
3) List mulige elementer i kjernen
Gruppeoppgave
⢠List opp alle potensielle elementer i kjernen (eller
pĂĽ kjernesiden om du vil)
Ănsket resultat
⢠Opplisting pü et A4-ark Tips!
⢠Elementer kan f.eks. vÌre tittel,
bilde, kart, søknadsknapp,
spørsmül og svar, kontaktperson,
Tid osv.
⢠Tenk pü büde kjerne-elementer og
⢠5 minutter støtteinformasjon
4) Velg kjerne-elementer
Gruppeoppgave
⢠Velg ut 1-3 kjerneelementer
(det aller, aller viktigste!)
Ănsket resultat
⢠Sett ring rundt kjerne-elementet/-ene i lista
Tips!
⢠Kjerne-elementer er de aller, aller mest
Tid sentrale elementene i kjernen/kjernesiden
⢠Hva stür igjen hvis du mütte fjerne alt unntatt
⢠5 minutter det som absolutt Mà vÌre der?
⢠Det KAN vÌre mer enn ett kjerne-element,
men prøv først ü unngü dette...
5) Velg støtteinformasjon
Gruppeoppgave
⢠Velg ut de elementene som mü vÌre med som
støtteinformasjon
Ănsket resultat
⢠Sett kryss ved støtte-elementene
Tips!
⢠Støtteinformasjon er nødvendig
Tid informasjon som brukeren kan ha
behov for for ü løse sine oppgaver,
⢠5 minutter føle trygghet ved sine valg, osv.
6) Design kjernen!
Gruppeoppgave
⢠Fyll ut brukermül og forretningsmül øverst
⢠Stryk elementer som ikke skal vÌre med
⢠Design kjernen/kjernesiden slik den bør vÌre
Tips!
Tid ⢠Fokuser pü det viktigste kjerneelementet
⢠Det er lov ü delegere design av enkeltelementer
⢠25 minutter innad i gruppen.
⢠Bruk gjerne post-it-lapper som kan limes pü skissen.
⢠Tekst og innhold er ogsü design!
7) Lag gode veier inn til kjernen
Gruppeoppgave
⢠List opp alle mulige veier inn til kjernen dere har
laget, og prioritĂŠr de viktigste
Tips!
Ănsket resultat ⢠Tenk sĂĽ fritt som overhode mulig
⢠Skriv inn veier inn pü for ü finne veier inn til kjernen
⢠Veier inn kan vÌre gjennom intern
pilene til venstre pĂĽ arket navigasjon pĂĽ nettstedet, men ogsĂĽ
gjennom andre nettsteder, offline
kanaler, osv.
Tid ⢠Tenk pü hvor brukeren befinner seg
⢠15 minutter (fysisk, mentalt og virtuelt) og
hvordan veien derfra kan lede til
din kjerne
8) Lag gode veier videre fra kjernen
Gruppeoppgave
⢠List opp alle mulige veier videre fra kjernen utfra
brukermĂĽl og forretningsmĂĽl
⢠PrioritÊr de viktigste Tips!
⢠NĂĽr brukeren har fĂĽtt âsvar
pĂĽ sine spørsmĂĽlâ eller âløst
Ănsket resultat sitt problemâ, hva er da
⢠Veier videre til høyre pü arket naturlige veier videre?
⢠Hva er det vi som avsendere
ønsker at brukeren skal
gjøre?
Tid ⢠Har vüre veier videre en
⢠15 minutter form for relevans til der
brukeren er nĂĽ?
Agenda
10.00 â 10.45 Hva er gode brukeropplevelser?
10.45 â 11.15 Kaffepause
11.15 â 12.30 Personas, bruksoppgaver og forretningsmĂĽl
12.30 â 13.30 Lunsj
13.30 â 14.00 Intro til kjernemodellen
14.00 â 15.30 Kjernesider (Gruppearbeid)
15.30 â 16.00 Kaffepause
16.00 â 17.00 Presentasjon og tilbakemeldinger
Agenda
10.00 â 10.45 Hva er gode brukeropplevelser?
10.45 â 11.15 Kaffepause
11.15 â 12.30 Personas, bruksoppgaver og forretningsmĂĽl
12.30 â 13.30 Lunsj
13.30 â 14.00 Intro til kjernemodellen
14.00 â 15.30 Kjernesider (Gruppearbeid)
15.30 â 16.00 Kaffepause
16.00 â 17.00 Presentasjon og tilbakemeldinger
9) Vi presenterer for hverandre!
⢠Vi tar runden fra bord til bord og ser hva de
ulike gruppen har kommet fram til
Oppsummering
Uten kjernemodell
⢠Hvor langt ville vi kommet uten?
⢠Har vi fütt andre idÊer nü ?
⢠Hvor ville vi ha begynt uten?
⢠Gjenstür fortsatt mye arbeid med ü detaljere
innhold, navigasjon og design
⢠MEN vi har satt fokus pü det viktigste!
0 comments
Post a comment