Vous le savez, les apps mobiles connectées posent des défis de design que les apps classiques n’ont pas. Nous avons réuni ce que nous avons appris dans une courte vidéo : cinq questions auxquelles chaque écran doit répondre, et quelques règles pour les écrans de téléphone. Voici le résumé. La vidéo montre chaque point dans une vraie app.
Regardez la démonstration complète. Elle dure moins de six minutes et montre chaque conseil dans une app qui fonctionne.
Partir des décisions, pas des données
Les capteurs envoient un flux de valeurs, mais votre utilisateur ne veut pas une liste de mesures. Il veut prendre une décision, par exemple agir ou non. Construisez chaque écran autour de ce moment et ne montrez que ce qui aide l’utilisateur à trancher.
Cinq questions auxquelles chaque écran doit répondre
Un bon écran de produit connecté permet de décider d’un coup d’œil en répondant à cinq questions, dans l’ordre.
- Tout va bien ? L’état d’abord, le décompte à côté, les problèmes en haut. Si tout va bien, l’écran doit avoir l’air ennuyeux.
- Puis-je m’y fier ? Un nombre sans heure à côté est une supposition. Horodatez chaque valeur et grisez celles qui sont périmées.
- Qu’est-ce qui a changé ? Une notification par problème, pas une par mesure, chacune nommant l’équipement concerné.
- Que dois-je faire ? Placez l’action juste à côté du problème, à un geste, et demandez confirmation pour tout ce qui ne peut pas être annulé.
- Est-ce que ça a marché ? Une commande met du temps à atteindre l’appareil : affichez “en attente”, puis “confirmé” ou “échec”, et quand.
Un téléphone n’est pas un petit ordinateur
Un dashboard conçu pour un grand écran devient un mur de chiffres minuscules sur un téléphone, que l’on consulte debout, d’un pouce, en quelques secondes. Six règles le gardent lisible :
- Un nombre par tuile, avec son unité et son âge.
- Les tableaux deviennent des cartes, une valeur par ligne, l’essentiel en haut.
- Un graphique, une série ; une seule plage, le détail au toucher.
- La couleur a besoin d’un mot, car tout le monde ne voit pas les couleurs de la même façon.
- Des cartes géographiques seulement quand la localisation compte ; sinon, une liste est plus rapide.
- Deux gestes, pas dix ; laissez les assistants de configuration et les modifications en masse dans le navigateur.
Rien de tout cela ne dépend de votre façon de construire. Natif, React ou un autre framework, ce sont des décisions sur ce que l’utilisateur doit voir et faire. Répondez bien aux cinq questions et vos utilisateurs sentiront la différence.
