04 February 2012

Inscrivez-vous au Flux RSS

L’art de l’Interview pour l’UX ou…

Posté par jc-Qualitystreet le 7 mars 2011

… les bonnes questions quand il le faut !

Dans l’univers IT, et plus spécifiquement en conception / évaluation de produits, l’Interview reste une technique de base, indispensable. Les verbalisations sont en effet nécessaires pour comprendre les usages et situations de travail, pourtant l’entretien est à utiliser AVEC DE RÉELLES PRECAUTIONS…

L’interprétation et la compréhension de nos propres  comportements correspondent en effet rarement à la façon dont on s’est vraiment comporté…

bref, ce que les utilisateurs disent et ce qu’ils font réellement, est différent.

J’utilise beaucoup l’interview, dans le cadre de mes activités de coaching  comme dans un contexte plus UX dans les projets de développement d’applications informatiques. D’ailleurs interviewer est au cœur de très nombreux métiers, et pourtant…

De vraies limitations dont il faut tenir compte…

On s’aperçoit tous  au quotidien que nous autres, êtres humains, ne sommes pas vraiment « cablés » ou « équipés » pour faire des estimations; vos utilisateurs, ne le sont pas non plus pour se souvenir d’une utilisation passée d’un produit ou spéculer sur un futur usage.

Petit retour à la réalité…

Oui, vos utilisateurs oublient,

Vos utilisateurs vont chercher à généraliser !

Vos utilisateurs vont chercher à  idéaliser !

Vos utilisateurs vont chercher à simplifier !

ça se complique donc et au cas où vous l’auriez oublié, vos utilisateurs ne sont pas des concepteurs : imaginer le produit du futur ce n’est pas leur boulot, les interroger sur la pertinence d’un futur choix d’interface, encore moins.

D’ailleurs est ce que cela les intéresse réellement ?

Go & See … Show and Tell…

Rien de tel !
et en anglais parce que cela sonne mieux.

Compte tenu des limitations précédentes, que nous reste-il ?

La réponse se fait sans nuances : aller et voir sur le terrain (d’ailleurs l’un des 14 principes du Lean Management). Observer et aller interviewer sur le lieu de travail les personnes qui utilisent le produit. Leur demander de vous montrer, de vous  expliquer comment elles font ; les observer en situation d’usage.Voilà la clé du succès… et la seule façon à terme de « ravir vos utilisateurs ».

Voilà aussi pourquoi les tests utilisateurs fonctionnent ou pourquoi les méthodes agiles, avec leur démonstration, leurs  livraisons toutes les 2/3 semaines et la recherche permanente du feedback donnent tant satisfaction. Bref, en matière d’entretien sur les usages, beaucoup se joue sur le concret et l’instantané.

Interviewer “quand il le faut” et sur les bons sujets!

Quant il est question d’usage, l’interviewer doit mener l’entretien quand il le faut et au maximum rechercher le présent, le concret et se raccrocher à la réalité de la personne (commentaires in situ, impressions après utilisation) pour tirer quelque chose de pertinent de sa collecte d’informations.

Et puis, il y a toujours ces bons sujets que l’interview permet d’aborder avec efficacité. Par exemple, à titre personnel, j’aime bien assoir ma démarche de construction des Personas sur l’interview d’un certain nombre d’utilisateurs… pour explorer:

  • l’activité, le travail à faire, le domaine
  • les buts à atteindre
  • les motivations
  • les attitudes
  • les difficultés rencontrées, les frustrations et caractériser les problèmes

Autant d’éléments de l’analyse ergonomique que l’interview permet d’appréhender.

Pour revenir sur un usage passé en contournant les biais décrits précédemment, certaines techniques d’entretien peuvent s’avérer très précieuses (technique de l’incident critique de John Flanagan, storytelling sur des cas extrêmes, focus sur les exemples…)

