Conference at the NeuroIS Workshop at Int Conf for Informations System, Dec 2018

1. PIERRE-MAJORIQUE LÉGER, Ph.D.
Titulaire de la Chaire de recherche industrielle
CRSNG-Prompt en expérience utilisateur
Co-directeur Tech3Lab, Directeur ERPsim Lab
Decoding
what users
really experience
with NeuroIS
Recent research from HEC Montréal Tech3Lab

2. © Copyright Léger (2018)
Pierre-Majorique Léger, Ph.D.
Lab Serious games to learn
enterprise systems and
business analytics
https://www.researchgate.net/profile/Pierre-Majorique_Leger
Full Profess0r
Director ERPsim Lab
Co-direct0r Tech3Lab
pml@hec.ca
Graduate studies
Post-Doctorate
Laboratories Financial support
Guest Professor

3. © Copyright Léger (2018)
cognition
attention
Emotions
A B
Using neurophysiological data
to optimize user experience (UX)
1 Gb/participant
per hour
Help designers
to make decision
Autoadapt interface
Eyetracking
Neurophysiological measures

4. © Copyright Léger (2018)
Top 5 UX Questions
1
Which is the journey
truly experienced
by my users?
4
How do I compare
to my competitors' UX?
2
Which of my prototypes
generates the best UX?
5
What generates
emotional reactions
on our interface?
3
Do all my users live
the same experience?
Léger, P. M., Courtemanche, F., Fredette, M., & Sénécal, S. (2019). A Cloud-Based Lab Management and
Analytics Software for Triangulated Human-Centered Research. In Information Systems and Neuroscience
(pp. 93-99). Springer, Cham.

5. © Copyright Léger (2018)
1
Which is the emotional
journey truly experienced
by my users?
Tech3Lab 2-d method
(intensity and valence)
1 2 3 ...
+
-Activation:
EmotionalIntensity
TIME
STEPS
Friction Point
Emotional
Valence
+ -
Powered
by

6. 1
Which is the emotional
journey truly experienced
by my users?
An example in Food and Agriculture

7. © Copyright Léger (2018)
VALENCE
ÉMOTIONNELLENe sais pas
quoi inscrire
dans barre de
recherche
Inscription
adresse
courriel
Ajout de filtres
pour choix
produits Résultats de
Produits
sans photos
Clic sur
“achat”
Inscription
du No de tel.
recherche non
1 Which is the emotional journey truly experienced by my users?
An example of the emotional path with the Tech3Lab methodEmotionalIntensity
Emotional Intensity
Emotional valence
Identification
of friction points
for each step
Emotional
Valence

8. © Copyright Léger (2018)
0 100 200 300 400 500 600 700 800 900 1000 1100 1200 1300 1400
Time (sec)
-0,7
-0,6
-0,5
-0,4
-0,3
-0,2
-0,1
0,0
0,1
Activation
Valence
-1,0000
-0,5000
0,0000
0,5000
1,0000
Tâche
Pain Point
Création de compte
Magasinage
Paiement
Sélection du lieu de collecte
Sélection du moment de collecte
Null
1
« No stress for me, I entered
my credit card, that was fine»
1
Which is the emotional
journey truly experienced
by my users?
Our friction point identification method
reveals a contradiction between what
is expeienced and what is reported
EmotionalIntensity
Powered
by

9. © Copyright Léger (2018)
1
Which is the cognitive
journey truly experienced
by my users?
Tech3Lab 2nd method
(intensity and valence)
1 2 3 ...
+
-cognitiveload
TIME
STEPS
Friction point
Powered
by

10. © Copyright Léger (2018)
2500 2600 2700 2800 2900 3000 3100 3200 3300 3400 3500 3600 3700 3800 3900 4000 4100
Time
-0.9
-0.8
-0.7
-0.6
-0.5
-0.4
-0.3
-0.2
-0.1
0.0
0.1
0.2
0.3
0.4
0.5
WORKDAY_A_P14
pain
wkt1
wkt2
wkt3
wkt4
wkt5
pain
wkt1
wkt2
wkt3
wkt4
wkt5
Avg. Eda Re
-0.3955
-0.3000
-0.2000
-0.1000
0.0001
Inscription
de données
personnelles
Recherche
avec barre
d’outils non
fructueuse
Utilise le
menu de
naviguation
Navigue sur la
page d’accueil
pour trouver la
bonne application
1
Which is the
cognitive journey
truly experienced
by my users?
An example
of the cognitive path
with the Tech3Lab method
Powered
by
cognitiveload
Entering
personal
data
Fruitless
search
using the
tool bar
Using the
navigation
menu
Navigating
on the home
page to find
the right app

