Open Agile

Claire. Facile à utiliser. « User-friendly ». Intuitive. Ce mantra est proclamé par beaucoup, mais se perd souvent dans sa traduction. Le coupable : la complexité. Comment la gestion de la complexité peut faire ou défaire une application. Une interface complexe peut désorienter l’utilisateur pour un cas simple et le perdre totalement dans un cas complexe. Mais si vous avez pris les premières mesures pour réduire la complexité réelle, puis minimiser la complexité perçue, l’utilisateur sera récompensé par une utilisation agréable de l’application.

La suite de cet article présente plusieurs techniques qui peuvent aider à rationaliser des applications complexes en une interface utilisateur ergonomique et légère.

Se saisir de la hache

La première arme à utiliser contre la complexité est une hache. Dans un précédent article sur la loi de Pareto ont découvrait que 80% des utilisateurs utilisaient seulement 20% des fonctionnalités du logiciel. Non seulement tous ces éléments inutilisés sont une perte de temps de développement, mais ils nuisent souvent en rendant l’application plus difficile à utiliser, plutôt que d’apporter une valeur utile. Les applications qui essaient de tout faire, ont souvent du mal à faire quoi que ce soit de bien. Une application réussie est une application légère et simple, qui isole un seul problème et le résout brillamment.

La meilleure façon d’obtenir une application rationalisée et légère est de supprimer des fonctionnalités. Pour déterminer si une fonctionnalité est nécessaire, la réponse par défaut est « Non » , la fonction doit vraiment se battre pour être incluse. Si cela n’aide pas la majorité des utilisateurs à accomplir leurs tâches fréquentes, elle devra probablement être laissée de côté. Être celui qui manie la hache est difficile, mais quand les utilisateurs feront l’éloge de la facilité d’utilisation de l’application, vous pourrez vous satisfaire de vos choix.

Masquer la complexité

Si vous ne pouvez pas supprimer une fonctionnalité complexe, la meilleure chose est de la cacher. Encore trop souvent, des fonctionnalités complexes rarement utilisées prennent plus de place sur l’écran que des fonctionnalités simples très fréquemment utilisées. Une bonne interface utilisateur doit permettre de réaliser les tâches les plus courantes, les plus connues et masquer les tâches sous-utilisées de façon à ne pasles mettre dans le chemin.

Selon les termes du pape du design John Maeda,

Quand un petit objet sans prétention est supérieur à nos attentes, nous sommes non seulement surpris, mais heureux.

Réduire le bruit visuel

Jusqu’à présent, nous avons parlé de minimiser la complexité en supprimant ou en cachant des fonctionnalités. . Mais minimiser le «perçu» de la complexité est également important. Le designer d’UI Brandon Walkin dit:

La quantité de bruit dans une interface visuelle a beaucoup d’impact sur la perception de la complexité de l’interface.

Conserver le bruit visuel à son strict minimum, permet d’obtenir une interface qui semble plus facile à utiliser. Les deux principaux outils pour réduire le bruit visuel sont les espaces blancs et le contraste.

Les espaces vides, tels que définis par Mark Boulton, sont les espaces entre les éléments dans une composition.

L’espace blanc devrait être votre outil de mise en page par défaut. Une règle d’or consiste à ne jamais introduire un élément de design si vous ne pouviez pas atteindre le même objectif avec un espace blanc. Vous serez surpris par tout ce que vous pouvez accomplir avec l’espace blanc seul.

Tandis que l’espace blanc doit être utilisé en abondance, les contrastes doivent être utilisés le moins possible. Le théoricien du design Edward Tufte, qui est responsable de la notion « la différence la moins efficace » , demande instamment aux concepteurs d’utiliser la plus petite variation visuelle nécessaire pour communiquer efficacement une idée. En pratique, cela signifie souligner ce qui est important et positionner en arrière tout le reste.

Pour illustrer ces deux points, jetez un œil à ce tableau des prix de TypeKit puis regardez la version modifiée:

