Reading: 3'. How to defuse a mental model with an appropriate design witht he help of user-testing?

1. The modal of the property page
How to defuse a mental model with an
appropriate design?
Reading 6me: 3’

2. This document tells the concrete case
of an improvement of a graphical interface of Immoweb
thanks to user tes6ng.
Before being effec6ve in terms of business results,
ergonomics is first and foremost a learning of human behavior,
oCen surprising and source of crea6vity.
Good reading.
Diego
Diego de Wau6er - 12/2017 2
FOREWORDS

3. INTRODUCTION
In early 2017, Immoweb is working on a new version of the property page of its
website. The 'modal' (window superimposed on the property page) with pictures
is enriched with contact buXons, 6tle, address and tabs that can display a video,
a virtual tour and a map architect. The gallery is moved to the boXom of the
'modal'.
A new layout for pictures
Diego de Wau6er- 12/2017 3
Old version
New version A

4. REALITY CHECK 1
The results of the user tests are worrying: aCer clicking in the pictures
gallery, half of the users leave the 'modal' without clicking on the top tab
'Plan'. The other half finds it, but with some delay.
'Where is the architecture plan?'
New version A

5. REALITY CHECK 1
The analysis of the eye-tracking data shows that the users in a situa6on of
failure did not even look at the upper tabs.
Observa6ons in eye-tracking: failures
Diego de Wau6er- 12/2017 5
Sc: Tobii - Gaze Plot – 2 users Sc: Tobii – Heat Map – 2 users Sc: Tobii - Cluster – 2 users

6. REALITY CHECK 1
By comparison, here is the data of users in a successful situa6on.
Observa6ons in eye-tracking: success
Diego de Wau6er- 12/2017 6
Sc: Tobii - Gaze Plot – 2 users Sc: Tobii – Heat Map – 2 users Sc: Tobii - Cluster – 2 users

7. REALITY CHECK 1
What happened? In the current version of the site, users are used to find a
possible architect's plan at the end of the pictures gallery. Not finding it, half
of the users naturally leave the 'modal' without further inspec6on.
In other words, users behave according to the mental model they have
constructed during successive uses of the current site. And the new design
fails to thwart this acquired mental model.
In addi6on, the posi6on of the tabs is not ideal: depending on the posi6on of
the subject rela6ve to the screen, viewing the top of this screen requires
addi6onal physical effort to raise the eyes.
A bit of theory
Diego de Wau6er- 12/2017 7

8. REALITY CHECK 1
Similarly, by moving the gallery down in the new model, the user is less likely
to no6ce the upper tabs by means of peripheral vision than with a nearby
gallery to the leC of the 'modal'.
A bit of theory
Diego de Wau6er- 12/2017 8
Old version New version A
Sce: Gweezy Sce: Gweezy

9. CONCEPTION
To deconstruct the mental model, we move the tabs to the right under the
exit cross. In this way, we increase the chances that the user will no6ce tabs
with the peripheral vision when he decides to leave the 'modal'.
In addi6on, the gallery remains on the leC to maximize the size of the central
photo.
Short-circuit the mental model
Diego de Wau6er - Immoweb - 12/2017 9
New version B

10. CONCEPTION
Vision périphérique
Diego de Wau6er- 12/2017 10
Nouvelle version B
Sce: Gweezy

11. REALITY CHECK 2
The results of the following user tests are excellent: aCer looking in vain in the
gallery, users quickly find the plan.
In addi6on, these changes do not affect the other test cases: the situa6on and
the contact are also found quickly.
'Where is the architecture plan?'
Diego de Wau6er- 12/2017 11
Version A Version B

12. REALITY CHECK 2
Here are the visualiza6ons for all the testers of the June session for which we
have eye-tracking data.
Observa6ons in eye-tracking
Diego de Wau6er- 12/2017 12
Sc: Tobii - Gaze Plot – 6 users Sc: Tobii – Heat Map – 6 users Sc: Tobii - Cluster – 6 users

13. REALITY CHECK 2
Results by user
Diego de Wau6er - Immoweb - 12/2017 13
The detail of the results is even more explicit: for the users? In a situa6on of
success, the average response 6me on the models goes from 15,5 '' to 5,6 '', is
about 1/3 of the 6me !
T estor T ime to find E xperience T estor T ime to find E xperience
1 No data Medium 1 7 Easy
2 No data Medium 2 4 Easy
3 19 Medium 3 No data Easy
4 12 Medium 4 7 Easy
5 - Fail 5 No data Easy
6 - Fail 6 7 Easy
7 - Fail 7 3 Easy
8 - Fail 8 3 Easy
15,5 seconds 5,6 seconds
Easy = 0 second - 10 seconds Medium = 10 seconds to 20 seconds
MARCH 17 - Version A JUNE 17 - Version B
Time to find the architectural plan
in 2 versions of the 'modal'

14. LIMITS
The tests are carried out with the help of around 8 testers per session. They
come from a recruitment made via a form on the Immoweb website. The
selec6on is based on their declara6on of exper6se in terms of use of the web
and their smartphone.
At this scale, user tests have no scien6fic claim. They remain however very
significant: the behavior is indeed less subject to the bias inferred by the
tests than opinions. And small-scale trends are likely to occur on a larger
scale with a small margin of error.
Above all, they are a powerful help for problem detec6on and decision
making. When the project team is aligned with the observa6ons made
during the tests and their cogni6ve bases induced during the analysis, the
tests become ac6onable.
Condi6ons de test
Diego de Wau6er- 12/2017 14