Archives par étiquette : expérience utilisateur

Journée Design Expérience Utilisateur à la cantine par Sylvie Daumal

Je n’ai participé qu’à la matinée de cette journée qui a commencé par la présentation de Sylvie Daumal au sujet de l’expérience utilisateur.

L’UX Design répond à la complexité grandissante de notre écosystème et de notre environnement.  Par exemple pour interagir avec sa banque, il y a de plus en plus de points et de canaux d’interaction, de points de contacts et avec de multiples supports. Or les entreprises n’ont pas pensé les choses de façon holistique (mais souvent par département). Une terminologie plus claire et cohérente par exemple permet d’économiser du budget dans l’entreprise. L’UX Design permet de penser les choses en terme d’expérience du point de vue du client et va jusqu’à modifier le business model canvas.

Business Model Canvas

Par exemple, le cœur de métier d’Amazon à l’origine était la logistique (avoir des entrepôts partout dans le monde) avant de devenir un des plus gros site web d’e-commerce mondiaux et un fournisseur de service informatique (Cloud en particulier).

L’approche UX a de nombreux avantages dont augmenter l’implication des acteurs dans le projet (équipe interne, test, co-creation, logique bottom-up), son pragmatisme qui garantit la performance financière ou encore la génération d’idées qui favorise l’innovation dans l’entreprise.

L’UX design est une méthode et surtout un état d’esprit. Il concerne tout produit ou service dont on fait un usage. C’est une garantie de performance économique et d’innovation.

J’ai ensuite participé à une séance de mise en pratique de l’UX Design avec un atelier dont le sujet était « Favoriser l’usage des moyens de locomotion non polluant à Paris »

L’atelier s’est fait en binôme (j’ai eu la chance de travailler avec Cyril Becquart du site Buzzcar) et était découpé en 4 parties :

  1. 10 min à imaginer seul des nouveaux services en fonction de ses besoins et de son expérience
  2. 15 min à interroger son binôme (sorte d’interview de l’utilisateur) avec différentes questions fournies : La fréquence des trajets journaliers en fonction du moyen de transport (bus, metro, velo, voiture, train, etc), ce qu’on aime, ce qu’on aime pas, ce qu’on aimerait avoir, ce qui nous a surpris le mois dernier). Chaque réponse devait être discutée en utilisant la technique des 5 pourquoi ?
  3. 20 min à imaginer 4 variations de nouveaux services en fonction des réponses de son binôme.
  4. 15 min à les présenter et à en discuter avec son binôme
  5. 15 min à imaginer les différents écrans de la meilleur idée

L’atelier s’est terminé par un tour de table où chacun présentait l’idée à l’ensemble des participants. On a pu voir d’ailleurs des idées originales 🙂  Une des idées principales qui est ressorti de notre côté  est le besoin d’avoir un service de cartes permettant de calculer les itinéraires en vélo avec différentes informations comme les réparateurs, les zones pour garer les vélos. Pour revenir au sujet de « Favoriser l’usage des moyens de locomotion non polluant à Paris », je pense que la gamification et des indicateurs pertinents pour comparer voiture versus moyen de transport non polluant seraient un atout.

Les émotions dans le design – les trois niveaux du design

Cet article est le deuxième d’une série d’articles autour des émotions dans le design après ma lecture des livres Design émotionnel de Aarron Walter et Design Emotionnel de Donald Norman.

On a beaucoup critiqué  « Le design des objets de tous les jours » de Donald Norman (vous pouvez trouver mon résumé ici) de donner naissance à des designs surement très utilisables mais aussi très moches. Il se défend dans Design émotionnel d’avoir voulu dénigrer les émotions et l’esthétisme mais élever l’utilisabilité au même rang que celles-ci. Mais il avoue qu’un design utilisable n’est pas nécessairement agréable. La question est : peut-on faire cohabiter le plaisir et l’utilisabilité ?

La réponse est bien sur oui !

 

