Eye Tracking - All will be revealed


Published on

In February 2012 Annika Naschitzki presented to both Wellington and Auckland audiences about Optimal Usability's new eye tracker, and what it can do. Here is the presentation, however if you would like Anni to come into your organisation to do the presentation please get in touch: anni@optimalusability.com

  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Sometimes that’s in car
  • UT gives you + et gives you -> more comprehensive understanding of their behaviouras close as you get to evidential data in user research
  • Eye tracking is the eye-cing on the cake
  • Eye tracking can seem like something veeeery complicated
  • But actually, it’s not that complicated. It is a technique that is added to user testing or that can work as a standalone study. Practically, you’re using a different monitor. It adds a new dimension to understand how your users perceive a website.
  • The most powerful receptors in our eyes are called fovea, they live in the pupil. The pupil must focus on a point in order for the fovea to perceive colour, faces, writing, etc. That is called a ‘fixation’. Whenthe pupil is in motion, its called a ‘saccade’. In this phase, visual perception is unlikely or even impossible.
  • Our eyes go through several fixations every second (even if we think we stare at a point). Our brain then puts together the information layer by layer (e.g. colour, texture, depth). This is how our brain creates an experience.Eye Tracking measures the speed of the pupil and can thus detect when a fixation is happening!
  • Fixations are linked to attention! ‘You cannot move your eyes without moving your attention’ That is why we can make statements about what users see, based on the movement of our eyes This does NOT mean that they definitely perceived that element! (e.g. Jared Spool’s ‘Ketchup bottle problem’) But it is fair to say that elements that draw visual attention have a higher change of being perceived (consciously or subconsciously).
  • There’s a layer in our eye that reflects infrared light. That’s why your eyes can look red when you take a picture.
  • The monitor uses infrared light to make the pupils of the person sitting in front of it light up and thus become detectable.And by using formulas way over my knowledge of mathematics, the eye tracking programme can calculate the speed of the pupil and what it is focussed on.
  • Using a monitor like that, the participant can move her/his head freely in a large area, the data accuracy is not lowered by natural head movement.
  • In order totake eye tracking research to new fields of application, mobile solutions were created. The development process went through a couple more of less clunky stages.
  • Today mobile eye trackers are light glasses like these. They are connected to a recorder in a belt, so you can freely walk around and explore physical spaces.
  • There’s two main ways to visualise the results of eye tracking. Heatmapsshows the accumulated data of all participants. Gaze plot ashows the ‘visual path’ that individual participants took. Each bubble stands for a fixation. There’s other ways of analysing data, but they are in the form of tables. When analysing, we’ll always look at a number of different forms of data. I’ll talk more about what you can read from the data later on. Before, I want to give you some examples where eye tracking is used.
  • Originally, eye tracking technology was used to help people who are paralysed. This man is a famous English graffiti artist known as Tempt1. He was paralysed in an accident. With a programme called ‘Eye Writer’, so Tempt1 could continue to draw, using just his eyes. On the left is a 9 years old who is using an eye tracking device to select pre-programmed phrases, and she can type her own words as well.
  • If this catches on, we may not even need to hold a controller in our hand or jump around in front of a Kinect or Wee if we want to get our game on.
  • The biggest fields of research are Psychology, Sociology and the Neurosciences. In this example, eye tracking is combined with EEG – a technique to measure activity in different areas of the brain. Psychologists try to understand human perception, thought processes and emotional responses. So, this kind of research improves the conclusions we can draw from eye tracking data.
  • And there are other fields of research as well…
  • Eye tracking is used to learn more about how our closest relatives in the animal kingdom perceive their surroundings and how they behave.
  • This is a study that tobii did with a chimpanzee…
  • This is a case study by tobii: The gaze plot shows face scanning patterns on human and chimpanzee faces. Chimpanzee focus on the mouth and sometimes at the eyes. Humans are mainly focussed on the eyes. With the exception of the smile.
  • Eye Tracking lets us know where the user’s visual attention is drawn to, therefore, it is useful to:
  • With thisspecial mounted eye tracking cameras that allow user testing of mobile phones.
  • Tablets can be tested as well. This picture is a nice example from Miratech. The guys compared newspaper reading behaviour on an iPad and on printed paper. They showed that iPad users skipped more details. Plus, participants remembered articles better when reading it on printed paper.
  • You can also test the design of packages. These are all different wines, you may normally test a number of different package designs that you have developed.
  • Even better is to test packages in an actual store. Again, you could work with a number of design variations. You can see which design drew more attention.
  • Another thing you can test in an actual shop is the placement of your product on the shelf – in what position does it draw more attention?
  • And finally, you can test banners and any kind of extra advertising that you can place in a supermarket and see whether shoppers actually notice it and whether it makes them more likely to buy your product.
  • Let’s just recapture… User testing can give you…
  • And if you add eye tracking to this, you can get:There’s two typical scenarios for doing eye tracking and user testing studies. The first one is:
  • The first one is used when you just want to know where your website is at.
  • These kind of studies are very much alike ‘normal’ user tests. You’ll use a similar number of participants, 6-12, and you’ll use the eye tracking data to understand the user’s general behaviour. It helps you understand what people miss and helps the facilitator ask the right kind of questions (example…). It’s good if you have some specific design questions you want to answer along the way.
  • The 2 Degrees homepage
  • The visual attention on the 2degrees homepage is evenly distributed between all main elements within the first 20 seconds. Participants may therefore pay attention to the central message, as well as to the navigation options and the option boxes at the bottom.It is likely that users find it easy to overview their options on the homepage and navigate from here.
  • The participant’s gaze moves back and forth between the top, centre and the bottom of the homepage– which is not problematic when perceiving pictures, but not ideal for reading messages .The main navigation and the three boxes at the bottom receive a lot of long fixations. It is likely the options were consciously read.Overall, the visual design of this homepage appears to be working well. The next step would be to check how the visual attention works when the participants would actually perform a task, e.g. look for a certain item. We’d see how functional the design actually is and by listening to the comments and reactions of participants during the task, we’d also learn about the subjective perception of the site.
  • This is a great example of different user behaviour….
  • Here’s another example, the OLD Telstra Clear website.Ask: What do you reckon will draw attention on this page?
  • Ask: Anything stands out? What do you think that box is? “If you’re a customer with a non-technical query and you are having trouble getting through to us on the phone, please click here to email us, we’ll get back to you within 2 business days”.
  • When testing designs, you will use a more quantitative approach to user testing: More participants (10-25), short sessions, just a couple of short tasks, no or limited interaction with the facilitator, time-limit for tasks. So you give the participants a context and then you just collect eye tracking data.Ideally you test a couple of different design versions and you’re testing which design is more effective in whatever it is supposed to achieve.
  • And these are some examples of what kind of questions you could answer with eye tracking. In fact, eye tracking will be most helpful if you have clear questions that you need answered rather than ‘how is this design stage doing’. However, it is possible to just give your design status a general check.
  • Running tests like that, there’s some principles that could be uncovered
  • The face effect – as you have seen before at the monkey eye tracking results – human attention is drawn by faces and by eyes in particular.
  • In this example we can see, a number of physical features draw the attention of people looking at the statue of David – but the centre of attention is on David’s face!
  • This effect can be used to direct attention, for example on an ad. Here two different versions of an ad were eye-tracked. In this case, the model is looking directly at the viewer.
  • And in this version, the model looks at the product, forming a straight line between her eye and the product name on the package.
  • Ask: What can you see in comparison?
  • This is an greatstudy done by our friend James Breeze from ‘Usable World’ in Australia. Same effect – the baby looking at you captures all the attention, but when its looking at the ad message… It’s a bit like when you’re point a finger at something…
  • Here’s an example of the opposite: The face catches the attention, the key blurbs get some attention as well, but it’s very unlikely that anyone read the name of the company or their contact data. So clearly, you should all go to work after this and pop lots of babies on your websites and ads, staring at your key content.
  • Dropping the F-bomb now…
  • In 2006, Nielsen Research blogged about their observation, that content on websites is read following an F-shaped pattern… The term ‘F-design’ has caught on ever since.
  • This is what the F-design means. This principle is considered standard for most content writing today – and it was uncovered by eye tracking.
  • Colours is another important topic. Eye tracking research has shown that saturated colours draw the user’s attention best.
  • This is NOT a joke, this is the website of an actual business. This may not be the best advice…
  • This is a better example. Saturated colours, high contrast.
  • I think many of you made the experience that user testing can give you amazing insights into what your users want and need. And that hopefully helped you improve the user experience of your service – which ultimately benefits your business or organisation.What I hope to have shown you today is what kind of deep and sometimes surprising insights eye tracking can provide. Especially when its combined with user testing.
  • Eye Tracking - All will be revealed

    1. 1. Eye trackingAll will be revealed.Annika Naschitzki & Leif Roy
    2. 2. We’ve run over 4500user tests
    3. 3. Most often on screen
    4. 4. Frequently on paper
    5. 5. On the move
    6. 6. In the work place
    7. 7. In the air
    8. 8. Low fidelity
    9. 9. Medium fidelity
    10. 10. Medium fidelity
    11. 11. High fidelity
    12. 12. The value of user testingUser testing gives you: Insight into your user’s actual behaviour. Understanding of your user’s attitudes, feelings, and motivations. Understanding of what is and isn’t working in your design. Subjective or anecdotal data.
    13. 13. What is eye tracking?
    14. 14. Vision GmbH
    15. 15. Actually, it‟s not that complicated usercentric
    16. 16. How does it work?
    17. 17. How does it work? in here, somewhere…
    18. 18. How we „look‟ Fixation Saccade
    19. 19. So, what do these fixations tell us?“You cannot move youreyes without movingattention.”Eye tracking can tell uswhich elementsparticipants pay visualattention to, e.g. on awebsite.
    20. 20. But how can a monitor tell what I look at?!
    21. 21. … that‟s why!
    22. 22. What the eye tracker sees tobii
    23. 23. Monitors - No strings attached tobii
    24. 24. Mobile eye tracking
    25. 25. Mobile eye tracking tobii
    26. 26. The results: Heatmaps & Gazeplots SMI
    27. 27. Where eye tracking is used
    28. 28. Eye tracking as an aid tobiithecreatorsproject.com KOMO News eyewriter.org
    29. 29. „Gaming by Gaze‟ tobii gizmodo.com
    30. 30. Psychology & Neurosciences
    31. 31. .. and more exotic fields University of Indiana
    32. 32. Behavioural research tobii tobii
    33. 33. Behavioural research
    34. 34. Perception of faces
    35. 35. User research
    36. 36. Eye tracking in user research Answer questions such as: „Do users see/notice this?‟ Evaluate the effectiveness of a design Visualise what the user‟s attention is drawn by As a tool for observers, e.g. of a user test
    37. 37. Mobile phones simplyusability.com miratech.com
    38. 38. Tablets miratech.com
    39. 39. Package design visuality-group.co.uk
    40. 40. Packaging in the store eyetracking.me
    41. 41. Point of Sale – Shelf tests visuality-group.co.uk rwconnect.esomar.org
    42. 42. Point of Sale – Ads and banners visuality-group.co.uk
    43. 43. Eye tracking and UX
    44. 44. User testingYou run user tests to get: Insight into your user’s actual behaviour. Understanding of your user’s attitudes, feelings, and motivations. Understanding of what is and isn’t working in your design. Subjective, or anecdotal, data.
    45. 45. Why use eye tracking in UXYou add eye tracking to get: Deeper understanding of user’s actual behaviour. Insight into user’s subconscious or instinctive behaviour. Better understanding of why your design does or doesn’t work. Evidential (quantitative) data
    46. 46. How is my website doing?
    47. 47. Purpose: Kick the tires
    48. 48. User testing with eye tracking
    49. 49. An example: How is my site doing?
    50. 50. An example: How is my site doing?
    51. 51. An example: How is my site doing?
    52. 52. Animations – it‟s alive!
    53. 53. Animations – it‟s alive!
    54. 54. Differences in behaviour
    55. 55. And our favourite example…
    56. 56. Our favourite example…
    57. 57. Inform your design
    58. 58. Purpose: Develop and design
    59. 59. Purpose: Develop and design Where should the ‘Pay now’ button be? Will users noticethis stuff if I put it down here?
    60. 60. Design principles
    61. 61. The Face effect
    62. 62. The Face effect bunnyfoot
    63. 63. Using the Face effect humanfactors.com
    64. 64. Using the Face effect humanfactors.com
    65. 65. Ways to focus attention humanfactors.com
    66. 66. Ways to focus attention usableworld.com.au
    67. 67. Ways to focus attention
    68. 68. The „F-Design‟
    69. 69. The “F-Design” Nielsen Research
    70. 70. The “F-Design” tutsplus.com
    71. 71. Talking about colours…
    72. 72. Using saturated colours…
    73. 73. Using saturated colours…
    74. 74. Using saturated colours…
    75. 75. The bottom line…
    76. 76. User testing + eye tracking
    77. 77. a more complete= understanding of your users experience.
    78. 78. Thank you.Annika Naschitzki & Leif Roy