17 May 2012

Inscrivez-vous au Flux RSS

Truc de coach : un plan de bataille pour une Demo efficace

Posté par jc-Qualitystreet le 6 août 2010

Aujourd’hui c’est DEMO …

La revue de fin de sprint est l’un des 4 cérémoniaux de Scrum , une des méthodes Agiles. Cette réunion qui a lieu le dernier jour du Sprint est avant tout centrée sur la Demo d’un incrément de produit « qui marche », et sur le feedback du Product Owner.

La démo est faite par l’équipe ; à elle de s’organiser en conséquence mais j’insiste pour que cette demo soit préparée (juste ce qu’il faut), scénarisée et mise en contexte (notamment dans l’enchaînement des User Stories). Rappelons en effet que des personnes du Business qui n’ont pas suivi le Sprint peuvent assister à ce RDV en compagnie du Product Owner.

  • Le rappel des objectifs du Sprint et de la liste des items du Backlog de produit prévus pour le sprint est un PREALABLE.
  • Une définition du Done et le rappel des CONDITIONS DE SATISFACTION de chaque User Story sont des INDISPENSABLES.

L’aspect scénarisation est quant à lui souvent négligé; c’est pourtant un élement de communication clé, crucial pour laisser une impression positive, rassurer et mettre en confiance. Car c’est aussi une question de feeling.

Une demo sans accrocs  passe donc par un scénario bien huilé… pour cela rien ne vaut un bon vieux « Plan de Bataille »!

Un "vrai" Plan de Bataille... et il n'y avait pas qu'une seule page. Bravo et Merci Marie-Laure

Un "vrai" Plan de Bataille... et il n'y avait pas qu'une seule page. Bravo et Merci Marie-Laure

 Et moi j’aime bien quand un plan se déroule sans accrocs :)

Les autres Trucs de Coach Agile:

Design d’interface et critère ergonomique 3 : Groupement - Distinction entre Items

Posté par jc-Qualitystreet le 5 août 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.

Groupement - Distinction entre items : en quoi ça consiste ?

C’est l’art de regrouper ce qui va ensemble pour favoriser une meilleure distinction et reconnaissance des éléments. Ce critère concerne l’organisation visuelle des items les uns par rapport aux autres. Le groupement ou la distinction des informations s’appuie sur deux stratégies :

  • la localisation (c’est-à-dire par le positionnement)
  • le format (c’est-à-dire par les caractéristiques graphiques)
Liens commerciaux Top vs Colonne vs Référencement Naturel:un Layout efficace

Liens commerciaux Top vs Colonne vs Référencement Naturel: un Layout efficace. Distinction par localisation et format

Le critère s’appuie aussi plus largement sur la théorie de la Gestalt et sur les lois de perception visuelle: proximité, similarité, fermeture, continuité…

Les Lois de la Gestalt

Les Lois de la Gestalt

Quelques exemples de recommandations

  • Utiliser la couleur pour distinguer les éléments de la barre de navigation, les contrôles actifs / inactifs
  • Distinguer graphiquement l’item de navigation secondaire en cours de consultation et le mettre en valeur (ex: une puce, une couleur de typographie, un aplat…)
  • Différencier les liens visités des liens non-visités
  • Différentier l’item présentant la page en cours de consultation mais le rendre « non cliquable »
  • Séparer les éléments du fil d’Ariane par le signe > avec 1 espace avant et après
  • Regrouper les fonctions transverses dans une zone située en haut à droite, et les ‘afficher de manière constante sur l’ensemble du site

Des mauvaises pratiques

Pas de groupement - pas de hiérarchisation : la CATA !

Des groupements inadaptés - pas de hiérarchisation ... surcharge visuelle !!

Autre mauvais exemple:

L'espace est un élément crucial pour la distinction des items. Ici ...

L'espace est un élément crucial pour la distinction des items. Ici c'est raté !

Autre mauvais exemple :

distinction_bad-3

Autre mauvais exemple:

Une distinction entre action 1 et 2 aurait été préférable

Une distinction entre action 1 et 2 aurait été préférable

Quelques bons exemples … so GOOD !

Trés bonne distinction entre les deux actions (bonne prévention des erreurs)

Trés bonne distinction entre les deux actions (bonne prévention des erreurs)

Autre exemple:

Distinction des rubriques par couleurs

Distinction des rubriques par couleurs

Autre exemple:

Zoning. Distinction des zones de l'écran. Extrait Charte ergonomique DGME

Zoning. Distinction des zones de l'écran. Extrait Charte ergonomique DGME

Autre exemple:

Trés belle distinction des zones et des items au sein du formulaire Ebay

Trés belle distinction des zones et des items au sein du formulaire Eba

Design d’interface et critère ergonomique 2 : Lisibilité

Posté par jc-Qualitystreet le 4 août 2010