Et pour finir mes règles d’or réactualisées

  1. Transformer l’entretien en conversation, souple pour laisser de la place à l’interviewee mais aussi structurée  (intro-ouverture -générique - spécifique -clôture)
  2. Se mettre dans une posture d’apprenant… en restant neutre, attentif voire naif
  3. Adopter une écoute active et encourager l’expression en proposant régulièrement des indices non verbaux signes d’intérêt et de curiosité
  4. Laisser l’autre sur le devant de la scène : ne pas parler plus que l’autre (max. 30 % de temps de parole)
  5. Privilégier les questions ouvertes en évitant les questions fermées et « orientées » suscitant des réponses préétablies
  6. Solliciter un maximum d’exemples et d’histoires spécifiques permettant aux utilisateurs de retrouver leur concret
  7. Exploiter les silences… en cas de doute toujours attendre avant de parler :)
  8. Ne pas interrompre mais réitérer à des moments clés (écho, résumé, élucidation)

Design d’interface et critère ergonomique 11: Compatibilité

Posté par jc-Qualitystreet le 23 février 2011

Ma liste de critères ergonomiques pour la conception d’interface contient 11 critères. C’est une liste personnelle, établie au départ sur la base des normes & standards existants (ISO 9241, AFNOR Z67 133, Bastien & Scapin, Heuristiques US …), que je m’efforce de partager au quotidien avec les équipes de développement tout en sensibilisant le métier sur la question.

Compatibilité : en quoi ça consiste ?

C’est s’adapter aux modes opératoires de l’utilisateur (mais aussi tenir compte des contextes et situations similaires).

Ce 11ème et dernier critère se réfère en premier lieu à l’accord existant entre les caractéristiques des utilisateurs (caractéristiques physiques, psychologiques, démographiques, expérience, compétences, attentes, besoins…), les tâches et les éléments d’interface et d’interactions.

La compatibilité concerne aussi la capacité de l’application à s’inscrire dans des standards établis pour des contextes similaires. On parlais beaucoup des standards Windows; on parle toujours des standards Web…Les standards d’accessibilité relèvent donc en partie de critère.

Des standards pour les interfaces mobiles... qui vont nous suivre

Des standards pour les interfaces mobiles... qui vont nous suivre longtemps

La compatibilité est un critère ergonomique majeur en conception d’interface, avec entre autres, à la clé plus d’efficience et d‘efficacité dans l’utilisation de l’outil et une réduction du temps d’apprentissage

Mauvaise pratique

Exemple 1 :

Bouh... le bouton radio pour déclencher une action!!

Bouh... le bouton radio pour déclencher une action!!

Exemple 2

Ok mais le fil d'Ariane et les éléments de navigation, on les attend... en haut!

Ok mais le fil d'Ariane et les éléments de navigation, on les attend... en haut!

Quelques bons exemples … so GOOD !

Bonne pratique :

Bonne métaphore

Bonne métaphore

Bonne pratique :

Un élément que chacun d'entre nous connait

Un élément que chacun d'entre nous connait

Bonne pratique :

Une fiche produit efficace chez Gap avec tout ce que l'utilisateur peut avoir besoin pour faire son choix

Une fiche produit efficace chez Gap avec tout ce que l'utilisateur peut avoir besoin pour faire son choix

Bonne pratique :

Yahoo mail, quelque chose de connu pour les utilisateurs d'outlook...

Yahoo mail, quelque chose de connu pour les utilisateurs d'outlook...

Bonne pratique :

Regroupement par continent puis pays

Regroupement par continent puis pays... vous avez dit modèle mental

Bonne pratique :

La cible des utilisateurs est US...

La cible des utilisateurs est US...

Bonne pratique :

Shazam: une application mobile qui répond efficacement aux besoins des utilisateurs!

Shazam: une application mobile qui répond efficacement aux besoins des utilisateurs!

Bonne pratique :

Du déjà vu remasterisé !

