Dans un monde digital où les résultats business sont de plus en plus demandés par les organisations, l’expérience utilisateur est un des facteurs clés de succès.

Ceci est un jour que j’attends depuis 3 ans. Je vais vous présenter la dernière innovation Netway : la capacité de voyager au sein du cerveau des utilisateurs pour mieux comprendre ce qui s’y passe.

Afin de vous illustrer cela, nous allons partager avec vous une partie de l’analyse Facebook, réalisée sur le site de Facebook pour un de nos clients.

Mais avant d’entrer dans le vif du sujet, pourquoi est-ce nécessaire de comprendre ce qui se passe dans le cerveau des utilisateurs quand on conçoit un écran ?

La réponse est très simple : les utilisateurs sont de plus en plus confrontés à de nombreux écrans concurrents ; il devient donc de plus compliqué de se différencier de ses concurrents.

Comme le signale Eric Schmidt (CEO Google), le comportement humain devient un outil primordial pour réussir ses projets digitaux et atteindre ses propres objectifs.

Allons-y !

Le cerveau fonctionne par séquences d’activités en millisecondes.

Le eyetracking permet de voir où le cerveau a décidé de collecter des informations au travers des yeux. Par contre, il est impossible de savoir si la personne connait le contenu présenté ou si un écran donne l’envie de cliquer ou encore si un écran est mémorisé.

Tout cela est du passé ! Imaginez de voir au travers des yeux de vos clients et … et maintenant de voyager dans leur cerveau.

L’imagerie par résonance magnétique fonctionnelle (IRMf) et l’électro-encéphalographie (EEG) permettent de cerner les mécanismes neurologiques liés à l’utilisation d’un site.

Plus simplement cela permet de voir les zones activées au sein du cerveau lors de la réalisation d’une tâche.

Connaître les zones activées du cerveau permet de répondre aux questions suivantes :

• est-ce que l’écran n’est pas trop chargé ?
• quelles sont les parties de l’écran qui sont le plus analysées par le cerveau ?
• les visuels utilisés sont-ils reconnus par les utilisateurs ?
• les call-to-action donnent-ils envie de cliquer ?
• les contenus sont-ils compris par les internautes ?
• …

Tout cela pour mesurer de manière objective l’expérience utilisateur.

Prenons l’exemple de Facebook pour illustrer cela.

Je vais volontairement vulgariser mes propos pour que le plus grand nombre de membres de notre communauté puisse en tirer profit.

Dans le cas de Facebook, on voit qu’il y a une plus forte activation du cortex visuel droit, cela indique que les composants visuels dans la moitié gauche de l’interface génèrent plus d’activités cérébrales que les composants de droite.

Mais que peut-on déduire de ces activations ? Analysons plus avant les flux d’activation au sein du cortex visuel.

On remarque que le cortex visuel est peu activé entre la zone V1 et la zone Brodmann 7 (ici en bleu), cela indique que l’attention visuelle (position spatiale, orientation et taille des objets graphiques) demande peu d’effort. Le site a donc une organisation visuelle demandant peu d’attention visuelle.

Par contre on voit que la zone V1 vers V4 (ici en orange) est plus activée indiquant que les utilisateurs identifient et reconnaissent non-consciemment les éléments visuels présentés dans l’écran.

Le Gyrus Fusiforme est la zone impliquée dans la reconnaissance de visages et de choses connues.

En résumé, Facebook a une organisation visuelle simple d’appréhension et efficace puisque les gens reconnaissent les composants visuels présentés dans l’écran, principalement les visages.

Nous avons maintenant des données intéressantes sur les composants visuels de la homepage de Facebook mais lors d’une visite, de nombreux systèmes cérébraux sont activés en parallèle dans le cerveau formant des séquences en millisecondes :

• système visuel
• système sémantique
• système moteur
• …

Tournons-nous vers l’analyse de la compréhension des contenus du site.

La zone Brodmann 44 est impliquée dans la récupération d’informations en mémoire sémantique. Donc quand un internaute regarde des éléments, c’est ce système qui permet d’activer un réseau de connaissance autour d’un mot, d’un objet…

L’information récupérée en mémoire à long terme lors de la visite du site Facebook active le réseau sémantique, les personnes connaissent ce qui est proposé et cela active des informations liées (je connais cette personne, c’est un ami de… ).