Ma liste de critères ergonomiques pour la conception d’interface contient 11 critères qui sont valides pour tous les types d’interface. 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 et les équipes Business.

Lisibilité : en quoi ça consiste ?

C’est faciliter la lecture et favoriser la compréhension de ce qui est affiché à l’écran. Ce critère ergonomique recouvre en effet deux dimensions : le processus physiologique de lecture mais aussi la compréhension de ce qui est lu.

Lisible et incitatif

Lisible et incitatif

La lisibilité va donc concerner les caractéristiques de présentation des informations sur l’écran pouvant entraver ou faciliter la lecture de ces informations : luminance des caractères, dimension des lettres, des lignes, espacement entre les mots, interlignes, couleurs et contrastes.

Quelques exemples de recommandations :

  • Utiliser une police sans serif (empattement), telles que Verdana, Arial ou Helvetica (ou leur équivalent), conçues pour la lecture à l’écran.
  • Assurer la lisibilité du texte en jouant sur le contraste avec l’arrière plan (valeur de contraste au minimum de 80 %)
  • Préférer un fond clair à un fond sombre
  • Favoriser le mode positif  avec Texte noir sur fond blanc / clair
  • Sur fond clair (blanc/ gris pâle), éviter le jaune, vert pâle ou cyan, le bleu, rouge, violet
  • Assurer un contraste constamment satisfaisant entre la page et la barre de navigation, entre les items de la barre de navigation et leur arrière plan

Deux mauvaises pratiques

Mauvais contraste

Mauvais contraste

Autre exemple

Une lecture très difficile !!!

Une lecture très difficile !!!

Quelques bons exemples … so GOOD !

Tout est dit !

Tout est dit !

Autre exemple:

Contenus lisibles et bien délimités. Bons Contrastes.

Contenus lisibles et bien délimités. Bons Contrastes.

Autre exemple:

Dans les deux cas : très lisible mais plus de douceur et moins de fatigue au quotidien avec le Gris

Dans les deux cas : très lisible mais plus de douceur et moins de fatigue au quotidien avec le Gris

Design d’interface et critère ergonomique 1 : l’Incitation

Posté par jc-Qualitystreet le

Ma liste de critères ergonomiques pour la conception d’interface contient 11 critères qui sont valides pour tous les types d’interface. C’est une liste personnelle, affinée, établie au départ sur la base des normes & standards existants (ISO 9241, AFNOR Z67 133, Bastien & Scapin, Heuristiques US …), et que je m’efforce de partager au quotidien avec les équipes de développement et les équipes Business.

Incitation : en quoi ça consiste ?

C’est accompagner l’utilisateur dans sa tâche, le renseigner sur le contexte dans lequel il se trouve, l’orienter, l’amener à effectuer des actions spécifiques tout en prévenant au maximum l’indécision. L’incitation est donc un critère essentiel pour l’utilisateur qui s’est renforcé d’un point de vue business autour des problématiques de marketing digital.

Tous les leviers de l'Ergonomie Incitative
Tous les leviers de l’Ergonomie Incitative

Éléments d’ergonomie incitative ou d’assistance sur formulaires, architecture de l’information simple et adaptée, fil d’Ariane, indicateur d’étape (pour une navigation guidée), identité visuelle par univers, autant d’éléments qui favorisent une bonne incitation.

Quelques exemple de recommandations …

  • Limiter les points d’entrée sur l’interface, les rendre descriptifs et « orientés-tâches »
  • Proposer un titre à chaque page, court et signifiant
  • Proposer sur chaque page du site des éléments de navigation et de repérage permettant à l’utilisateur de répondre à trois questions : Où suis-je ?, D’où viens-je ?, Où puis-je aller ?
  • S’assurer que le système de navigation principal indique visuellement à l’utilisateur dans quel menu ou rubrique il se trouve
  • Prévoir un fil d’Ariane sur toutes les pages intérieures, le positionner sous la barre de navigation globale, mais toujours au-dessus du titre de page
  • Proposer un indicateur d’étapes en cas de navigation guidée par exemple pour les processus dont la saisie est décomposée en plusieurs pages et / ou nécessite un écran « récapitulatif »

Deux mauvaises pratiques

Par où commencer ? Comment ça marche ?
Par où commencer ? Comment ça marche ?

Pas évident !!
Pas évident !!

Quelques bons exemples … so GOOD !

Rappel avant de démarrer et indicateur d'étapes

Rappel et Indicateur d'étapes

Autre exemple :

Invitation Claire

Aussitôt arrivé, aussitôt guidé !

Autre exemple:

Parfaite incitation

Parfaite incitation

Autre exemple:

Choix limité

Choix limité

Autre exemple :

Droit au but !
Droit au but !

Autre exemple :

Suivez le guide !
Suivez le guide !

Get Adobe Flash playerPlugin by wpburn.com wordpress themes