SFN 2019 Presentation : Method of and system for processing signals sensed from a user (U.S. Patent No. 10,368,741)
1 like225 views
This document describes a presentation given by Dr. Pierre-Majorique Léger and Dr. Sylvain Sénécal on using physiological signals and eye tracking data to generate heatmaps that visualize users' emotional reactions on websites. It provides examples of how this methodology was applied to analyze banner ads on Walmart.com's homepage, product pages on various retail sites, and customer journeys on Walmart.com to identify emotionally significant areas and pain points. The methodology aims to provide insights into what customers truly experience rather than just relying on self-reported data.
SFN 2019 Presentation : Method of and system for processing signals sensed from a user (U.S. Patent No. 10,368,741)
- 1. What do your customers are really experiencing on your website? Dr PIERRE-MAJORIQUE LÉGER Dr SYLVAIN SÉNÉCAL October 22nd , 2019 SOCIETY FOR NEUROSCIENCE, CHIGACO
- 2. © Copyright Tech3Lab 2019 Pierre-Majorique Léger, Ph. D. Lab Serious games to learn enterprise systems and business analytics https://www.researchgate.net/profile/Pierre-Majorique_Leger NSERC-Prompt Industrial Research Chair in User Experience Director ERPsim Lab Co-direct0r Tech3Lab pml@hec.ca GRADUATE STUDIES POST-DOCTORATE LABORATORIES FINANCIAL SUPPORT GUEST PROFESSOR
- 3. © Copyright Tech3Lab 2019 Syvain Sénécal, Ph. D. RBC Financial Group Chair of E-commerce Co-direct0r Tech3Lab ss@hec.ca GRADUATE STUDIES LABORATORIES FINANCIAL SUPPORT CHAIRE DE COMMERCE ÉLECTRONIQUE RBC Groupe Financier https://www.researchgate.net/profile/Sylvain_Senecal GUEST PROFESSOR
- 4. © Copyright Tech3Lab 2019 Method of a system for processing signals from a user UNITED STATES PATENT Courtemanche, F., Fredette, M., Senecal, S., Leger, P.M., Dufresne, A., Georges, V. and Labonte-lemoyne, E., Valorisation Gestion LP and Valorisation-Recherche LP, 2019. Method of and system for processing signals sensed from a user. U.S. Patent 10,368,741. PATENT PROTECTED : U.S. Patent No. 10,368,741
- 5. © Copyright Tech3Lab 2019 PATENT PROTECTED : U.S. Patent No. 10,368,741
- 6. © Copyright Tech3Lab 2019 PATENT PROTECTED : U.S. Patent No. 10,368,741
- 7. © Copyright Tech3Lab 2019 Physiological heatmaps: a tool for visualizing users’ emotional reactions François Courtemanche1 & Pierre-Majorique Léger2 & Aude Dufresne3 & Marc Fredette4 & Élise Labonté-LeMoyne1 & Sylvain Sénécal5 Received: 26 January 2017 /Revised: 4 August 2017 /Accepted: 8 August 2017 / Published online: 22 August 2017 # The Author(s) 2017. This article is an open access publication, Corrected publication September/2017 Multimed Tools Appl (2018) 77:11547–11574 DOI 10.1007/s11042-017-5091-1 * François Courtemanche francois.courtemanche@hec.ca 1 Tech3lab, HEC Montréal, 3000 Côte Sainte-Catherine, H3T 2A7, Montréal, QC, Canada 2 Department of Information Science, HEC Montréal, 3000 Côte Sainte-Catherine, H3T 2A7 Montréal, QC, Canada 3 Department of Communication, University of Montréal, 2900 Edouard-Montpetit, H3T 1J4, Montréal, QC, Canada 4 Departement of Statistics, HEC Montréal, 3000 Côte Sainte-Catherine, H3T 2A7, Montréal, QC, Canada 5 Departement of Marketing, HEC Montréal, 3000 Côte Sainte-Catherine, H3T 2A7, Montréal, QC, Canada Abstract Practitioners in many fields of human-computer interaction are now using physio- logical data to measure different aspects of user experience. The dynamic nature of physio- logical data offers a continuous window to the users and allows a better understanding of their experience while interacting with a system. However, in order to be truly informative, physiological signals need to be closely linked to users’ behaviors and interaction states. This paper presents an analysis method that provides a direct visual interpretation of users’ physiological signals when interacting with an interface. The proposed physiological heatmap tool uses eyetracking data along with physiological signals to identify regions where users are experiencing different emotional and cognitive states with a higher frequency. The method was evaluated in an experiment with 44 participants. Results show that physiological heatmaps are able to identify emotionally significant regions within an interface better than standard gaze heatmaps. Applications of the method to different fields of HCI research are also discussed. Keywords Physiological computing . Eyetracking . Affective computing . Heatmap . User experience A tool for visualizing users’ emotional reactions PHYSIOLOGICAL HEATMAPS: Courtemanche, F., Léger, P. M., Dufresne, A., Fredette, M., Labonté-LeMoyne, É., & Sénécal, S. (2018). Physiological heatmaps: a tool for visualizing users’ emotional reactions. Multime- dia Tools and Applications, 77(9), 11547-11574.
- 8. © Copyright Tech3Lab 2019 Example of this application of this new methodology METHODOLOGICAL NOTES Density of fixation Positive emotions Negative emotions OLD PAGE TRADITIONAL EYETRACKING TECH3LAB APPROACH NEW PAGE Reaction at the moment of fixation
- 10. © Copyright Tech3Lab 2019 WHY IS IT IMPORTANT ? Reports from the industry show that consu- mers usually avoid rotating banners on the homepage carousel1 . Thus, it it essential to choose banners that trigger positive emo- tions and subsequently reduce the homepage bounce rate. Optimization of the banner can lead to millions of dollars in gained revenue, simply by mass visibility to placed products. THE NAME OF THE GAME : TIME TO INSIGHT Given the frequency of changes of rotating ban- ners (weekly changes in the case of Walmart), it is essential to perform this type of analysis very quickly, and cost effectively, in order to select which banners should and should not be used. A/B testing this could cost tens of thou- sands of dollar every week in lost revenue! What do your customers really experience when they land on your homepage? The case of Walmart.com homepage carousel: Methodology Sample: 8 participants (4 men, 4 women) Task: Looking for 5 seconds at each banner ad. Data acquisition: Tobii Pro, Facereader v.8, Biopac Acknowledge, Noldus Observer XT. Measures used in the example: Positive and Negative Valence Data Analysis and Triangulation: CubeHX . Time to insight: 1 day to collect data, 1 day to post-process and analysis results. Walmart.com: 321 million visitors per month Bounce Rate: 52.16% EXAMPLE 1 https://conversionxl.com/blog/dont-use-automatic-image-sliders-or-carousels/1
- 11. © Copyright Tech3Lab 2019 WALMART HAS A VERY EMOTIONALLY EFFECTIVE FIRST BANNER Of the five banners tested. The “We Dress Ame- rica” visualization performs the best, when enga- ging with the customers non-conscious. As this is the virst visualization the customer sees, it is essential that it must captura and engage the consumer. Our test show that of all the visualiza- tions, “We Dress America” is best suited to allow the customer tofurther engage with the site. THE REST OF THE CARROUSEL CREATE MIXED EMOTIONS Maintaining user attention for the rest of the carousel is challenging. The other banners must be as effective, if not more, to maintain consumer engagement. For example, the basketball banner does not have the same level of professionalism in its design and consumers immediately reac- ted to it. Obviously, testing banners every week before putting them online would help the per- formance Walmart’ website (e.g., bounce rate). Walmart.com Homepage Carousel Banners on March 27 UX Heatmap powered by CubeHX Homepage Carrousel: Insights & Recommendations INSIGHT #1 Nearly half of the participants had an entirely positive emotional experience on the first rotating banner. INSIGHT #2 This image generates emotional confusion for a majority of consumers, mostly because of bad design. INSIGHT #3: Confusion due to missing human head INSIGHT #4 Although nearly half of participants mention they like the Apple products’ banner, several elements generate negative emotions, including the product names. EXAMPLE 1 Positive valence (Facereader) Negative valence (Facereader)
- 12. © Copyright Tech3Lab 2019 WHY IS IT IMPORTANT ? “Your product page is the most important page on your site. Build your product page effectively and both your traffic and conversions will skyroc- ket. Fail to do so, and almost all your marketing and advertising efforts will fall short of goal.”1 CONVERSION FUNNEL OPTIMIZATION As all retailers invest heavily to attract consu- mers to their websites and then convert them into customers, having best in class product pages is essential for performing websites. BENCHMARK YOUR SITE The best way to improve is to compare your online performance. Not just on web analytic metrics. Behaviors can’t tell you what user really experience. By comparing all the key steps in your conversion funnel to those of your compe- titors, you can get inspired and try to move the needle in your favor. Comparing product choice experience across three platforms: Methodology Sample: 8 participants (4 men, 4 women). Task: Find for a gift for your 11 year old nephew. Data acquisition: Tobii Pro, Facereader v.8, Biopac Acknowledge, Noldus Observer XT. Measures: Valence (Facereader), Arousal (standardized EDA, Biopac), Cognitive load (Pupil size, Tobii) Data Analysis and Triangulation: CubeHX . Time to insight: 1 day to collect data, 1 day to post-process and analysis results. What do your customers really experience on your product pages? Generalist Specialist Niche player EXAMPLE 2 https://www.bigcommerce.com/blog/product-page-examples/#7-ecommerce-product-page-best-practices1
- 13. © Copyright Tech3Lab 2019 EXAMPLE 2 HOMEPAGE PRODUCT SEARCH PRODUCT SPECS CHECKOUT Visitors Bounce Rate Walmart.com 321M 52.16% Bestbuy.com 109M 47.63% Gamestop.com 21.5M 44.44% The sales funnel of Walmart, Bestbuy and EB Games What do your customers really experience on your product pages?
- 14. © Copyright Tech3Lab 2019 Emotional Circumplex METHODOLOGICAL NOTES EMOTIONAL VALENCE EMOTIONAL INTENSITY Sad Happy Calm Excited UX No Man Land Excitement SerenityTolereble How to read this circumplex On the vertical axis, we find the emotional intensity experienced by consumers; the higher they are, the more emotionally intense is the experience. Horizontally, emotional valence is represented; on the right, experience gene- rates pleasure, while on the left, the experience generates displeasure. Finally, the size of the circle represents the mental workload; a large circle represents a significant mental effort of consumers.
- 15. © Copyright Tech3Lab 2019 WALMART, THE LAGGER. Low prices is not sufficient for a better experience. Walmart is a generalist and must find a way to compete against websites that can afford to carve a unique experience for users. A microsite can be a way to compete on the emotional front. Walmart has successfully used this strategy in the past for niche products. INSIGHT #1 Experience on Walmart is as emotionally engaging on these two pages. EBGames and BestBuy are able to carry over to the search page the excitement generated on the homepage. EXAMPLE 2 Homepage Product Search VALENCE (FACEREADER)VALENCE (FACEREADER) AROUSAL(STANDARDIZED VALENCE (FACEREADER)VALENCE (FACEREADER) AROUSAL(STANDARDIZED Product pages: Insights & Recommendations (1/2) AROUSAL(STANDARDIZEDEDA)
- 16. © Copyright Tech3Lab 2019 Product Specs Checkout AROUSAL(STANDARDIZED AROUSAL(STANDARDIZED AROUSAL(STANDARDIZED AROUSAL(STANDARDIZED PUPIL SIZE PUPIL SIZE THE ULTIMATE STEP IN THE CONVERSION FUNNEL: THE PRODUCT PAGE The product page is the last page before consumers make a purchase. The experience on EBGames appears to be the gold standard. It per- forms significantly better than Walmart and BestBuy. By having the best product page the EBGames website, is making the most of their efforts to convert consumers to paying customers on their website. Product pages: Insights & Recommendations (2/2) INSIGHT #2 EBGames product page generates emotions that are positive and intense, while maintaining a low mental workload. VALENCE (FACEREADER) VALENCE (FACEREADER)VALENCE (FACEREADER) EXAMPLE 2
- 17. © Copyright Tech3Lab 2019 WHY IS IT IMPORTANT ? Every customer is unique in the way that they engage with an organisation, so having a fra- mework in place to optimise each touchpoint and capitalise on customers’ moments of truth is essential to generating more revenue and new business alike.1 By using what consumers really experience in terms of emotions when interacting with the website, CubeHX journey maps identify all consumers’ moment of truth, not just the ones they self-reported. IDENTIFYING THE PAIN POINTS IN THE USER JOURNEY By calculating moments of high arousal and negative emotions, we can detect pain points along the consumer journey, which will enable Walmart to identify problems in the conversion funnel. Understanding the most important pain points on a website is very useful to help designers prioritize what needs to be fixed. What do customers truly experience during their journey on your website? Walmart.com journey maps : Methodology Sample: 8 participants (4 men, 4 women) Task: Searching and buying a “pop figure” under 15$ Data acquisition: Tobii Pro, Facereader v.8, Biopac Acknowledge, Noldus Observer XT. Measures: Valence (Facereader) and Arousal (standardized EDA, Biopac) Data Analysis and Triangulation: CubeHX Time to pain points identification: 1 day to collect data. 1 day to post-process and analysis results Walmart.com: 321 million visitors per month Bounce Rate: 52.16% https://www.sas.com/en_gb/insights/articles/marketing/why-is-customer-journey-mapping-important.html#/ EXAMPLE 3 1
- 18. © Copyright Tech3Lab 2019 Journey maps METHODOLOGICAL NOTES 1 2 3 ... + - ACTIVATION: (StandardizedEDA-Biopac) Time STEPS Friction Point EMOTIONAL VALENCE (Facereader) + - How to read this journey map Colors of tasks are presented on the right, the red squares representing moments of physiological pain points along the journey. On the vertical axis, we find the emotional intensity experienced by consumers; the higher they are, the more emotio- nally intense is the experience. Horizontally, the time is presented in seconds. The size of the circle represents the emotional valence; a large circle represents negative emotions.
- 19. © Copyright Tech3Lab 2019 FILTERING ISSUE IN PRODUCT SEARCH Problems seem to occur during product search and more specifically, during the filtering pro- cess. This issue creates an obstacle keeping the customer from attaining the product page and ultimately, the checkout. FIX ORDER AMOUNT RECALCULATION The last thing you want is to lose a customer in the check out page. Fixing the recalculation is easy and should be a priority! User journey: Insights & Recommendations EXAMPLE 3 VALENCE (FACEREADER) INSIGHT #1 Even after filtering for the price, consumers cannot find the product he is looking for, which creates frustration. INSIGHT #2 The total order amount does not adjust when an item is removed from the cart, creating confusion.
- 20. © Copyright Tech3Lab 2019 https://www.cubehx.com/ For more information, visit cubehx.com and noldus.com