Du déjà vu, cette fois-ci remasterisé !

Bonne pratique :

Trés bonne compatibilité avec l'univers de la facturation...

Trés bonne compatibilité avec l'univers de la facturation...

Quelques exemples de recommandations

  • Adopter le point de vue de l’utilisateur
  • Proposer un contenu engageant, pertinent et attendu par les utilisateurs
  • S’assurer que la logique applicative correspond bien à la logique (modèle mental) de l’utilisateur
  • Permettre aux utilisateurs de recevoir des documents conformes à  leurs préférences
  • Adapter l’ordre des menus à la façon dont l’utilisateur exécute ses actions
  • Placer les éléments les plus importants pour l’utilisateur en haut de la liste
  • Conserver l”organisation du formulaire papier pour les pages formulaires remplies par les opérateurs
  • Proposer une séquence de saisie adaptée à l’ordre souhaité par les utilisateurs
  • Proposer un moyen facile et évident de revenir à la page d’accueil du site
  • Respecter les standards de conception d’interface Windows
  • Proposer des valeurs par défaut quand c’est possible
  • Utiliser le langage de l’utilisateur
  • Doter chaque image d’une alternative textuelle
  • Réserver les textes soulignés aux liens hypertextes
  • Identifier la destination des liens
  • Proposer un plan de site disponible depuis chaque page
  • Indiquer à la fois sur une page de résultats le nombre de résultats, le nombre de pages de résultats ainsi que le nombre de résultats par page
  • Proposer sur la page d’accueil du site web au moins un moyen de contact
  • Laisser à l’utilisateur suffisamment de temps pour lire et utiliser le contenu.
  • Réserver les couleurs vives pour attirer et capter l’attention
  • Identifier chaque page du site par un titre de page
  • S’assurer de la compatibilité du site avec les principaux navigateurs du marché
  • Optimiser les pages de l’application pour qu’elles s’affichent sans ascenseur horizontal en résolution 1024×768
  • Ne pas construire entièrement un site public sur  une technologie telle que Flash, Flex, Ajax
  • Assurer l’accessibilité des contenus dynamiques
  • Construire la fonction de recherche à partir des termes et expressions utilisateurs

Design d’interface et critère ergonomique 10: Signifiance

Posté par jc-Qualitystreet le 24 janvier 2011

Ma liste de critères ergonomiques pour la conception d’interface contient 11 critères. C’est une liste personnelle, établie au départ sur la base des normes & standards existants (ISO 9241, AFNOR Z67 133, Bastien & Scapin, Heuristiques US …), que je m’efforce de partager au quotidien avec les équipes de développement tout en sensibilisant le métier sur la question.

Signifiance : en quoi ça consiste ?

C’est parler le  langage de l’utilisateur.

Ce critère concerne la bonne adéquation entre l’objet et son référent, et implique donc de choisir de manière appropriée les mots et les symboles utilisés sur un site ou une application.

Concret - Abastrait

Concret - Abstrait

Un regard tout particulier sera donc porté sur le vocabulaire utilisé dans l’interface ou sur le site. Une fine connaissance des cibles et de leur domaine, au travers d’une approche Personas, d’enquêtes contextuelles ou de Tri de cartes est indispensable pour bien appréhender les mots, le langage des utilisateurs.

Dans tous les cas, un vocabulaire simple, précis, concis, explicite, compréhensible et orienté utilisateur doit être privilégié.

L’utilisation d’icônes et d’images présente de multiples avantages (concision et reconnaissance) puisqu’il s’agit d’éléments qui peuvent être interprétés, et donc reconnus plus rapidement que du texte. Toutefois celles-ci doivent être maniées avec précaution : en nombre limité, conventionnelles, sans aucune ambigüités et idéalement associées à un libellé qu’elles représentent.

En bref, les mots et symboles choisi doivent être familiers des utilisateurs.