Les études de Donald Norman ont mis en avant trois différents niveaux du cerveau :
– Une partie du cerveau pré-câblée et automatique nommée le niveau viscéral
– Une partie du cerveau qui contrôle le comportement de tous les jours nommée le niveau comportemental
– Une partie du cerveau contemplative qui est le niveau réflectif.

 

Chacun de ces niveaux interagissent entre eux. Une activité initiée du niveau viscéral vers le haut est appelée « bottom-up » et est poussée par les perceptions. Une activité initiée par le niveau réflectif vers le bas est appelée « top-down » et est poussée par la pensée.

 

Les réponses des humains aux objets de tous les jours sont complexes, déterminés par une large variété de facteurs.

Chacun des niveaux du design, viscéral, comportemental et réflectif, joue sa part dans le façonnement de l’expérience.

 

Le design viscéral.

Le design viscéral correspond à ce que la nature nous envoie comme émotions qui sont interprétées automatiquement.  A ce niveau, le look, les sensations et les sons dominent.  Il correspond à la réaction initiale face à un design.  Quand nous disons que quelque chose est joli, le jugement vient directement du niveau viscéral.

Le design viscéral concerne l’impact émotionnel immédiat d’un produit : son apparence, son toucher et son feeling.

 

Le design comportemental.

C’est l’aspect du design sur lequel se concentrent les spécialistes de l’utilisabilité.
A ce niveau, tout est à propos de l’utilisation. L’apparence n’a pas vraiment d’importance. La fonction vient en premier. Avec la fonction vient la compréhension et le secret d’une bonne compréhension est d’établir un bon modèle conceptuel.

Le challenge du designer est  de comprendre le réel besoin de l’utilisateur qu’il n’arrive pas toujours à clairement définir.

Il faut aussi voir qu’il y a deux types de développements de produit : l’amélioration et l’innovation.  On peut difficilement créer de l’innovation en demandant ce que veulent les clients potentiels.  Par contre l’amélioration vient principalement en regardant l’utilisation des produits existants par l’utilisateur.  Les groupes de discussion, les interviews et les enquêtes sont des mauvais outils pour comprendre le besoin de l’utilisateur. Le mieux est de voir l’utilisation dans une situation réelle pour comprendre ce que l’utilisateur n’aime ou n’aime pas.

A ce niveau, les émotions négatives viennent d’une mauvaise compréhension du besoin de l’utilisation.
Le design comportemental concerne son utilisation et l’expérience qu’on a avec le produit. L’expérience elle-même a différentes facettes : fonctionnalités, performances et utilisabilité.

 

Le design réflectif.

Le design réflectif couvre un grand territoire. C’est tout ce qui concerne le message, la culture et le sens du produit et de son utilisation. Que vous l’admettiez ou non, on se préoccupe tous de l’image qu’on renvoie aux autres.

Ce n’est qu’au niveau réflectif que la conscience et les plus hauts niveaux de feeling, d’émotion et de cognition réside. L’interprétation, la compréhension et le raisonnement viennent du niveau réflectif.

Ainsi les produits peuvent être plus que la somme de leurs fonctionnalités. Leur réelle valeur est de répondre aux besoins émotionnels des gens, de leur permettre de leur renvoyer l’image qu’ils souhaitent.  Le fait d’acheter une couteuse montre fait main ou des bijoux hors de prix ou encore une peinture originale plutôt qu’une parfaite reproduction à bas prix fait partie de ce besoin d’image et d’émotion. Le niveau réflectif détermine l’impression globale d’une personne à propos d’un produit.

Les parcs d’attraction sont des bons exemples d’interaction entre la réflexion et la réaction.  Il y a la fois le plaisir de la sensation et celui de dépasser sa peur.

 

Un exemple complet !


