brugervenlighed på vestjysk, dm10

95
Brugervenlighed på jysk

Upload: nicolaj-kirkgaard-nielsen

Post on 12-Jul-2015

268 views

Category:

Design


1 download

TRANSCRIPT

Page 1: Brugervenlighed på Vestjysk, DM10

Brugervenlighed

på jysk

Page 2: Brugervenlighed på Vestjysk, DM10

Tommelfingernegle,giraffer oggamle damer

Page 3: Brugervenlighed på Vestjysk, DM10

Nicolaj Kirkgaard Nielsen@kinkobal

Page 4: Brugervenlighed på Vestjysk, DM10
Page 5: Brugervenlighed på Vestjysk, DM10
Page 6: Brugervenlighed på Vestjysk, DM10

Brugervenligheds-

frontend-

søgemaskineoptimerings-

analytics-

udvikler

Page 7: Brugervenlighed på Vestjysk, DM10

Webudvikler

Page 8: Brugervenlighed på Vestjysk, DM10
Page 9: Brugervenlighed på Vestjysk, DM10
Page 10: Brugervenlighed på Vestjysk, DM10
Page 11: Brugervenlighed på Vestjysk, DM10
Page 12: Brugervenlighed på Vestjysk, DM10
Page 13: Brugervenlighed på Vestjysk, DM10

I see usability...It’s everywhere!

Page 14: Brugervenlighed på Vestjysk, DM10
Page 15: Brugervenlighed på Vestjysk, DM10
Page 16: Brugervenlighed på Vestjysk, DM10
Page 17: Brugervenlighed på Vestjysk, DM10
Page 18: Brugervenlighed på Vestjysk, DM10

Du burde virkelig tjecke

Jakob Nielsen ud!

Er det ikke ham med de blå og

understregede links?

Page 19: Brugervenlighed på Vestjysk, DM10

PrioritizingWeb UsabilityJakob Nielsen og Hoa Loranger

Page 20: Brugervenlighed på Vestjysk, DM10

Usability guidelines

Tracking (analytics)

Usability testing

Alle brugere påAlle sites

Alle brugere påÉt site

Én bruger påÉt site

You are here

Page 21: Brugervenlighed på Vestjysk, DM10

Testing er meget vigtigt

Page 22: Brugervenlighed på Vestjysk, DM10

Ten years ago, the Web wasexciting to people. Today it’s routine. […] Users are getting less tolerant of difficult sites, so everydesign flaw means lost business.Jakob Nielsen & Hoa LorangerPrioritizing Web Usability

Page 23: Brugervenlighed på Vestjysk, DM10
Page 24: Brugervenlighed på Vestjysk, DM10

#0044CC

Page 25: Brugervenlighed på Vestjysk, DM10

80-100 mio. dollars

Page 26: Brugervenlighed på Vestjysk, DM10

Men:”Du skal teste godt mod godt”

Benjamin Gundgaard, interview med Thomas Rosenstand

Page 27: Brugervenlighed på Vestjysk, DM10

1,20% 1,25% 1,70%

A B C?

Page 28: Brugervenlighed på Vestjysk, DM10

• Informerede beslutninger

• Indgående kendskab til målgruppen

• Skarpt definerede mål

• Best practices, lavt hængende

• Godt design

Page 29: Brugervenlighed på Vestjysk, DM10

Universelle faktoreralle vores brugere er mennesker

Page 30: Brugervenlighed på Vestjysk, DM10

Vores syn er værre end vi tror

Page 31: Brugervenlighed på Vestjysk, DM10

Video: Eye tracking

Page 32: Brugervenlighed på Vestjysk, DM10
Page 33: Brugervenlighed på Vestjysk, DM10
Page 34: Brugervenlighed på Vestjysk, DM10

Tommelfingerregelen

Page 35: Brugervenlighed på Vestjysk, DM10
Page 36: Brugervenlighed på Vestjysk, DM10
Page 37: Brugervenlighed på Vestjysk, DM10
Page 38: Brugervenlighed på Vestjysk, DM10
Page 39: Brugervenlighed på Vestjysk, DM10
Page 40: Brugervenlighed på Vestjysk, DM10
Page 41: Brugervenlighed på Vestjysk, DM10
Page 42: Brugervenlighed på Vestjysk, DM10

