My masters of thought and action28.02.09
To build efficient interfaces, one needs thoughts and letters.
Thoughts define letters: it is the primary occupation that allows a behavioural expert to grow in his work.
The letter serves the mind and is constituted of knowledge and knowhow that allow one to realise his mind.
The below sentences trace the framework in which I work with thoughts and letters.
“Excellence means when a man or woman asks of himself more than others do.”
— Jose Ortega y Gasset
“I owe my success more to the diversity of people I have met than to my intelligence.”
— Linus Pauling.
I would like to thanks these 4 great personalities that inspire me every single day:
- Leonardo da Vinci who combines science and art. The great pioneer of our profession. Thanks to his endless curiosity, he has observed, analysed, and calculated the ocular guidance of people watching his paintings. An unparalleled master of geometrical and graphical composition.
- Jef Raskin, atypical personality who combines degrees in maths and philosophy. An extraordinary human being interested in human behaviour as no other, who has invented the foundations of the mind’s ergonomics. His pioneering work in the domain of behavioural sciences has led him to create the very first Macintosh interface. Jef, thanks for all your work! You have left us, but your passion and contributions will remain with us, and will remain a reference to me.
- Thierry Baccino, a man who has made great contributions to behavioural sciences. He has a PhD in cognitive psychology and is by far the number one in behavioural measurements in Europe. A scientist for whom the analysis of human behaviour, using measures, has become an obsession. Thanks, Thierry, for your groundbreaking work and your presence by my side.
- John Maeda is an artist and a scientist who is obsessed with simplicity. At the MIT, he and his team have observed and analysed the necessary factors of simplicity. A simple, audacious and remarkable human being. John, your vision of simplicity goes far beyond the principles of common sense. Thanks for your work and see you soon.
Thanks to all of you who participate day after day in the construction of a new profession that will make the digital life easier for millions of users around the world.
Mes maîtres à penser… et à agir28.02.09
Pour réaliser des interfaces efficaces, il y a l’esprit et la lettre.
L’esprit définit la lettre, c’est l’occupation première au sein de laquelle un expert en sciences comportementales évolue dans son travail.
La lettre est au service de l’esprit, elle est constituée de tout un savoir et un savoir-faire qui permettent de réaliser l’esprit.
En ce qui me concerne, deux phrases résument le cadre dans lequel je réalise l’esprit et la lettre :
“Excellence means when a man or woman asks of himself more than others do.”
— Jose Ortega y Gasset
“Je dois mon succès à la diversité des gens rencontrés plus qu’à mon intelligence.”
— Linus Pauling.
Je voudrais remercier ces 4 grands personnages qui m’inspirent chaque jour :
- Leonardo da Vinci qui, alliant sciences et arts, a été le précurseur de notre métier. Avec sa grande curiosité il a observé, analysé, mathématisé le guidage oculaire sur ses toiles. Un maître incontesté de la composition géométrique et graphique.
- Jef Raskin, personnage atypique, combinant doctorat en mathématiques et en philosophie. Un être humain extraordinaire s’étant intéressé au comportement humain comme personne d’autre, en inventant les fondements de l’ergonomie de l’esprit. Son travail de précurseur dans le domaine des sciences comportementales l’a amené à créer la première interface Macintosh. Jef, un grand merci pour ton œuvre. Tu nous as quitté mais ta pierre à l’édifice et ta passion restent et resteront longtemps une référence pour moi.
- Thierry Baccino, un homme qui apporte beaucoup de choses aux sciences comportementales. Il est titulaire d’un PhD en psychologie cognitive et est de loin le meilleur scientifique en mesures comportementales en Europe. Un scientifique pour qui l’analyse du comportement humain au travers de mesures est une obsession. Merci Thierry pour ton travail de fond et ta présence à mes côtés.
- John Maeda est un artiste et un scientifique dont l’obsession est “la simplicité”. Travaillant au MIT, il a observé et analysé avec son équipe les facteurs nécessaires afin que la simplicité soit au rendez-vous. Un être humain simple, audacieux et remarquable. John, ta vision de la simplicité est loin au-dessus des principes de bon sens. Merci pour ton travail et à bientôt.
Merci à vous aussi de participer, jour après jour, à la construction d’un nouveau métier visant à rendre la vie digitale simple pour des millions d’utilisateurs dans le monde.
Mislead visual behaviour with Gestalt – the principle of proximity21.02.09
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.
Induire un comportement visuel avec la Gestalt – principe de proximité21.02.09
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 vu le premier principe de Gestalt dans un article précédent : la similarité
Je me propose de t’emmener découvrir le deuxième des sept principes : la proximité.
Le cerveau associe des éléments visuels lorsqu’ils sont proches les uns des autres ou si les espaces entre eux sont équivalents.
Cette loi de Gestalt est fortement liée à la vision périphérique. En effet, comme la vision périphérique est floue, deux composants proches ont tendance à ne plus se démarquer l’un de l’autre dans le “Netway Neuro-Visual Landscape™”.
Donc cette loi de Gestlat, comme toutes les autres, permet de construire un “Netway Neuro-Visual Landscape™” fort.
Pour le site Ethias, les espaces et le rapprochement des objets graphiques sont calculés afin que les groupes d’objets en plus de respecter le principe de similarité soient renforcés par le principe de proximité.
Dans le cas de l’écran de AXA, les espaces sont très faibles et tous les objets s’entremêlent pour laisser se dégager 3 groupes. Avec moins d’éléments graphiques, l’écran de Ethias compte plus de groupes.
Passe une excellente semaine.
Simplicity: my very own state of mind16.02.09
When we create digital interfaces, simplicity is a constant issue.
What is simple and what is not? How do we take into account simplicity in our everyday lives?
Personally, I like to think of one of my great examples, John Maeda.
Here’s his analogy, in two steps:
Step 1: ask a child to choose between a large cookie and a small one. Which one do you think he will choose?
Even if you explain to the child there is more chocolate in the small cookie, he or she will still prefer the larger one.
Step 2: ask a child which pile of dirty laundry he wants to sort. Which one will he choose?
He will prefer the smaller one as it represents less work.
Observation: when you want to have fun, you always want more. When an effort is needed, you will try to optimize your energy in order not to have to make too big an effort.
Here’s my state of mind when I’m creating digital interfaces: you have a simple interface when users can perform their tasks with a maximum of fun and a minimum of effort.
A simple sentence that reveals all the concepts of human behaviour: from the motivational drivers to the capabilities of perception and cognition the brain will attribute to perform a certain task.
Créer la simplicité : mon état d’esprit en quelques lignes16.02.09
Lorsque nous créons des interfaces digitales, se pose en permanence la question de la simplicité.
En quoi consiste quelque chose de simple ? Comment garder à l’esprit la simplicité dans notre quotidien ?
Personnellement, j’utilise une analogie d’un de mes maîtres à penser, John Maeda.
Je voudrais la partager avec vous en deux étapes :
Etape 1 : si vous demandez à un enfant de choisir entre un grand cookie et un petit cookie, d’après vous lequel va-t-il choisir ?
Même si vous expliquez à l’enfant qu’il y a plus de pépites de chocolat dans le petit cookie, il voudra le grand cookie.
Etape 2 : si vous demandez à un enfant de ranger une pile de linge sale, d’après vous quelle pile choisira-t-il ?
Il choisira la petite pile pour ne pas devoir trop travailler.
Observation : lorsque l’on veut s’amuser, on en veut plus. Lorsqu’on doit faire un effort, on cherche à optimiser notre énergie pour ne pas en utiliser de trop.
Mon état d’esprit permanent lors de la création d’interfaces digitales : la simplicité est que les utilisateurs arrivent à réaliser leurs tâches avec le plus de plaisir possible et le moins d’effort.
Derrière cette simple phrase se cachent tous les concepts liés au comportement humain, depuis la motivation jusqu’aux capacités perceptivo-cognitives que le cerveau alloue pour réaliser une tâche.
Mislead visual behaviour with Gestalt – the principle of similarity8.02.09
Gestalt theories are part of the tools behavioural experts use to predict the response of a user’s visual system to a computer screen.
Let’s now discover the first of seven principles in all: the principle of similarity.
When two elements have a similar size and shape (and less similarity in colour or orientation), the brain will link them together when it is treating the visual data in the Netway Neuro-Visual Landscape.
In the Ethias screen all graphical elements are linked to a similar object. The brain will give a meaning to those 4 types of objects, instead of having to give a meaning to the 14 separate elements.
On the AXA site, however, there are only 5 similar objects and 12 objects that aren’t linked to each other by their size or shape. The brain must give a meaning to 5 associations and 12 objects, what comes down to 17 meanings instead of the 4 meanings in the Ethias case.
We can also prioritize the zones of the screen by applying the principle of similarity.
When I was making the Ethias screen, I made the green zones the most important, followed by the orange, blue and red zones. This choice was made in order to meet the business objectives and the tasks people would want to perform on an insurances site.
This is but one of the seven principles an expert will take into account, on top of other state-of-the-art techniques, to build this type of result.
Have an excellent week.
Induire un comportement visuel avec la Gestalt – principe de similarité8.02.09
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 premier des sept principes : la similarité.
Si deux éléments sont similaires en taille et en forme (et moins en couleur ou en orientation), alors le cerveau, lors du traitement des données visuelles dans le “Netway Neuro-Visual Landscape”, les associera.
Dans le cas de Ethias tous les composants graphiques de l’écran sont associés à un objet similaire.Le cerveau peut donc donner un sens à chacun de ces 4 types d’objets plutôt que de devoir donner un sens à 14 éléments.
Pour AXA en revanche, il y a 5 associations d’objets similaires et 12 objets n’ayant aucune association de taille et forme avec un autre élément. Le cerveau devrait donc donner un sens à 5 associations + 12 objets, soit 17 significations… à la place de 4 chez Ethias.
On peut également donner une priorité aux zone d’un écran en utilisant le principe de similarité.
Par exemple lorsque j’ai réalisé l’écran Ethias, j’ai donner plus de poids aux zones vertes, ensuite aux zones oranges, ensuite aux zones bleues et rouges. Ce choix a été réalisé en fonction des objectifs business à atteindre et des tâches que les gens souhaitent réalisé sur un site d’assurances.
Il ne s’agit ici que d’une seule loi qu’un expert complète avec les 6 autres et encore d’autres techniques de pointes pour arriver à ce résultat.
Passe une excellente semaine.
Build the “Netway Neuro-Visual Landscape”™ of an interface1.02.09
It is possible to attract the attention of users towards the most important visual elements of an interface. There are different techniques to do so.
In a previous post, we have seen that one of the main elements to obtain this result is the use of an efficient “Netway Neuro-Visual Landscape”™.
In this post, I want to introduce three expert techniques that intervene in this type of work:
- the number of graphical elements on a screen,
- the geometrical structure of the screen,
- the visual hierarchy within the screen.
Before explaining how to use these techniques, it is important to understand their relevance.
Let’s have a look at two insurances sites: the Ethias site (ethias.be) and the new AXA site (axa.fr).
I have taken similar sites: the tasks surfers will perform on these two sites, are largely similar.
Let’s start by comparing the number of graphical elements in the two screens.
The Ethias screen is composed of 14 graphical zones, whereas AXA counts 26.
When we analyze the first ocular fixation, we get the information our eyes will send to the brain.
The more zones are used in the “Netway Neuro-Visual Landscape”™, the more difficult it will be for our brain to distinguish the zones and to isolate them in the peripheral vision.
On the Ethias site, we see that 12 out of 14 zones are easily distinguishable one from the other. This is not the case for the two green buttons at the top right of the interface.
A conscious choice: the size of the action button zone gets more weight in our peripheral vision and is more important in the “Netway Neuro-Visual Landscape”™.
On the AXA site, we see that there is not enough space between a number of zones. As a result, these zones are not easily distinguishable one from the other. This could have been avoided if the knowledge of the human visual system would have been put into practice.
Moreover, 13 types of content are not visible at the first fixation. If these zones are not visible, then why would our brain direct our eyes to visit these zones?
Let’s now compare the geometrical structure and the visual organisation of the screens.
The Ethias site has a geometrical structure. The different zones of the screen have also been organized.
Welcome to the concrete application of the Gestalt principles. Similitude, proximity, good continuity, symmetry… All these principles have been used when I was creating this screen (I will get back to these principles in coming articles).
The AXA site has little geometrical structure and a weak visual organisation.
So, why would it be so important to have a good geometrical structure and visual organisation?
The answer can be found in our brain: it contains a zone that memorizes the topographical data of the screen in front of it, and gives these data a meaning.
More geometrical structure means our brain needs to store less topographical information. The result: a strong “Netway Neuro-Visual Landscape”™.
A strong “Netway Neuro-Visual Landscape”™ allows our brain to build a visual hierarchy between the different elements of a screen and to determine strong topographical anchor points. This will help the user to quickly find what he is looking for and to easily use the screen in front of him.
I hope you now see why this technique is so important. I will get back to it in the next post and talk about focal points and visual pathways.
The name “Netway Neuro-Visual Landscape”™ and the concept behind the name is protected by the iDEPOT004412.
Construire le “Netway Neuro-Visual Landscape”™ d’une interface1.02.09
Attirer l’attention des utilisateurs vers les éléments visuels les plus importants d’une interface est possible. Différentes expertises techniques permettent de réaliser cela.
Dans un post précédent nous avons vu qu’un des éléments primordiaux pour arriver à ce résultat est d’obtenir un “Netway Neuro-Visual Landscape”™ efficace.
Dans ce post, je vais introduire trois expertises techniques qui interviennent dans ce travail
- le nombre de composants graphiques dans un écran,
- la structure géométrique de l’écran
- la hiérarchie visuelle au sein de l’écran
Avant d’expliquer comment les utiliser, il est important de comprendre pourquoi les utiliser.
En guise d’exemple, j’ai pris deux sites issus de l’industrie des assurances : le site de Ethias (ethias.be) et le nouveau site de AXA (axa.fr).
J’ai choisi des sites comparables, c’est-à-dire dont les tâches à réaliser par les internautes sont fortement similaires.
Commençons par comparer le nombre de composants graphiques dans les deux écrans.
L’écran de Ethias est composé de 14 zones graphiques contre 26 pour l’écran de AXA.
En analysant la première fixation oculaire, voici ce que le cerveau va recevoir de la part des yeux.
Plus le “Netway Neuro-Visual Landscape”™ comprend de zones, plus il est difficile pour le cerveau de les distinguer et moins il est facile de les isoler dans le champ de vision périphérique.
Sur le site de Ethias, on observe que 12 zones sur 14 peuvent être distinguées les unes des autres et les deux boutons verts en haut à droite de l’interface se confondent.
Cet effet est volontaire afin de d’accentuer la taille de la zone des boutons d’action en vision périphérique et de donner un poids plus important à ces deux éléments dans le “Netway Neuro-Visual Landscape”™.
Sur le site de AXA, on observe que plusieurs zones se confondent par manque d’espaces entre les zones. Ceci aurait pu être évité en connaissant le système visuel humain.
De plus 13 contenus ne sont pas visibles lors de la première fixation. Si ces zones ne sont pas visibles, pourquoi le cerveau enverrait-il les yeux dans ces zones ?
Comparons maintenant la structure géométrique et l’organisation visuelle des écrans.
Le site de Ethias présente une structure géométrique et une organisation visuelle importantes entre les différentes zones de l’écran.
Bienvenue dans l’application concrète des lois de Gestalt : les principes de similitude, de proximité, de bonne continuité, de symétrie… ont tous été appliqués lorsque j’ai créé cet écran (je détaillerai ces lois dans de prochains articles).
Le site de AXA ne présente que peu de structure géométrique et d’organisation visuelle.
Alors pourquoi est-il tellement important d’avoir une structure géométrique et une organisation visuelle ?
Et bien, notre cerveau comporte une zone qui mémorise les coordonnées topographique de l’écran qu’il a devant les yeux et associe à ces coordonnées un certains sens.
Plus il y a de structure géométrique, moins le cerveau doit stocker d’informations topographiques différentes et plus le “Netway Neuro-Visual Landscape”™ sera fort.
Un “Netway Neuro-Visual Landscape”™ fort permet au cerveau de construire une hiérarchie visuelle entre les différents composants d’un écran et permet de fixer des points d’ancrage topographiques forts afin d’aider l’utilisateur à trouver rapidement ce dont il a besoin et à utiliser avec aisance l’écran.
J’espère que tu vois mieux maintenant l’importance de cette technique que je continuerai à compléter dans le prochain post avec la notion de points focaux et de chemins visuels.
The name “Netway Neuro-Visual Landscape”™ and the concept behind the name is protected by the iDEPOT004412.