11. Which of my prototypes generates
the best UX?2

12. © Copyright Léger (2018)
2
Which of my prototypes
generates the best UX?
An example comparing two prototypes
of a new website
Immobilier.ca Immobilier.ca
A B
Powered
by

13. © Copyright Léger (2018)
Emotional
Valence
Emotional intensity
Sad Happy
Calm
Excited

14. © Copyright Léger (2018)
-1.0 -0.8 -0.6 -0.4 -0.2 0.0 0.2 0.4 0.6 0.8 1.0
Valence
-1.0
-0.8
-0.6
-0.4
-0.2
0.0
0.2
0.4
0.6
0.8
1.0
Arousal
Task 1
Task 4
Task 5
Task 6
Task 1
Task 6
global_modified
Platform
Firm 1
Firm 2
Average of Valence vs. average of Calculation1. Color shows details about Platform. The marks are labeled by Subtask.
INTENSITy
Valence
COGNITIVE LOAD
VALENCE
Negative Positive
Easy Hard
-0.40 -0.35 -0.30 -0.25 -0.20 -0.15 -0.10 -0.05 0.00 0.05 0.10 0.15 0.20 0.25
Valence
-0.1
0.0
0.1
0.2
0.3
0.4
0.5
Arousal
Task 4
Task 3
Task 2
Task 2
Task 4
Task 1
Task 5
Task 6
Task 7
Task 8
2
Which of my prototypes
generates the best UX?
Prototype A generates a better
experience than Prototype B
COGNITIVE LOAD
VALENCE
Negative Positive
Easy Hard
cognitive
load
Immobilier.ca Immobilier.ca
A B
Powered
by
Sad Happy
Calm
Excited

15. © Copyright Léger (2018)
emotional
valence
cognitive load
Sad Happy
Easy
Difficult

16. © Copyright Léger (2018)
2
Which of my prototypes
generates the best UX?
An example launch of a new functionality
(A performs better than B)
-0.12 -0.10 -0.08 -0.06 -0.04 -0.02 0.00
Valence
-0.23
-0.22
-0.21
-0.20
-0.19
-0.18
-0.17
-0.16
-0.15
-0.14
-0.13
-0.12
-0.11
CognitiveLoad
WorkDay
B
WorkDay
B
WorkDay
A
WorkDay
A
slide3_WD
Activation
-0.1800
-0.1500
-0.1000
-0.0500
0.0000
Train
trained tasks
untrained tasks
Average of Valence Re vs. average of Pupille Re. Color shows details about Train. Size shows
average of Eda Re. The marks are labeled by system2 and Version. The data is fi ltered on System,
which keeps WD.
Better launch
of a new
functionality
New functionality
Current functionality
chargementale
emotional
Intensity
Powered
by
Lala, Mehul; Atmane, Yasmine; Karran, Alexander J.; Léger, Pierre-Majorique et Senecal, Sylvain.
(2019). Classifying Cognitive Pain Points During Process Change Management in Software As A Service
(SaaS) Applications. HCII, Orlando, États-Unis.

17. What generates emotional reactions
on our interface?5

18. © Copyright Léger (2018)
5
What generates
emotional reactions
on our interface?
Powered by

19. © Copyright Léger (2018)
Density of Fixation
5
What generates
emotional reactions
on our interface?
Powered by

20. © Copyright Léger (2018)
Positive Emotions
Negative Emotions
5
What generates
emotional reactions
on our interface?
Powered by
Courtemanche, F., Léger, P. M.,
Dufresne, A., Fredette, M., Labonté-
LeMoyne, É., & Sénécal, S. (2018).
Physiological heatmaps: a tool for vi-
sualizing users’ emotional reactions.
Multimedia Tools and Applications,
77(9), 11547-11574.

21. © Copyright Léger (2018)
5
What generates
emotional reactions
on our interface?
Powered by

22. © Copyright Léger (2018)
Density
of Fixation
Old Page Traditional Eyetracking Tech3Lab Approach New Page
positive
Emotions
Negative
Emotions
5 What generates emotional reactions
on our interface?
Reaction
at the moment
of fixation
Courtemanche, F., Léger, P. M., Dufresne, A., Fredette, M., Labonté-LeMoyne, É., & Sénécal, S. (2018). Physi-
ological heatmaps: a tool for visualizing users’ emotional reactions. Multimedia Tools and Applications, 77(9),

23. © Copyright Léger (2018)
3
Do all my users
live the same experience?