Donald Norman dans son livre donne l’exemple du casque des coachs de la National Footbal League (football américain). Pour les designers du casque, le plus dur n’a pas été la qualité ou les fonctionnalités mais de rendre les coachs eux même heureux de le porter. Le design devait donc avoir un attrait visceral et il devait remplir ses objectifs fonctionnels / comportementaux. Mais le plus dur fut de faire cela tout en satisfaisant les coachs, en leur renvoyant une image d’eux même forte, héroïque, de leaders disciplinés qui gère les joueurs les plus durs au monde et qui ont toujours le contrôle. Le plus dur fut donc de créer le design réflectif.

 

 

En conclusion, nous avons trois niveaux de design à prendre en compte quand nous réalisons un produit ou un service :

Visceral design > apparence
Behavorial design > le plaisir et l’efficacité d’utilisation
Reflective design > L’image personnelle, la satisfaction et les souvenirs

PS: Un slideshare en anglais : http://www.slideshare.net/JolienS/three-levels-of-design

Commentaires très intéressant que j’ai eu sur LinkedIn par Naji Bouchiba :

Les trois niveaux que représentent Norman ne sont que des reprises des théories des émotions :
1) Béhavioriste, les théories de Watson, Skinner, Duffy et Lindsay pour qui les émotions doivent être traitées comme des manières d’agir dans certaines situations. Ainsi à ce niveau l’approche scientifique doit s’en tenir aux manifestations corporelles/comportementales observables
2) Visceral, Les théories de James (théorie périphériques), selon James une émotion est une séquence d’événements qui commencent avec un stimulus et qui se terminent avec une expérience émotionnelles.
-Les théories de Cannon (théories Homeostatique des émotions) pour qui la signature physiologique des émotions serait indifférenciée (contrairement à James).
– Théories de MacLean (1949) avec la métaphore des 3 cerveaux. 1) Cerveau reptilien, 2) Cerveau viscéral (le siège des émotions d’où théorie viscéral) 3) le Cortex ou cerveau humain.
3) Réflective qui mélange les approches cognitives, (théorie de l’évaluation « appraisal » de Magda Arnold. L’interprétation cognitive des émotions de Schacter et Singer (1962), on parlera ici d’arousal (ressentir un état émotionnel). Les théories de Scherer, Lazarus, Fridja. Toutes ces théories sont mélangées à une approche psychanalyste de l’individu.
Je ne critique pas Norman, il a simplement relié des théories ensemble (cela a déjà été fait). Il ne manque pour ma part que les théories d’Ekman basées sur la reconnaissance faciale des émotions et les théories Neurocognitive de Damasio. Je travaille pour ma part sur l’élaboration d’une grille d’évaluation des émotions qui reprend toutes ces théories avec bien sur des approches sociocognitive, anthropologique notamment la cognition sociale. Le domaine du jeu vidéo semble être le plus propice à faire émerger naturellement les émotions. En tous cas l’article est fort intéressant !

Les émotions dans le design – cognition versus émotion

Cognition vs Emotion dans le design

Cognition vs Emotion dans le design

Cet article est le premier d’une série d’articles autour des émotions dans le design après ma lecture des livres Design émotionnel de Aarron Walter et Design Emotionnel de Donald Norman.

Nous allons d’abord voir comment les émotions agissent sur nos actions de tous les jours.

Dans la culture occidentale, nous avons une tendance commune à opposer la cognition à l’émotion. La où les émotions sont chaudes, animales et irrationnelles, la cognition est cool, humaine et logique. Ce contraste vient d’une longue tradition intellectuelle qui met en avant le raisonnement rationnel et logique. Les émotions n’ont pas leur place dans une société polie et sophistiquée. Ce sont les vestiges de nos origines animales au dessus desquelles nous, en tant qu’humain, devons nous élever.

 

Quelle erreur !

Les émotions sont inséparables de la cognition et même une part nécessaire de celle-ci. Tout ce que nous faisons ou pensons est teinté par nos émotions, la plus grande partie de ce mécanisme se faisant dans notre inconscient. En fait la plupart des comportements humains sont subconscients. La conscience arrive après, aussi bien dans l’évolution de l’espèce humaine que dans la façon dont le cerveau humain traite les informations. La plupart de nos jugements sont déterminés avant qu’ils atteignent notre conscience.

L’affect (dont voici la définition sur Wikipedia) et la cognition sont tous les deux des systèmes de traitement de l’information mais ils ont différentes fonctions.  L’affect fait des jugements et vous aide à déterminer rapidement quelles choses dans l’environnement sont dangereuses ou sures, bonnes ou mauvaises. Le système cognitif interprète et donne du sens au monde qui nous entoure. Les émotions sont les expériences conscientes de notre affect, complétées par l’attribution de la cause et l’identification de l’objet. Il faut aussi ajouter que la cognition et l’affect s’influencent l’un l’autre : certaines émotions et états affectifs sont poussés par la cognition, tandis que l’affect impacte toujours la cognition.  Le système affectif fonctionne indépendamment de la pensée consciente.
En clair les émotions changent la façon dont nous interprétons le monde!

Quand nous nous sentons bien, nous sommes plus créatifs, meilleur au brainstorming. Au contraire quand nous sommes anxieux, nous avons tendance à réduire nos processus de pensée. Quand vous êtes dans un état négatif, anxieux ou en danger, les neurotransmetteurs mettent en avant l’habilité de notre cerveau à se concentrer sur un sujet et sur les détails jusqu’à ce qu’une solution soit trouvée. C’est très important pour la survie.
Au contraire avec un affect positif, les neurotransmetteurs élargissent les traitements du cerveau. Nous sommes plus à même de voir les opportunités, d’être créatif et d’apprendre. Dans un état positif, nous sommes plus à même de voir la forêt plutôt que les arbres. D’ailleurs la plupart du temps la résolution de problème requiert une pensée créative. Une fois que l’étape créative est finie, il faut se concentrer sur les détails. Des dates limites un peu plus courtes pour se sentir inconfortable permettent d’avoir un affect négatif.

Les sciences cognitives ont prouvé que les designs plaisant et esthétique permettent de mieux travailler.

On comprend aussi l’intérêt de la gamification dans le cadre de la résolution de problème et de la créativité.

Les émotions et la mémoire étant fortement reliées. Les événements ayant une constituante émotionnelle forte persistent plus longuement dans notre mémoire et nous nous en rappelons plus précisément que des événements neutres. En fait ce que les gens chérissent ne vient pas uniquement de leur apparence ou de leur utilité. Ce qui est important c’est l’histoire de l’interaction. Nous nous attachons aux objets avec lesquels nous avons une association personnelle et significative et une des façons les plus puissantes d’amener cette association est à travers un sentiment d’accomplissement personnel.

 

En conclusion tout ce que vous faites à un composant cognitif et affectif.

Dans son livre Design émotionnel, Donald Norman décrit dans tout un chapitre la place et l’importance des émotions dans la robotique. Pour lui, les robots ne pourront égaler l’être humain que quand ceux ci auront acquis des émotions. Ce n’est pas le sujet de ce blog donc je ne m’y attarderais pas mais je conseille à toute personne intéressée par la robotique et l’intelligence artificielle d’y jeter un œil.

Design d’un formulaire web – Luke Wroblewski

Résumé de la vidéo Web form design par Luke Wroblewski

Cette présentation est passionnante, bien riche et remplie d’exemples concrets. Je conseille fortement de la voir pour tout ceux qui veulent améliorer l’expérience utilisateur et l’ergonomie de leur formulaire web (et clairement je pense que je vais essayer d’acheter le livre
Première constatation : les formulaires sont souvent mal faits.
Pourtant ils sont une part très importante du net aussi bien pour le client que l’entreprise. Énormément d’actions passent par un formulaire. Ils représentent même le dialogue du client avec l’entreprise.

Ils ont leur role dans :

  • le commerce car ils permettent à l’utilisateur d’acheter en ligne et à l’entreprise de maximiser ces ventes
  • l’engagement car ils permettent à l’utilisateur d’entrer et de manipuler des informations et à l’entreprise d’accumuler des données et du contenu
  • l’adhésion car ils permettent la participation de l’utilisateur et pour l’entreprise d’augmenter le nombre de client et de faire grandir des communautés

Par exemple, le formulaire d’upload des videos de Youtube a été redessiné de nombreuses fois vu sa fonction centrale.

Comment faire de meilleurs formulaires web ? Les dix meilleures pratiques

1 – chemin vers la complétion
Le but premier d’un formulaire est sa complétion en offrant une ligne de visualisation claire.

Ligne de visualisation non claire du formulaire

Ligne de visualisation non claire du formulaire

Ligne de visualisation claire du formulaire

Ligne de visualisation claire du formulaire

L’exemple ci dessus montre clairement l’importance de l’alignement et de la cohérence pour que l’utilisateur ne se « perdent » pas.
Il faut créer un flux visuel clair.

Il faut montrer à l’utilisateur son avancement par la portée, le progrès ou le statut.

Indicateur de progression pour l'utilisateur

Indicateur de progression pour l'utilisateur

En conclusion, il faut :

  • mettre en avant un chemin clair vers la complétion du formulaire
  • utiliser des barres de progression pour communiquer la portée, l’état et la position dans le formulaire
  • Si besoin de plus de temps ou d’une recherche d’information, fournir une page de départ
  • utiliser des indicateurs de progression plus généraux pour les formulaires avec des séquences variables suivant les besoins

2 – l’alignement
Il explique l’alignement des labels : au-dessus, a droite ou encore a gauche.
Le titre au-dessus se révèle le plus rapide pour les données familières mais demande plus d’espace vertical. Il permet aussi plus de flexibilité pour la localisation et les entrées complexes.
L’alignement à droite permet une bonne association entre le label et la zone de saisie, requiert moins d’espace vertical et a une complétion rapide mais il se révèle plus difficile à lire.
L’alignement a gauche est plus pratique pour les données non familières et permet de parcourir rapidement les labels par contre changer la longueur des labels peut invalider l’alignement du formulaire et la complétion est plus lente.
Mixer plusieurs alignement n’est pas bon.

Les labels dans la zone de saisie sont pratiques mais il faut être sur que l’utilisateur se rappellera de la question.
Il faut aussi les utiliser avec modération (formulaire avec uniquement des réponses mais pas de questions ?)

En conclusion, il faut :

  • utiliser l’alignement au dessus pour réduire les temps de complétion d’un formulaire avec des données familières
  • utiliser l’alignement à droite quand l’espace vertical est limité
  • utiliser l’alignement à gauche quand les données ne sont pas familières ou complexes

3 – Les aides et astuces
Elles sont utiles quand :

  • le formulaire demandent des données non familière
  • l’utilisateur peut se demander pour quel raison cette donnée est demandée
  • une manière recommandée de fournir la donnée
  • certaines données sont optionnelles

Cependant, les aides et astuces ne doivent pas envahir le formulaire.
Si c’est obligatoire, il faut peut être passer à une solution dynamique.
Par exemple quand l’utilisateur arrive dans le champs, une aide apparait. On peut aussi utiliser un bouton d’aide ou encore faire apparaitre une section d’aide.

Section d'aide à droite dans un formulaire

Section d'aide à droite dans un formulaire

En conclusion, il faut :

  • minimiser le besoin d’aide et astuces pour remplir un formulaire
  • favoriser une aide visible et proche qui est plus utile
  • utiliser un système activé par l’utilisateur pour formulaire complexe et souvent réutilisé
  • utiliser une aide directement inclue dans le champs de saisie à moins que vous ayez beaucoup de contenu (texte, graphique, tableau)
  • utiliser un système cohérente si vous avez beaucoup d’aide

4 – validation en ligne
Il faut fournir une validation directement à l’insertion des données, suggérer des données valides ou encore aider l’utilisateur à rester dans les limites.
Il faut aussi bien faire en sorte que les validations soient cohérentes (exemple du « confirm » qui vérifie juste l’égalité des deux champs ou encore ne refait pas la vérification quand la valeur initiale change).
Il compare énormément la qualité d’enregistrement entre Yahoo et Twitter.

Validation du formulaire sur Twitter

Validation du formulaire sur Twitter

Validation du formulaire sur Yahoo

Validation du formulaire sur Yahoo

En conclusion, il faut :

  • utiliser une validation directement dans le champs de saisie pour les champs de saisie où il y a potentiellement beaucoup d’erreurs
  • utiliser des suggestions d’entrées pour lever des ambiguïtés
  • communiquer les limites

5 – Actions
Toutes les actions sur un formulaire (bouton) ne sont pas équivalentes.
Par exemple « Effacer tout », « Annuler » et « Retour en arrière » sont des actions secondaires rarement utilisées. « Sauver », « Continuer » et « Soumettre » sont des actions primaires directement responsables de la complétion du formulaire.

Différentier les actions primaires et secondaires dans un formulaire

Différentier les actions primaires et secondaires dans un formulaire

Il faut les différentier (Gras, taille, couleur, etc..).

En conclusion, il faut :

  • éviter les actions secondaires si possible
  • faire une distinction visuelle claire entre les actions primaires et secondaires
  • aligner les actions primaires avec les champs de saisie pour un chemin de complétion clair

6 – Actions en attente
Certaines actions nécessitent du temps de traitement (soumission de formulaires, calculs, uploads).
Il faut fournir un retour d’informations par exemple désactiver le bouton de soumission le temps du traitement.
On peut profiter du temps d’attente pour afficher des informations.

7 – Erreurs
Quand une erreur se produit, c’est l’information la plus importante du formulaire car elle vous empêche d’aller plus loin.

Indiquer clairement les erreurs et les associer avec le champs responsable.

Indiquer clairement les erreurs et les associer avec le champs responsable.

En conclusion, il faut :

  • indiquer clairement qu’une erreur à eu lieu : placement au dessus et contraste visuel
  • fournir des actions de correction
  • associer le champ erroné avec le message d’erreur
  • ne pas hésiter à « doubler » les informations où l’erreur a eu lieue

8 – Les entrées non nécessaires
Chaque question demande aux utilisateurs de la comprendre, de formuler une réponse et d’entrer cette réponse.
Soyez vigilant sur chaque question en se posant ces trois questions :

  • Peut elle être enlevée ?
  • Peut elle être remise à plus tard ?
  • Peut elle être devinée ?

Enlever des informations peut avoir un grand impact sur la complétion d’un formulaire par exemple le type de carte de paiement n’est pas nécessaire.
Utiliser le code postal pour renseigner directement la ville et l’état.
Il ne faut pas non plus compliquer le traitement dans le seul but d’enlever question.

9 – l’organisation du formulaire
Cela dépend. Il faut essayer d’avoir une conversation, de parler d’une seul voix ou encore d’utiliser les coupures naturelles.
Luke montre un superbe exemple d’un « simple » formulaire de contact qui au fil des besoins (ingénieurs, marketing, légal…) devient très complexe et inutilisable.

Exemple d'un formulaire sous forme d'une conversation.

Exemple d'un formulaire sous forme d'une conversation.

En conclusion, il faut :

  • prendre le temps d’évaluer chaque question que l’on pose
  • assurer la cohérence
  • se forcer à être succinct
  • utiliser une seule page web si le formulaire peut se diviser en plusieurs sujets courts
  • utiliser une seule longue page quand il y a de nombreuses questions mais sur un seul sujet
  • au contraire utiliser plusieurs pages quand un formulaire contient de nombreuses questions avec peu de sujets

10 – L’engagement graduel
Un bouton de soumission avec un label en rapport avec le titre de la page.
D’après Luke, les formulaires d’inscription doivent disparaître.
Les services web devraient provoquer l’engagement :

  • expliquer ce que fait le service
  • permettre aux personnes de l’utiliser
  • avoir l’inscription comme résultat

En conclusion, il faut :

  • essayer d’éviter les formulaires
  • mettre en avant le cœur de votre service avec le moins d’interaction possible
  • faire en sorte que l’utilisateur réussisse du premier coups
  • , si vous générer des comptes automatiquement, faire en sorte que l’utilisateur puisse y accéder des façon claire
  • utiliser une seule longue page quand il y a de nombreuses questions mais sur un seul sujet
  • ne pas distribuer divers champs de saisie dans des formulaires sans prendre en compte l’engagement

Chemin désiré

Le chemin désiré (desire line en anglais) fait généralement référence au chemin que les gens vont naturellement utilisé, par exemple le raccourcis vers une destination s’écartant du chemin clairement défini, mais ce principe peut être appliqué de façon plus large à n’importe quel signe ou trace d’activité utilisateur dans un environnement.
L’affirmation implicite est que le chemin désiré représente une indication non biaisée de comment un objet ou un environnement est utilisé ce qui est une information précieuse pour savoir comment designer ou redesigner un produit ou un environnement.
Par exemple la reconstruction des allées dans le Central Park de la ville de New York fut basé sur le pavage des chemins désirés qui furent créé aux cours des ans par les nombreux visiteur plutôt que de repaver les chemins existants.

Les architectes paysagistes utilisent cette méthode pour déterminer les chemins les plus pratiques pour les utilisateurs et ensuite les paver. Cette méthode est bien plus pratique que d’essayer de déterminer le chemin qui sera utilisé dans le paysage, le paver et ensuite réaliser que celui-ci ne correspond pas à la réalité.

Bien sur ce principe a une utilité qui ne se limite pas au design des allées. Par exemple, utiliser un clavier traditionnel force les poignets à se tordre ce qui entraine lors d’une utilisation intensive des douleurs et pour cette raison des constructeurs ont décidé de construire des claviers qui se sépare en leur centre (voir photo ci-dessous).

Clavier ergonomique de Microsoft

Clavier ergonomique de Microsoft

On peut aussi utiliser ce principe grâce à des outils de suivi du regard ou « eye-tracking » qui génèrent des  « cartes de chaleurs » permettant de connaître le chemin désiré par l’utilisateur, ces préférences, ces zones d’attirance.. Les résultats permettent d’optimiser le design d’une interface ou d’un site web.

Eye Tracking d'un site e-commerce

Eye Tracking d'un site e-commerce

Le sujet est à approfondir mais déjà un lien pour compléter.

Il faut utiliser ce principe de chemin désiré dans les projets qui mettent en avant l’utilisabilité. Quand c’est possible, il faut utiliser des méthodes permettant de connaître ce chemin désiré afin de finaliser le design. Les utilisateurs peuvent faire apparaître à posteriori un chemin désiré : il faut alors voir le coût pour l’utilisateur. Si celui-ci est minime, ce n’est pas grave. Cependant si celui-ci est important, il est intéressant de modifier le design pour correspondre au besoin de l’utilisateur que d’essayer de modifier son usage.

Texte traduit provenant de Universal Principles of Design

Controle

Les utilisateurs devraient pouvoir contrôler ce que le système fait mais ce niveau de contrôle dépend de sa compétence et de son expérience à utiliser le système.

Les débutants sont plus à l’aise avec un niveau de contrôle limité tandis que les experts ont besoin d’un plus grand niveau de contrôle. On peut bien sur prendre l’exemple de l’apprentissage du vélo.
Un système peut s’adapter à ces différents besoins en offrant de multiple façons de réaliser une tâche. Il y a par exemple la présence d’une action à la fois accessible par un menu et par un raccourcis clavier. La première façon met en avant la simplicité et la structure tandis que la deuxième favorise l’efficacité et la flexibilité. Ce compromis est standard. Les débutants ont besoin d’une interaction structurée avec des contraintes et de l’aide. Les experts vont préférer une interaction moins structurée et plus directe.

Comme mettre en place plusieurs méthodes augmente la complexité du système,  le nombre de méthodes possibles devrait être limité à 2 : une pour le débutant et une pour l’expert.
Le besoin de raccourcis pour les experts est nécessaire pour des systèmes assez fréquemment utilisé et complexe pour que les utilisateurs développent une expertise. Des systèmes comme un distributeur de billets peut être conçu en considérant toujours l’utilisateur comme un débutant. La possibilité de personnaliser le design du système est le plus haut niveau de contrôle possible. Cela permet à l’apparence et la configuration du système de s’aligner avec les préférences personnelles et les compétences de l’utilisateur.

Personalisation de Word

Personalisation de Word

Dans l’idéal, il faut utiliser un design qui soit également efficace et simple pour le débutant et l’expert. Mais dans de nombreux cas, il est utile d’offrir une méthode pour le débutant et une pour l’expert. Il faut dissimuler les méthodes de l’expert pour minimiser la complexité pour le débutant. Enfin quand un système est complexe et fréquemment utilisé, il est intéressant de proposer un système configurable pour s’adapter au préférence et à l’expertise de l’utilisateur.

Texte traduit provenant de Universal Principles of Design

L’effet lié à la biophilie

Cela a été testé empiriquement, l’exposition à la nature offre des bénéfices émotionnels, cognitifs et physiques. Un des résultats intéressants est que cet effet ne nécessite pas de réelles plantes dans l’environnement mais des images peuvent suffire par exemple un poster sur le mur.

Les environnements riches en vue sur la nature permet de réduire le stress ainsi qu’améliorer la concentration.

L'effet biophile d'un aquarium

Cette technique est surtout intéressantes en architecture mais peut surement être employée dans d’autres domaines du design.

Texte traduit provenant de Universal Principles of Design

Ouverture UX-FR !

minority_report - interactive UI

J’ouvrirai ce site avec une video de Minority Report. Ce film à grand spectacle de 2002 réalisé par Steven Spielberg a permis de faire découvrir au grand public une vision futuriste de l’interface homme machine. Cette vision est en fait directement issu des recherches du MIT sur l’ergonomie et le futur de l’interface homme machine et elle risque d’être une réalité plus rapidement qu’on aurait pu le croire (en dehors de la précognition bien entendu 🙂 ).

[youtube NwVBzx0LMNQ – Minority Report – Interactive UI]

Il a fallu une vingtaine d’années pour passer de la ligne de commande à l’interface graphique puis une dizaine pour voir ces « interfaces riches » apparaitre sur le web grâce à Ajax. En 2007, c’est le lancement fulgurant de l’iPhone. 2008 Microsoft lance Surface puis annonce Project Natal.
Actuellement, le coût de développement de l’IHM représenterait entre 40% et 70% des coûts totaux de développement d’un projet et, avec l’arrivée de nouvelles technologies telles que les RIA, les smartphones ou encore les surface tactiles, ce cout ne va cesser d’augmenter, surtout si les compétences ne sont pas présentes dans l’entreprise.
En clair, l’interface graphique prend une place primordiale et grandissante dans l’entreprise et dans la vie de tout les jours.
Nous lançons ce site ainsi qu’un ensemble d’outil de partage (flux twitter et user group) pour partager la connaissance de l’expérience utilisateur mais aussi pour fédérer l’ensemble des personnes pour qui l’expérience utilisateur est une passion

Les premiers articles présentent Android ainsi que le Design of Everyday Things de Don Norman.

Le but est aussi de présenter de façon régulière un principe de design tiré de Universal Principles of Design.

Yannick Grenzinger