mihkel jäätma-eye-tracking ja veebidisain
DESCRIPTION
Realeyes 2008TRANSCRIPT
2008
EYE-TRACKING & VEEBIDISAIN
KAVA
Miks eye-tracking?
Kuidas?
Mõned näited
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN
MIKS?
www.realeyes.it
Tulus investeering
Protsesside optimeerimine
Veebi potentsiaali realiseerimine
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
“Business intelligence”
Kuidas leht töötab kasutaja vaatenurgast
Mis toimub enne klikkimist
Benchmarking
EYE-TRACKING &
VEEBIDISAIN
MIKS?
www.realeyes.it
Kommunikatsioon
Kasutajad - Disainerid
Juhid - Disainerid
EYE-TRACKING &
VEEBIDISAIN
MIKS?
The email on the left was a
Christmas campaign of a
large retailer.
We eye-tracked this email
to see where people look most on the email.
Each color represents different areas of the web page where people could
click.
We measured how much
attention each area recieved and mapped it
against the actual email campaign results.
www.realeyes.it
Sisupaigutus
Tähtsad asjad nähtavale kohale!
EYE-TRACKING &
VEEBIDISAIN
MIKS?
www.realeyes.it
Disainiotsused
Vali lahendus mis annab parimaid tulemusi
Objektiivsed numbrid, mitte arvamused
Väldi riske mida pole mõtet võtta
EYE-TRACKING &
VEEBIDISAIN
MIKS?
KUIDAS?
Eye-tracking monitorid jälgivad infrapuna peegeldusi
inimeste pupillidelt.
EYE-TRACKING &
VEEBIDISAIN
KUIDAS?
EYE-TRACKING &
VEEBIDISAIN
Videod ei lingi siit – palun küsi link [email protected] kui soovid videot
KUIDAS?
See oli ainult 1 inimene
Eye-tracking analüüs vajab korralikku valimi suurust.
50 inimese andmete põhjal on tulemus juba usaldusväärne.
Miks 50?
Microsoft
PowerPoint Presentation
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
Need 50 inimest peavad olema kliendi sihtgrupist.
Realeyes on loonud võrgustiku kohtadest,
kus testimisi on võimalik läbi viia:
kohvikud
raamatukogud
kaubanduskeskused
kontorid
KUIDAS?
EYE-TRACKING &
VEEBIDISAIN
MILLAL?
www.realeyes.it
Nüüd ja praeguet näha kuidas leht tegelikult töötab
� pisikesed muudatused võivad tuua suuri tulemusi
� kas on õppida konkurentidelt? testi kuidas nende lehed toimivad
� alusta progressi ja loo alus selle mõõtmiseks tulevikus
Case study:
EYE-TRACKING &
VEEBIDISAIN
MILLAL?
www.realeyes.it
Disainimise käigus et leida parim lahendus
� tee hästi informeeritud ja ratsionaalne otsus
� hoia kokku aega/raha ja testi .jpg pilte erinevatest disainidest
� väldi uue disainiga kaasnevaid mittevajalikke riske
Case study:
EYE-TRACKING &
VEEBIDISAIN
MILLAL?
www.realeyes.it
Pärast uue disaini kasutuselevõttuet optimeerida uut disaini
� hoia kinni tähtsatest tähtaegadest
� anna viimane lihv testides veebi mis on juba ‘live’
Case study:
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
Tekst vs pilt
“F-shape”
“Banner blindness”
MÕNED “MÜÜDID”
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
TEKSTvs
PILT
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
TEKSTvs
PILT
EYE-TRACKING &
VEEBIDISAIN
TEKSTvs
PILT
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN
Following heatcast shows second by second
where people’s eyes were looking while they
searched for a digital camera.
This heatcast aggregates data of 50 people.
TEKSTvs
PILTHEA NÄIDE
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN
Following heatcast shows second by second where people’s eyes were looking while they
searched for a game that interested them.
This heatcast aggregates data of 53 people.
F-SHAPEMITTE ALATI
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN
BANNERBLINDNESS
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN
BANNERBLINDNESS
MITTE ALATI
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN
Kliendi copyright
www.realeyes.it
Iga disain, tegevus ja sihtgrupp on erinev.
Testi, testi ja testi
JÄRELDUS:
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
DISAINI “MÕÕTMINE”
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
DISAINI “MÕÕTMINE”
Hansapank Nordea Sampo SEBSuccess rate (%) 66% 88% 97% 80%
Time to completion (s) 13,1 10,0 7,6 9,5
View-to-click (s) 10,5 6,1 6,5 4,6
Visual value of targets (%) 29% 65% 71% 72%
Average eye fixation (ms) 319 367 353 373
Ease of use (10 = Easy) 6,2 8,2 8,0 7,4
-6 1 2 3
EYE-TRACKING &
VEEBIDISAIN
www.realeyes.it
DISAINI “MÕÕTMINE”
EYE-TRACKING &
VEEBIDISAIN
EMAILI NÄIDE
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN
Important areas are seen first and visibility is high....
TIME TO FIRST FIXATION
10,6
13,4
14,9
9,08,88,47,9
7,1
5,6
2,11,62,2 2,2
3,23,9
54%
67%
88%
71%
81%
96%
87%
77%81%
90%
65%
94%
75%
96%
29%
0
5
10
15
20
Gift
Voucher
Tagline Logo CampaignClaim Trial Intro Content 1 Worth How? Content 2 Content 3 Why? Forward
friends
What? Footer
Sec
on
ds
0%
10%
20%
30%
40%
50%
60%
70%
80%
90%
100%
Time to first fixation Visibility
... but the overall quality of the attention is very low: LACK OF FOCUS!
AVERAGE FIXATION LENGTH
291
336344
244
320
266
282281
239
270275
272
305
244
255
200
250
300
350
400
Logo Tagline Intro Gift
Voucher
Worth Campaign Claim Trial Content 1 Content 2 Content 3 Forward
friends
How? Why? What? Footer
Mill
isec
on
ds
200
220
240
260
280
300
320
340
360
380
400
Average fixation = 280 milliseconds
“Newsletter” av.
394 milliseconds
... but the overall quality of the attention is very low:
AVERAGE FIXATION LENGTH
291
336344
244
320
266
282281
239
270275
272
305
244
255
200
250
300
350
400
Logo Tagline Intro Gift
Voucher
Worth Campaign Claim Trial Content 1 Content 2 Content 3 Forward
friends
How? Why? What? Footer
Mill
isec
on
ds
200
220
240
260
280
300
320
340
360
380
400
Average fixation = 280 milliseconds
Most engaging
elements are
“How” & “What”
People cnfused?
Low ease of use score and high failure rate are a concern:
46% of people hit the time out and did not click anywhere
Average ease of use score was 58%
WHY?
Too much copy?
Too many different fonts?
Content areas were not properly read: last slide
Too little contrast between elements?
People switch back anc forth between key elements
Following heatcast shows second by second where people’s eyes were looking while they
studied the email for interesting content.
This heatcast aggregates data of 54 people.
Same in Newsletter: 20%
Same in Newsletter: 72%
KOKKUVÕTE
www.realeyes.it
� ...kuidas disain tegelikult toimib
� ...kuidas saavutada paremaid tulemusi
EYE-TRACKING &
VEEBIDISAIN
Eye-tracking näitab
TÄNUD AJA EEST!!!
www.realeyes.it
EYE-TRACKING &
VEEBIDISAIN