Par contre Brodmann 45 n’est pas activée. Si cette zone avait été activée, cela aurait signifié que les informations récupérées n’activaient pas d’associations fortes, donc que le contenu n’est pas très connu ou pas souvent utilisé par le cerveau.

En résumé, les contenus proposés par Facebook sont simples et ne demandent pas d’effort cognitif important.

Attardons-nous maintenant à savoir si les call-to-action donnent l’envie de cliquer.

Une zone spéciale du cerveau, Brodmann 6, est activée lorsque l’internaute pense à cliquer. Cette zone du cortex pré-moteur planifie le mouvement de la main et des doigts (avant de les effectuer). Il est donc possible de savoir si un call-to-action donne l’envie de cliquer avant que le clic réel ne se produise.

Dans le cas de Facebook, l’interface donne moyennement envie de cliquer.

Donc en résumé :

Facebook a une organisation visuelle simple, les utilisateurs reconnaissent directement les objets graphiques, les efforts cognitifs sont très faibles et les internautes comprennent les contenus présentés.

Il y a encore beaucoup d’autres zones du cerveau qui ont été analysées, comme l’hypocampe qui permet de savoir si un écran est mémorisé, il y a aussi le système de récompense permettant de voir si les gens sont contents…

Comment utiliser concrètement ce genre de connaissances dans un projet ?

Dans notre cas :

• nous construisons les écrans sur base des comportements souhaités.
• une fois les écrans designés, nous vérifions si les écrans que nous avons réalisés activent bien les zones et les niveaux d’activation précédemment déterminés sous forme d’hypothèse.
• nous croisons ces données avec les données des analyses oculaires récoltées afin d’avoir une vue la plus objective et certaine possible.
• si nécessaire (et c’est à 99% le cas) nous corrigeons les écrans afin de générer les comportements attendus à plus de 80%.