Formular layout

Page 43: Brugervenlighed på Vestjysk, DM10
Page 44: Brugervenlighed på Vestjysk, DM10
Page 45: Brugervenlighed på Vestjysk, DM10
Page 46: Brugervenlighed på Vestjysk, DM10
Page 47: Brugervenlighed på Vestjysk, DM10

• Objektiv i DX-format med 11,1x zoom og en brændvidde fra 18 til 200 mm (ækvivalent med 35 mm: 27-300 mm).

• Stabiliseringssystem til vibrationsreduktionion II (VR II) med indstillingerne Normal og Aktiv. Betyder mere fleksibel håndholdt optagelse og gør det muligt at bruge lukkertider, der er op til fire stop længere.

• 2 ED-glaselementer og 3 asfæriske linseelementer sikrer høj opløsning og suveræn kontrast.

• SWM (Silent Wave Motor) betyder hurtig og næsten lydløs autofokus. • M/A-indstilling gør det muligt at skifte hurtigt mellem autofokus og

manuelt fokus. • 7-blads afrundet blændeåbning får elementer, der ikke er i fokus, til at

smelte sammen, så der opnås naturligt udseende baggrunde. • Nikons avancerede Super Integrated Coating (SIC) reducerer ghosting og

slørdannelse og sikrer en fremragende farvegengivelse.

Page 48: Brugervenlighed på Vestjysk, DM10

• DX-format objektiv• Zoom op til 11,1x • Brændvidde fra 18 til 200 mm (svarer til 27-300 i 35mm).• Stabiliseringssystem (VR II) muliggør op til fire stop længere

lukkertider • Høj opløsning og kontrast med 2 ED-glaselementer og 3 asfæriske

linseelementer• Lydsvag SWM motor til autofokus• Autofokus og manuel fokus skiftes hurtigt på siden af objektivet• Slørring af baggrunde ser meget naturlig ud, pga. 7 blads afrundet

blændeåbning. • Reduceret ghosting og bedre farvegengivelse via Super Integrated

Coating (SIC)teknologi

Page 49: Brugervenlighed på Vestjysk, DM10

Tekst

• Kort og præcist

• Indholdsgivende ord først

• Ét koncept pr. linie

• Brug

– Overskrifter

– Bulletpoints

– Fremhævninger

Page 50: Brugervenlighed på Vestjysk, DM10

Vi ser bevægelsermed det samme

Page 51: Brugervenlighed på Vestjysk, DM10
Page 52: Brugervenlighed på Vestjysk, DM10
Page 53: Brugervenlighed på Vestjysk, DM10
Page 54: Brugervenlighed på Vestjysk, DM10
Page 55: Brugervenlighed på Vestjysk, DM10

Tag højde for øjets fysiologi

Page 56: Brugervenlighed på Vestjysk, DM10
Page 57: Brugervenlighed på Vestjysk, DM10

Top tasks

Page 58: Brugervenlighed på Vestjysk, DM10

Hvad er brugernesvigtigste mål på sitet?

Page 59: Brugervenlighed på Vestjysk, DM10

Kunde-centrisk, ikke firma-centrisk

Page 60: Brugervenlighed på Vestjysk, DM10

Hvad er der galt her:

Page 61: Brugervenlighed på Vestjysk, DM10
Page 62: Brugervenlighed på Vestjysk, DM10

Pareto princippetfor many events, roughly 80% of the effects come from 20% of the causes.

Frit fra Wikipedia, http://en.wikipedia.org/wiki/Pareto_principle

Page 63: Brugervenlighed på Vestjysk, DM10
Page 64: Brugervenlighed på Vestjysk, DM10

Vigtigste brugermål

2% af siderneUdgør 20% af sidevisningerne

Long neck

Page 65: Brugervenlighed på Vestjysk, DM10

The key difference between commerce and e-commerce is that commerce is selling with people and e-commerce is selling with content. Gerry McGovern