Quelques exemples de recommandations

  • S’assurer que le lien entre l’objet et son référent est le plus direct possible
  • S’assurer que les liens et items de navigation ne comportent pas de termes qui risquent de ne pas être compris par la population visée.
  • S’assurer que les titres véhiculent ce qu’ils représentent, et sont distincts
  • S’assurer que les liens sont explicites dans leur contexte: l’utilisateur doit savoir s’ils renvoient vers une autre page, s’ils ouvrent un document bureautique ou s’ils correspondent à une adresse électronique
  • Rendre les règles d’abréviation explicites
  • Vérifier la compréhension des icônes avec les utilisateurs cibles
  • Utiliser des icônes pour les éléments fréquemment employés
  • Accompagner l’icône de son nom

Mauvaise pratique

Exemple (Rowenta)

Des icônes isolées et ambigues sur Rowenta.fr

Des icônes isolées et ambigues sur Rowenta.fr

Quelques bons exemples… So good!

Bonne pratique :

Des libellés concis et explicites

Des libellés concis et explicites

Bonne pratique:

Un choix d'icônes efficace qui respecte les conventions

Un choix d'icônes efficace qui respecte les conventions

Bonne pratique:

Association Icône et Libellé: Clair et Explicite

Association Icône et Libellé: Clair et Explicite

RIA et Ergonomie Web: enfin prêts ?

Posté par jc-Qualitystreet le 30 novembre 2010

Les interfaces riches basées sur le navigateur web proposent de nouvelles modalités de présentation, de nouveaux comportements et au final plus d’interactivité ; l’enjeu ergonomique est fort alors que l’offre technologique RIA (Rich Internet Applications, Ajax ou d’Adobe et de Microsoft) est aujourd’hui mature et que les utilisateurs semblent prêts.

Cette évolution technologique ne signifie pas pour autant rupture avec les critères ergonomiques de base dont le respect assure une bonne utilisabilité de l’interface.

Il est évident que les bénéfices des RIA ne peuvent s’observer qu’à partir du moment où les interactions sont pensées en regard de l’activité des utilisateurs, et que le tout est employé avec précautions. Seule leur association permettra de garantir une Experience Utilisateur Riche et Réussie.

Deux exemples illustrent parfaitement cette problématique :

Exemple 1 : Glisser-Déposer des éléments d’une page

Ce mode d’interaction très dynamique et spectaculaire renvoie à deux analogies marquantes qui suffisent à le rendre populaire : celle de la vie quotidienne (« je prends des aliments dans un rayon et les mets dans mon caddie ») et celle de la bureautique depuis l’apparition du Macintosh en 1984.

Les +

Plus de contrôle, bonne compatibilité avec d’autres contextes et plaisir d’usage.

Les précautions à prendre

  • S’assurer de la pertinence de l’interaction riche pour l’exécution des tâches,
  • Proposer des éléments forts d’incitation, de guidage et de transition pour comprendre comment ça marche et prévenir les erreurs.
  • Donner du feedback sur l’action effectuée

Illustrations

Temps 1
Temps 1

Temps 2

Temps 3

Temps 3

Exemple 2 : Communication asynchrone avec rechargement partiel et silencieux

C’est l’un des premiers et grands points forts d’Ajax.

Il permet de se focaliser sur des zones ciblées tout en évitant le rechargement complet de la page.

Les +

Plaisir d’usage, mais aussi plus d’interactivité, plus de fluidité et un retour d’informations en temps réel (notamment en prévention des erreurs)

Les précautions à prendre

  • Conserver la fluidité
  • Donner un retour (feedback) sur l’action effectuée (notamment d’un point de vue visuel)

Illustrations

Feedback... Feedback

Feedback... Feedback

Ajout dun item

Ajout d'un item

RIA, au service de bonnes pratiques ergonomiques reconnues…