Dans un post (http://www.useit.com/alertbox/anybody-usability.html) de décembre 2009, useit.com communique qu’avec peu de connaissance en Usability et avec 3 jours de testing  “you can typically at least double your conversion rate or other key business metrics”.

D’un autre côté, le même site  :

“Many people without a grounding in behavioral user-research principles use bogus methodology and thus get misleading findings. Poor methodology is especially common for eyetracking studies, and thus most published studies in this area are wrong”.

A vous de trouver l’erreur

En prenant cela avec humour, cela voudrait dire que nous aurions aujourd’hui des sites magnifiques offrant tous une expérience utilisateur optimale et des taux de conversion incroyables. La réalité est tout autre.

Dernièrement mon équipe a travaillé sur un projet pour une société “pure player internet”, composée de personnes senior dans plusieurs métiers du web – parmi lesquels la Usability – qui en changeant quelques éléments sur une landing pages ont fait chuter les taux de conversion de plus de 30 % en moins d’une semaine.

Gardons les pieds sur terre… Avec de plus en plus d’écrans digitaux et les changements rapides de comportements des internautes (dont nous en sommes), il faut des techniques de plus en plus sophistiquées pour construire des interfaces porteuses de résultats.

Si je trouve dommage de raconter des bêtises pareilles, j’aime beaucoup l’analogie de Jakob Nielsen :

“Usability is like cooking: everybody needs the results, anybody can do it reasonably well with a bit of training, and yet it takes a master to produce a gourmet outcome.”

A mon avis, un Chef n’a pas que quelques connaissances culinaires ; je pense aussi que tout le monde ne peut pas atteindre les résultats du Chef avec quelques règles. C’est un professionnel du goût qui connait les fondamentaux des produits qu’il assemble et c’est cette connaissance fondamentale qui lui permet de créer des plats incroyables de manière constante sans utiliser de recettes.

La Usability sera toujours la cuisine réalisée par tout un chacun sur base de règles qu’il faut adapter régulièrement, mais jamais elle ne sera la solution pour créer de manière constante des écrans efficaces.

Le Neuro-Marketing représente la cuisine basée sur les fondamentaux du goût (la connaissance des sens des clients, la connaissance approfondie des produits…) permettant, quel que soit le plat à créer, de pouvoir combiner ces fondamentaux entre eux (les chiffres indiens) pour obtenir un résultat de haute qualité.

Excellente semaine

In a December 2009 post (http://www.useit.com/alertbox/anybody-usability.html), useit.com claims that with little knowledge on the subject of usability and after only 3 days of testing, you can typically at least double your conversion rate or other key business metrics.

On the other hand, it also says:

“Many people without a grounding in behavioural user-research principles use bogus methodology and thus get misleading findings. Poor methodology is especially common for eye-tracking studies, and thus most published studies in this area are wrong”.

So, what’s it going to be?

Does this mean today’s sites are all magnificent, offering an optimal user experience and with incredible conversion rates? A quick reality check is all we need to know that’s far from the truth…

My team recently worked on a project for a pure Internet player. Their senior staff, which came from various web disciplines, including usability, changed some elements on a landing page and saw their conversion rates fall with more than 30% in less than a week.

So let’s keep our feet on the ground… Not only are their more and more digital screens, user behaviour – present company included – also changes at a staggering pace.

We need ever more sophisticated techniques to build result-driven interfaces.

There is something to be said for this analogy made by Mr Nielsen, even though I do find it cool. Here’s what he says:

“Usability is like cooking: everybody needs the results, anybody can do it reasonably well with a bit of training, and yet it takes a master to produce a gourmet outcome.”

I think a chef has more than just some basic knowledge about cooking. I also believe one needs more than just a set of guidelines to obtain the same result as a chef.

A chef is no less than a professional of taste who knows all there is to know about a product. It is this in-depth knowledge that enables him to time after time create incredible dishes without needing a recipe.

Usability will always be the type of cuisine anyone can use if he applies regularly updates rules. But it will never be the solution to constantly create efficient screens.

Neuromarketing can be compared to the cuisine based on the fundamentals of taste (what customers want and expect, an in-depth knowledge of products,…). It combines all these fundamentals to obtain a high-quality result, whatever the dish to be made.

Have a nice week

Gestalt theories are a tool behavioural experts can use to predict how a user’s visual system will respond in front of a screen.

Today, let’s discover the fifth of a total of seven principles and talk about the law of symmetry.

A set of shapes will be better perceived when the individual elements are symmetrical.

Thanks to this principle, shapes can be grouped around an axis (vertical and/or horizontal). The axis in itself can also be a shape. This allows the brain to better guide the foveal fixations on the screen.

The geometry of a screen starts with the fixation of the priority vertical and horizontal axes. The intersections will allow for the placement of the priority graphical elements.

The principles of symmetry, closure, good continuation, proximity and similarity enable the natural focus on the appropriate graphical elements of the screen.

Sometimes, when secondary graphical elements compete with the priority elements, the expert will adapt the Gestalt principles in order to diminish the emphasis on these secondary elements.

I’ve used these techniques when I was working on the Ethias site. I have emphasized the attention onto the priority graphical elements (the green and orange zones), thanks to the combined application of the Gestalt principles, whilst diminishing the attention to the non-priority zones.

In the case of Ethias, the green objects are symmetrical to the central element. When you take a closer look, you will see that the central green object is located in the so-called Netway Interface Sweet Spot™.

In the AXA screen, this principle is present but the objects are placed too closely together. As a result the brain will not be able to identify a set of different graphical elements but will perceive just one shape.

That’s why it is important to take into account the effects of the peripheral vision when creating screens. Without doing so, the Gestalt principles will lose their effectiveness.

Have an excellent week!

Les théories de la Gestalt font partie de la trousse à outils des experts en sciences comportementales afin de prédire comment le système visuel d’un utilisateur va répondre face à un écran.

Je me propose de t’emmener découvrir le cinquième des sept principes : la symétrie.

Un ensemble de formes sera mieux perçu si les formes composant l’ensemble sont symétriques entre elles.

Ce principe permet de rassembler des formes autour d’un axe (vertical et/ou horizontal). L’axe peut être constitué lui-même par une forme. Ceci permet au cerveau de pouvoir mieux orienter les fixations fovéales sur l’écran.

La géométrie d’un écran commence par la fixation des axes prioritaires verticaux et horizontaux. Les intersections de ces axes permettront de placer les composants graphiques prioritaires.

Les principes de symétrie, de clôture, de bonne continuation, de proximité et de similarité permettront donc d’attirer naturellement l’attention vers les composants graphiques adéquats de l’écran.

Il arrive que lorsque des composants graphiques secondaires risquent d’entrer en concurrence avec des composants graphiques prioritaires, l’expert détourne les principes de Gestalt pour diminuer l’emphase sur les éléments secondaires.

J’ai utilisé ces techniques lors de la construction du site Ethias. J’ai accentué l’attention sur les composants graphiques prioritaires (les blocs verts et orange) grâce à l’application combinée des principes de Gestalt tout en diminuant l’attention sur les zones non prioritaires.

Pour le site Ethias, les objets verts par exemple sont symétriques par rapport au composant central. Si tu observes bien tu verras en plus que l’objet vert central se trouve dans la « Netway Interface Sweet Spot ».

Pour l’écran de AXA, ce principe est présent mais les objets sont trop proches les uns des autres : le cerveau ne pourra pas les identifier comme un ensemble de composants graphiques différents mais bien comme une seule forme.

Il est donc important de bien penser aux effets de la vision périphérique lors de la création d’écrans car sans cela, les principes de Gestalt perdront de leur force.

Passe une excellente semaine.

Gestalt theories are a tool behavioural experts can use to predict how a user’s visual system will respond in front of a screen.

Today, let’s discover the fourth of a total of seven principles and talk about the law of closure.

A closed form will more easily be identified as a shape (or a form), in comparison with an open form.

The law of closure allows the brain to dispose of a visual frame (like the frame of a painting) that will allow the user to concentrate on the content at the centre of the frame.

This Gestalt law is closely linked to the first two laws that enable the construction of a strong ‘Netway Neuro-Visual Landscape’.

On the Ethias site, the green objects constitute a frame to the content and allow us to focus on the content in between the two green zones.

In general, an expert can use the law of closure freely: the superior block is in most cases located outside the comfort zone of the screen.

In order to activate the closure effect, our brains needs to rapidly perceive the contours of the frame. That means we need to work on the zones using the Gestalt laws and strengthen the visualization of the frame.

In the case of AXA, the law of closure has not been applied. This leads to an ocular behaviour that doesn’t lead the eye to the centre of the interface.

Have a good week!

Les théories de la Gestalt font partie de la trousse à outils des experts en sciences comportementales afin de prédire comment le système visuel d’un utilisateur va répondre face à un écran.

Je me propose de t’emmener découvrir le quatrième des sept principes : la loi de clôture.

Une forme fermée est plus facilement identifiée comme une figure (ou comme une forme) qu’une forme ouverte.

La loi de clôture permet au cerveau d’avoir un cadre visuel (comme l’encadrement d’une peinture) permettant de concentrer l’attention sur le contenu au centre du cadre.

Cette loi de Gestalt est fortement liée aux trois premières lois permettant de construire un “Netway Neuro-Visual Landscape” fort.

Pour le site Ethias, les objets verts permettent de donner un cadrage au contenu et de focaliser l’attention sur le contenu entre ces deux zones vertes.

En règle générale, l’expert peut utiliser la loi de clôture sans crainte car le pavé supérieur se trouvera très généralement dans la zone d’inconfort de l’écran.

Pour que l’effet de clôture s’active, il faut que le cerveau puisse rapidement percevoir les contours du cadre. Il faut donc travailler les zones avec les autres lois de Gestlat pour renforcer la visualisation du « cadre ».

Pour l’écran de AXA, la loi de clôture n’est pas utilisée. Cela se traduit par un comportement oculaire non guidé vers le centre de l’interface.

Passe une excellente semaine.

Gestalt theories are part of the tools behavioural experts use to predict the response of a user’s visual system to a computer screen. 

We saw,in previous posts, the principle of proximity and the principle of similarity.

Let’s now have a look at the third of seven principles in all: good continuity.

We prefer to perceive continuous forms as to their shape, their size and their placement. We prefer patterns to abrupt changes. 

A good continuity allows the brain not to visit all the zones of a screen, once it has discovered a pattern.

If the pattern is visible in the peripheral vision, our brain will easily attribute one meaning to a group of objects and determine topographical data. 

This Gestalt principle is closely linked to the first two principles and allows us to create a strong Netway Neuro-Visual Landscape™. 

On the Ethias site, we see that the green objects all have the same shape, the same size and that they are separated by identical spaces. This shape, size and space is only used in one place.

The eye-tracking data our experts have been gathering for 8 years makes the behaviour that is determined by a pattern the brain has detected, an objective source of data. Let’s take the example of Ethias. The first green square will lead to longer and more ocular fixations; the second will have fewer fixations; and the third will have virtually none. 

Behavioural data has also revealed that one needs at least 3 elements for a pattern to emerge. Only then, there will be good continuity. I have applied this principle when I have created the Ethias site, in order to generate the visual pathways I wanted. 

This behaviour is generated when the screen is visited the first time, when the Netway Neuro-Visual Landscape™ is under construction. Once the brain has determined a pattern, it will no longer attribute a meaning to each and every object that is part of the same pattern.  

In the AXA screen, this principle has not really been used. We need to analyse all the graphical elements in order to determine their meaning. This is contrary to our findings in the article on the Netway Neuro-Visual Landscape™, stating most graphical elements that respect the principle of good continuity are not visible in peripheral vision. 

This Gestalt principle is dear to good designers who defend light screens that leave enough space between the different graphical elements.

By calibrating this space, and by using identical shapes and sizes, the principle of good continuity will have its effect. 

Have an excellent week. 

Les théories de la Gestalt font partie de la trousse à outils des experts en sciences comportementales afin de prédire comment le système visuel d’un utilisateur va répondre face à un écran.

Nous avons déjà abordé les deux premiers principes de la Gestalt : le principe de proximité et le principe de similarité.

Je me propose de t’emmener découvrir le troisième des sept principes : la bonne continuation.

Nous préférons percevoir des formes continues en termes de formes, tailles et espacement formant un pattern plutôt que des changements abrupts.

La bonne continuation permet au cerveau de ne pas devoir visiter toutes les zones à partir du moment où un pattern est découvert.

En effet, si le pattern est visible en vision périphérique, il sera facile pour le cerveau d’associer un seul sens au groupe d’objet ainsi que des coordonnées topographiques plus légères.

Cette loi de Gestalt est fortement liée aux deux premières lois permettant de construire un “Netway Neuro-Visual Landscape™“ fort.

Pour le site Ethias, les objets verts par exemple ont la même forme, la même taille et sont séparés par des espaces identiques. De plus cette forme, taille et espace n’est utilisé qu’à un seul endroit. 

Les données d’eye-tracking récoltées depuis 8 ans par nos experts objectivent le comportement lorsqu’un pattern est détecté par le cerveau. Prenons l’écran Ethias, les fixations oculaires seront plus longues et plus nombreuses dans le premier carré vert, un peu moins dans le second pour être presque inexistantes dans le troisième carré.

Les données comportementales récoltées nous ont également montré que, pour que l’effet de bonne continuation s’active, il faut au moins 3 éléments pour former un pattern. Pour Ethias, quand j’ai créé l’écran, j’ai utilisé ce principe afin de générer les chemins visuels que je souhaitais.

Ce comportement est généré lors de la première utilisation de l’écran, lors de la phase de construction du “Netway Neuro-Visual Landscape™” démontrant que le cerveau n’a plus besoin de donner un sens à un objet à partir du moment où ce dernier fait partie d’un pattern dont un des objets précédents a déjà été analysé par le cerveau.

Pour l’écran de AXA, ce principe est très peu présent. Cela se traduit par la nécessité d’analyser tous les objets graphiques pour en tirer l’essence. Or, comme nous l’avons vu dans l’article sur le “Netway Neuro-Visual Landscape™“, la plupart des composants graphiques qui respectent le principe de bonne continuité ne sont pas visibles en vision périphérique.

C’est ce principe de Gestlat qui est cher aux bons designers qui défendent le fait d’aérer un écran en laissant de l’espace entre les objets graphiques.

En calibrant cet espace, et en utilisant des formes et tailles identiques, le principe de bonne continuation se met en route.

Passe une excellente semaine.

Gestalt theories are part of the tools behavioural experts use to predict the response of a user’s visual system to a computer screen.

We saw the first principle in a previous post : similarity

Let’s now discover the second of seven principles in all, and talk about proximity. 

The brain associates visual elements with each other when they are close to each other or when the space between them is equal. 

This Gestalt law is closely linked to peripheral vision. As the latter is fuzzy, two elements that are close to each other will not distinguish themselves in the Netway Neuro-Visual Landscape™. 

This Gestalt law, as all the others, allows us to build a strong Netway Neuro-Visual Landscape™. 

On the Ethias site, the spaces and the connection between the graphical objects have been studied in order to respect the principle of proximity, on top of the principle of similarity.

The AXA screenshot, however, shows the space between the objects is very small and that all objects intermingle as to create 3 groups. With less graphical elements, the Ethias screen has more groups. 

Have an excellent week.