24. © Copyright Léger (2018)
Task Order / Representative Task / Task Des
1
2.1
2
2.2
3
2.3
4
1.5
5
2.4
6
2.5
8
3.1
9
3.2
10
3.3
11
3.4
12
3.5
13
3.6
14
3.7
15
4.1
Débranchez
le câble d'
alimentati..
Débrancher
le fil
téléphoniq..
Débrancher
la cable
Ethernet
entre le
Modem et le
Routeur
Wi-Fi
Lire les
instructions
Débrancher
le cordon d'
allimentati..
Dévisser la
douille de
sécurité et
Retirer le
câble
coaxial à
l'arrière du
Modem à ..
Visser le
câble
coaxial
derrière le
Gateway
Brancher le
fil téléphoni
que..
Brancher le
cordon d'
allimentati..
Identifier le
terminal
télé
Dévisser le
câble
coaxial
derrière le
terminal
Visser le
filtre dans
la prise
coaxiale du
terminal
Puis visser
fermement
le câble
coaxial sur
le filtre
Déposer les
équipemen..
-0.4
-0.2
0.0
0.2
0.4
0.6
Activation
Riddler_cluster_journey
Avg. Cognitive Load
-1.00
-0.80
-0.60
-0.40
-0.18 0.24
Avg. Valence
Average of Eda for each Task Des broken down by Task Order and Representative Task. Color shows average of Valence. Size shows average of Cognitive Load. The data is filtered on Cluster,
which keeps 1. The view is filtered on Task Order, which excludes Null.
Task Order / Representative Task / Task Des
1
1.5
2
2.3
3
2.2
4
2.1
5
2.5
6
2.4
7
3.2
8
3.1
9
3.3
10
3.4
11
3.5
12
3.6
13
3.7
14
4.1
Lire les
instructions
Débrancher
la cable
Ethernet
entre le
Modem et le
Routeur
Wi-Fi
Débrancher
le fil
téléphoniq..
Débranchez
le câble d'
alimentati..
Dévisser la
douille de
sécurité et
Retirer le
câble
coaxial à
l'arrière du
Modem à ..
Débrancher
le cordon d'
allimentati..
Brancher le
fil téléphoni
que..
Visser le
câble
coaxial
derrière le
Gateway
Brancher le
cordon d'
allimentati..
Identifier le
terminal
télé
Dévisser le
câble
coaxial
derrière le
terminal
Visser le
filtre dans
la prise
coaxiale du
terminal
Puis visser
fermement
le câble
coaxial sur
le filtre
Déposer le
équipemen
-0.4
-0.2
0.0
0.2
0.4
0.6
Activation
Riddler_cluster_journey
Average of Eda for each Task Des broken down by Task Order and Representative Task. Color shows average of Valence. Size shows average of Cognitive Load. The data is filtered on Cluste
which keeps 2. The view is filtered on Task Order, which excludes Null.
Task Order / Representative Task / Task Des
1
1.5
2
2.1
3
2.2
4
2.3
5
2.5
6
2.4
7
3.1
8
3.2
9
3.3
10
3.4
11
3.5
12
3.6
13
3.7
14
4.1
Lire les
instructions
Débranchez
le câble d'
alimentati..
Débrancher
le fil
téléphoniq..
Débrancher
la cable
Ethernet
entre le
Modem et le
Routeur
Wi-Fi
Dévisser la
douille de
sécurité et
Retirer le
câble
coaxial à
l'arrière du
Modem à ..
Débrancher
le cordon d'
allimentati..
Visser le
câble
coaxial
derrière le
Gateway
Brancher le
fil téléphoni
que..
Brancher le
cordon d'
allimentati..
Identifier le
terminal
télé
Dévisser le
câble
coaxial
derrière le
terminal
Visser le
filtre dans
la prise
coaxiale du
terminal
Puis visser
fermement
le câble
coaxial sur
le filtre
Déposer les
équipemen..
-0.4
-0.2
0.0
0.2
0.4
0.6
Activation
Riddler_cluster_journey
-0.18 0.24
Avg. Valence
Avg. Cognitive Load
-1.00
-0.80
-0.60
-0.40
Average of Eda for each Task Des broken down by Task Order and Representative Task. Color shows average of Valence. Size shows average of Cognitive Load. The data is filtered on Cluster,
which keeps 3. The view is filtered on Task Order, which excludes Null.
Task Order / Representative Task / Task Des
1
1.5
2
2.3
3
2.2
4
2.1
5
2.5
6
2.4
7
3.2
8
3.1
9
3.3
10
3.4
Lire les
instructions
Débrancher
la cable
Ethernet
entre le
Modem et le
Routeur
Wi-Fi
Débrancher
le fil
téléphoniq..
Débranchez
le câble d'
alimentati..
Dévisser la
douille de
sécurité et
Retirer le
câble
coaxial à
l'arrière du
Modem à ..
Débrancher
le cordon d'
allimentati..
Brancher le
fil téléphoni
que..
Visser le
câble
coaxial
derrière le
Gateway
Brancher le
cordon d'
allimentati..
Identifier le
terminal
télé
-0.4
-0.2
0.0
0.2
0.4
0.6
Activation
Riddler_cluster_journey
-0.18 0
Avg. Valence
Avg. Cognitive Load
-1.00
-0.80
-0.60
-0.40
Average of Eda for each Task Des broken down by Task Order and Representative Task. Color shows average of Valence. Size shows
average of Cognitive Load. The data is filtered on Cluster, which keeps NA. The view is filtered on Task Order, which excludes Null.
SUCCES
100%
SUCCES
0%
SUCCES
12.5%
SUCCES
73%
Persona 1 Persona 2
Persona 4Persona 3
3
Do all my users live
the same experience?
Powered
by
Maunier, B., Alvarez, J., Léger, P. M., Sénécal, S., Labonté-LeMoyne, É., Chen, S. L. & Gagné, J. (2018,
July). Keep Calm and Read the Instructions: Factors for Successful User Equipment Setup. In International
Conference on HCI in Business, Government, and Organizations (pp. 372-381). Springer, Cham.

