Ergonomie : les heuristiques de Nielsen (avec exemples concrets)
Tu n’as pas besoin d’un lab UX pour repérer 80 % des problèmes d’une interface.
Les heuristiques de Nielsen sont un “checklist mental” ultra efficace pour auditer rapidement un produit.
L’idée : évaluer une interface sur des principes universels (feedback, cohérence, erreurs…), puis prioriser ce qui fait réellement gagner du temps à l’utilisateur.
1) Visibilité de l’état du système
L’utilisateur doit savoir ce qui se passe maintenant.
Bon : - loader, skeleton, barre de progression - message “Enregistrement…” puis “Sauvegardé”
Mauvais : - bouton “Envoyer” qui ne change pas alors que la requête part - page figée → double clic → double paiement
Checklist : - un feedback immédiat (< 100 ms) ? - un état “en cours” si > 500 ms ?
2) Correspondance entre système et monde réel
Le produit doit parler le langage de l’utilisateur, pas celui des devs.
Exemples : - “Facture” > “Document comptable #INV” - “Mot de passe” > “Credential”
Piège : - acronymes non expliqués (SLA, RBAC, KYC…) sur une UI grand public.
3) Contrôle et liberté de l’utilisateur
Les erreurs arrivent. Le système doit permettre d’annuler, revenir, corriger.
Bon : - “Annuler” / “Retour” - “Restaurer” après suppression
Mauvais : - formulaire effacé si tu changes d’onglet - action destructive sans confirmation
4) Cohérence et standards
Une UI cohérente réduit la charge mentale.
Bon : - mêmes labels, mêmes composants, mêmes patterns
Mauvais : - un bouton primaire parfois bleu, parfois rouge - “Se connecter” ici, “Connexion” là
Tip : un design system évite 80 % de ces écarts.
5) Prévention des erreurs
Le meilleur message d’erreur est celui qui n’apparaît jamais.
Exemples :
- désactiver “Valider” tant que la donnée est invalide
- autocomplétion, masques de saisie, exemples (ex: prenom.nom@domaine.fr)
À éviter : - valider seulement à la fin → avalanche d’erreurs
6) Reconnaissance plutôt que rappel
Ne force pas l’utilisateur à se souvenir.
Bon : - menus visibles, autocomplétion - historiques et suggestions
Mauvais : - étapes sans contexte - champs pré‑remplis inexistants alors que tu as l’info
7) Flexibilité et efficacité d’utilisation
Les novices ont besoin de guidance, les experts veulent aller vite.
Exemples : - raccourcis clavier (cmd+k, /) - actions en masse - “Derniers choix” / templates
8) Design esthétique et minimaliste
Minimaliste ≠ vide. C’est une hiérarchie claire.
Bon : - 1 intention principale par écran - textes courts, espaces, titres utiles
Mauvais : - 12 CTA dans le header - texte long non scannable
9) Aider à reconnaître, diagnostiquer et corriger les erreurs
Les erreurs doivent être : - claires (quoi) - actionnables (comment corriger) - localisées (où)
Exemple :
“Mot de passe trop court. Minimum 12 caractères.”
Plutôt que :
“Erreur 422”
10) Aide et documentation
Même si l’objectif est de ne pas en avoir besoin, une aide courte sauve.
Bon : - tooltips, FAQ ciblée - exemples de format
Mauvais : - PDF de 42 pages
Un mini‑audit en 15 minutes
Sur une page clé (ex. inscription / paiement), passe la checklist :
- Feedback clair ? (heuristique 1)
- Termes compréhensibles ? (2)
- Retour/annulation ? (3)
- Cohérence composants ? (4)
- Erreurs évitées ? (5)
- Infos visibles ? (6)
- Raccourcis pour power users ? (7)
- Pas de bruit ? (8)
- Erreurs actionnables ? (9)
- Aide ponctuelle ? (10)
Tu obtiens une liste de problèmes très “rentables” à corriger.