Version originale

Version modifiée

Vous noterez que la version modifiée contient une bordure noire lourde, un peu comme la frontière par défaut autour des tables HTML. Quelle version produit une meilleure efficacité pour minimiser le bruit visuel ? (La réponse est bien sûr, l’original.) Beaucoup d’espace blanc et un minimum de contraste réduisent le bruit visuel et votre application devient plus simple et plus légère.

Réduire, Réutiliser, Recycler

Quand une application commence à prendre forme, les problèmes se répètent souvent dans diverses parties de l’application. Les problèmes récurrents ont tendance à avoir des solutions similaires. Recherchez des façons de réutiliser les composants de l’interface. Réutiliser les éléments à des fins différentes a deux avantages :  réduction du temps de développement, la cohérence de l’application permet un apprentissage plus rapide par les personnes qui utilisent l’application. Si un utilisateur apprend à réaliser une tâche, il peut appliquer les mêmes connaissances à la réalisation d’une seconde tâche tant qu’elle est mise en œuvre de manière cohérente.

Réutiliser des composants de l’interface est une autre façon de réduire la complexité perçue, les utilisateurs pourront par la suite se familiariser rapidement avec l’application et savoir à quoi s’attendre.

La page par défaut ne doit pas être vide

Une page par défaut est un élément qui indique comment une interface apparaît lorsqu’aucune donnée n’est disponible, comme lorsque quelqu’un utilise une application pour la première fois. En tant que concepteurs, nous passons la plupart de notre temps à évaluer la meilleure façon de présenter du contenu, et trop souvent nous oublions que le contenu ne sera pas toujours là.

Il est essentiel d’intégrer des valeurs raisonnables par défaut. La page par défaut est souvent la première impression que quelqu’un a d’un produit et peut être un facteur décisif pour qu’elle commence ou non à utiliser l’application. Une page par défaut de qualité doit proposer un dispositif de signalétique, pour aider l’utilisateur à faire ses premiers pas avec des éléments familiers.

L’équipe derrière le projet versions (un client Subversion pour Mac) ont mis de toute évidence beaucoup d’efforts sur la page d’accueil de l’application. L’application met en avant les deux premières actions qu’un utilisateur pourrait avoir envie de faire lors de la première utilisation.

La vitrine

Nous avons tous vu des applications trop chargées, des logiciels complexes. Les applications qui réduisent efficacement la complexité sont cependant plus difficiles à trouver. Voici quelques applications qui le font avec brio.

Invoice machine minimalise au mieux l’interface utilisateur. L’application illustre l’économie d’expression et porte une attention extrême aux détails.

Freckle,  tout simplement si vous voulez garder une trace de votre temps. Elle brille par une interface idéalement condensée avec des couleurs énergiques, en faisant d’une tâche routinière quelque chose d’amusant et tellement simple.

Image spark combine un noir élégant et des dégradés de blanc avec une typographie élégante. Son interface a peu de contrôles, elle est donc simple pour se déplacer.

Ballpark a des commandes claires et d’une interface épurée, sans être avare dans son utilisation de la couleur.

Krop, pour trouver un emploi, avec seulement deux champs d’un formulaire: le lieu et le mot clé. Elle prend littéralement moins de cinq secondes pour trouver des offres d’emploi pertinentes. A quand la version français…

Fever permet de réduire la barrière entre vous et les articles de blog auquel vous êtes intéressés, en prenant la température de l’actualité. Il l’accomplit par le biais d’une interface simple et unique.

Screenr est un outil étonnamment simple pour faire des screencasts et de les afficher sur Twitter. Il est remarquable non pas pour toutes les fonctions qu’il a, mais pour l’ensemble des fonctionnalités qu’il ne possède pas.

Squarespace réalise un travail important pour cacher la complexité. Bien qu’il propose de nombreuse de fonctionnalités pour l’édition de plate-forme Web, il fait un travail impressionnant pour les cacher derrière une interface utilisateur simple.

Le mot de la fin