25. How do I compare to my competitors' UX?4

26. © Copyright Léger (2018)
-1.0 -0.8 -0.6 -0.4 -0.2 0.0 0.2 0.4 0.6 0.8 1.0
Valence
-1.0
-0.8
-0.6
-0.4
-0.2
0.0
0.2
0.4
0.6
0.8
1.0
Activation
Competitor (Gold standard)
New Version
Old Version
data_modified
Interface Name
Competitor (Gold standard)
New Version
Old Version
Avg. Pupille Re
-0.25
-0.20
-0.15
-0.10
-0.06
Average of valence_modified vs. average of eda_modified. Color shows details about Interface Name. Size shows average of Pupille Re.
The marks are labeled by Interface Name.
-1.0 -0.8 -0.6 -0.4 -0.2 0.0 0.2 0.4 0.6 0.8 1.0
Valence
-1.0
-0.8
-0.6
-0.4
-0.2
0.0
0.2
0.4
0.6
0.8
1.0
Activation
New Version
Old Version
Competitor (Gold standard)
Interface Name
Competitor (Gold standard)
New Version
Old Version
Avg. Pupille Re
-0.25
-0.20
-0.15
-0.10
-0.06
Average of Valence Re vs. average of Eda Re. Color shows details about Interface Name. Size shows
average of Pupille Re. The marks are labeled by Interface Name. The view is filtered on Interface Name,
which keeps Competitor (Gold standard), New Version and Old Version.
Negative
-0.5
-0.4
-0.3
-0.2
-0.1
0.0
0.1
0.2
0.3
0.4
Activation
Competitor (Gold standard)
New Version
Old Version
Interface Name
Competitor (Gold standa
New Version
Old Version
-0.25
-0.20
-0.15
-0.10
-0.06
4
How do I compare to my
competitors' UX?
intensity
ValenCE
Sad Happy
Calm
Excited
New version
Old version
Competitor
Powered
by
COGNITIVE LOAD
VALENCE
Negative Positive
Easy Hard
cognitive
load

27. © Copyright Léger (2018)
In collaboration with Deloitte Digital
0.45 0.46 0.47 0.48 0.49 0.50 0.51 0.52 0.53 0.54
Index Homepage
0.45
0.46
0.47
0.48
0.49
0.50
0.51
0.52
0.53
0.54
0.55
IndexInstagram
BMO
BNC
CIBC
Coast
Desjardins
RBC
Scotia
TD
Global Median
Global Median
Median
Median
Index: Homepage vs Instagram
Industry
Banks
Average of Index Homepage vs. average of Index Instagram. Color shows details about Industry. The
marks are labeled by Brand. The view is filtered on Industry and Exclusions (Brand,Industry). The Industry
filter keeps Banks. The Exclusions (Brand,Industry) filter keeps 25 members.
Note : Average of the first 20 sec.
Canadian
banking industry
The emotional reaction of millenials
across different platforms
Powered
by

28. © Copyright Léger (2018)