L’auto complétion (l’utilisateur commence à taper quelques lettres et le système le guide alors dans sa recherche) et la validation à la volée de champs de formulaires en sont les parfaites illustrations. Outre de réels bénéfices en termes d’utilité, de productivité et de confort, ces deux techniques exploitent admirablement des critères ergonomiques majeurs, tels que la prévention des erreurs, le guidage et le feedback immédiat.

Validation à la volée

Validation à la volée

Enfin d’autres composants riches (issus de technologies variées) deviennent de véritables atouts pour la conception des interfaces utilisateurs. Les outils de manipulation directe, d’affichage contextuel, les techniques d’affichage dynamique (accordéons, panels, fenêtres secondaires, menus riches, carrousel, zoom, etc.) aux effets toujours plus variés (Lightbox…) viennent enrichir chaque jour davantage l’arsenal des concepteurs d’interface …

Effet LightBox: trés efficace au quotidien !

Effet LightBox: trés efficace au quotidien !

pour des produits UTILES et toujours PLUS UTILISABLES (c’est-à-dire efficaces, efficients et satisfaisants !)

Design d’interface et critère ergonomique 8: Adaptabilité

Posté par jc-Qualitystreet le 29 octobre 2010

Ma liste de critères ergonomiques pour la conception d’interface contient 11 critères. C’est une liste personnelle, établie au départ sur la base des normes & standards existants (ISO 9241, AFNOR Z67 133, Bastien & Scapin, Heuristiques US …), que je m’efforce de partager au quotidien avec les équipes de développement tout en sensibilisant le métier sur la question.

Adaptabilité : en quoi ça consiste ?

C’est S’ADAPTER aux caractéristiques des utilisateurs (vues, perspectives, raccourcis…)

Portail personnalisé

Portail personnalisé

Ce critère concerne la capacité du système à réagir selon le contexte, mais aussi selon les besoins, préférences et niveaux d’expertise des utilisateurs.

Proposer plusieurs façons d’arriver à un même résultat, bénéficier d’une application personnalisée ou encore customiser son interface sont des dimensions clés de l’adaptabilité, et de fortes attentes des utilisateurs.

Différentes vues... différents affichages

Différentes vues... différents affichages

L’utilisateur a la possibilité de modeler sa page selon ses préférences, et de contrôler (ajouter, retirer, modifier) certains éléments du portail : favoris, raccourcis, thèmes, couleurs, titres et libellés…

Customisation Gadgets

Customisation Gadgets

Quelques exemples de recommandations

  • Permettre aux utilisateurs de désactiver les affichages et informations inutiles
  • Autoriser les utilisateurs expérimentés à contourner une série de sélections par menu en formulant directement des commandes ou par des raccourcis clavier
  • Permettre de modifier la séquence des entrées de données pour s’adapter à l’ordre souhaité par les utilisateurs.
  • Permettre aux utilisateurs de définir le format d’un document et de le sauvegarder pour une utilisation ultérieure lorsqu’on ne peut le spécifier à l’avance

Quelques bons exemples … so GOOD !

Bonne pratique :

Préférences pour une interface flexible

Préférences pour une interface flexible

Bonne pratique :

Customisation quand tu nous tiens !

Customisation quand tu nous tiens !

Bonne pratique :

Personnalisation

Personnalisation

Bonne pratique :

Raccourcis clavier ou Menus

Raccourcis clavier ou Menus

Bonne pratique :

Recherche Google : Un conseil "masquable"

Recherche Google : Un conseil "masquable"

Bonne pratique :

Entrée des données : saisie ou slider

Entrée des données : saisie ou slider


Bonne pratique :

Personnalisez vos rapports !

Personnalisez vos rapports !

Bonne pratique :

champ de recherche flexible

champ de recherche flexible Temps 1

Temps 2

Temps 2

Bonne pratique :

Une recherche trés adaptable

Une recherche trés adaptable

Bonne pratique :

Customisation

Customisation

Get Adobe Flash playerPlugin by wpburn.com wordpress themes