Page 66: Brugervenlighed på Vestjysk, DM10

• Kommunikerer dit indhold direkte til dine brugere?

– Check dette tit

• Ryd regelmæssigt ud i råddent indhold

– En forældet side er værre end ingen side

Page 67: Brugervenlighed på Vestjysk, DM10

Hvordan lærer vi brugerne at kende?

Page 68: Brugervenlighed på Vestjysk, DM10

A day in the lifeof a usability report

Page 69: Brugervenlighed på Vestjysk, DM10

Task analysis

Surveys

User testing

Heuristik

Fokus grupper

Ja, mand! Det er fantastisk!

Wow!

Usability rapport

Manager

Skuffe

5 minutter senere

Page 70: Brugervenlighed på Vestjysk, DM10

EmpatiEvnen til at genkende og forstå andres følelser. Det beskrives ofte som evnen til at sætte sig i andres sted. I empatien føler man sig ind i den anden.

Frit fra Wikipedia, http://da.wikipedia.org/wiki/Empati

Page 71: Brugervenlighed på Vestjysk, DM10

Persona

Page 72: Brugervenlighed på Vestjysk, DM10

Hjemmegående husmødre mellem 35 og 55

Bertha (47 år) Hjemmegående husmorHandler i Irma etc.

Page 73: Brugervenlighed på Vestjysk, DM10

Personas:brugervenlig brugervenlighed

Page 74: Brugervenlighed på Vestjysk, DM10

Hmm...

Men vil Lisa

synes om det?

... og så skal

der være racerbiler!

Page 75: Brugervenlighed på Vestjysk, DM10

Enarmede tyveknægteog gamle damer

Page 76: Brugervenlighed på Vestjysk, DM10
Page 77: Brugervenlighed på Vestjysk, DM10

BrugervenlighedBrugeroplevelse

Page 78: Brugervenlighed på Vestjysk, DM10
Page 79: Brugervenlighed på Vestjysk, DM10

En brugervenlig spillemaskine

Page 80: Brugervenlighed på Vestjysk, DM10

En brugervenlig spillemaskine

Page 81: Brugervenlighed på Vestjysk, DM10
Page 82: Brugervenlighed på Vestjysk, DM10

Søgeresultat

Klik på mit link

Landingsside

Klik på et produkt

Produktside

Læg produktet i kurven

Indkøbskurv

Page 83: Brugervenlighed på Vestjysk, DM10

Søgeresultat

Klik på mit link

Landingsside

Klik på et produkt

Produktside

Læg produktet i kurven

Indkøbskurv

Off-site On-site

Page 84: Brugervenlighed på Vestjysk, DM10

Hækkeløb

• Lad aldrig en bruger strande på en side

• Hav altid en primær CTA på hver side

• Vær opmærksom på hvert skridt i brugerens flow

• Tag højde for trafik til undersider

Page 85: Brugervenlighed på Vestjysk, DM10

Så husk:

Page 86: Brugervenlighed på Vestjysk, DM10

Design til øjettommelfinger-regelen

Page 87: Brugervenlighed på Vestjysk, DM10

Hav fokus på

top tasks

Page 88: Brugervenlighed på Vestjysk, DM10

Design brugerens

oplevelse

Page 89: Brugervenlighed på Vestjysk, DM10

Eller kort sagt:

Page 90: Brugervenlighed på Vestjysk, DM10

Tommelfingernegle,giraffer oggamle damer

Page 91: Brugervenlighed på Vestjysk, DM10

Tak for jeres opmærksomhed

[email protected]

www.twitter.com/kinkobal

Page 92: Brugervenlighed på Vestjysk, DM10

PrioritizingWeb UsabilityJakob Nielsen og Hoa Loranger

Page 93: Brugervenlighed på Vestjysk, DM10

Designing with the Mind in MindJeff Johnson

Page 94: Brugervenlighed på Vestjysk, DM10

The Stranger’s Long NeckGerry McGovern

Page 95: Brugervenlighed på Vestjysk, DM10

Don’t Make me ThinkSteve Krug