Quels sont les éléments clés pour la clarté et la simplicité d'une interface graphique d'application Web?
Nous travaillons sur une application web. Nous avons consacré plus de deux mois à simplifier chaque processus et flux de travail. Maintenant, nous aimerions rendre l'interface utilisateur plus simple et plus claire, ne fonctionnant que presque sur CSS.
Je suis un développeur front-end expérimenté, mais je sais que la simplicité n'est pas une tâche facile à réaliser et que lorsque vous avez des fonctionnalités de travail simples dans le back-end, c'est une étape différente de donnez-lui l'apparence simple et clair pour la partie frontale et, dans notre cas, pour un type d'utilisateurs très spécifique.
Je veux dire des trucs comme des bordures rondes pour les conteneurs et les champs de saisie, il semble être utilisé partout aujourd'hui. Mais j'ai peur de ajouter des choses, pas supprimer des trucs.
Le problème est que nous avons déjà beaucoup de choses et de fonctionnalités, maintenant nous devons choisir ce qu'il faut supprimer, purifier, etc.
Avez-vous des règles de base qui donnent à l'utilisateur une perception de la simplicité et de la clarté de l'interface graphique?
Commencez avec une toile vierge. Par définition, c'est propre, simple et minimal.
Malheureusement, vous ne pouvez être minimal que par rapport à un ensemble d'attentes. Une solution élégante est la solution minime de son problème.
Donc, énoncez chaque besoin: assurez-vous que tout ce qui est à l'écran a le droit d'être là et qu'il n'a pas de remplacement plus simple pour ce type de problème, compte tenu de ses circonstances.
Expliquez pourquoi il doit apparaître sur cet écran; pourquoi il ne peut pas être sur un autre écran; pourquoi vous ne pouvez pas éliminer cet écran.
Ne supprimez pas: ajoutez des éléments un par un, après avoir défini leur utilité, comment soutiennent-ils l'objectif global du système, ou plutôt les objectifs généraux des utilisateurs du système. Justifiez ces objectifs avec de vraies personnes dans des scénarios réels. Ne rêvez pas des choses.
Pourquoi un bouton devrait-il être rond? Y a-t-il un autre moyen pour que les gens reconnaissent que c'est un bouton? Testez-le sur de vraies personnes. Pas des développeurs frontend, mais des gens qui n'ont aucune expérience dans le projet et qui ne sont pas particulièrement intéressés par les ordinateurs eux-mêmes. Les personnes qui l'utilisent uniquement par nécessité - et cela indépendamment du groupe d'âge - devraient être votre choix.
Une fois que vous avez une justification claire pour chaque élément, chaque écran et que cette justification est finalement connectée à quoi sert l'interface, alors vous pouvez avoir un design minimaliste.
Aussi, lire ce discours . Peu importe qu'il s'agisse de meubles. Ça ne l'est pas.
Familiarisez-vous avec UCD (User Centered Design).
L'UCD permettrait aux équipes qui lui sont vendues de déployer le système minimal qui est conforme aux besoins de l'utilisateur.
À mon avis, il y a deux niveaux à connaître.
Le premier niveau est le conception fonctionnelle, lié à la façon dont cela fonctionne, que faire ensuite au stade même de l'interaction avec l'interface utilisateur du système.
La meilleure façon de refléter cette conception est d'écrire des "cas d'utilisation" textuels. Les UC sont le dispositif le plus connu pour capturer les exigences fonctionnelles.
Aucun UC ne fera l'affaire, il existe une meilleure façon d'écrire des UC en tant que documents simples mais costauds.
Après avoir écrit les UC pertinentes, vous pouvez visualiser l'interaction de votre système sans l'avoir implémenté. De plus, les programmeurs auront une excellente définition afin de pouvoir le faire plus rapidement et plus facilement. Les testeurs sauront à l'avance quoi tester. Et surtout, les utilisateurs auront une idée précise de ce que fera le système.
La seconde consiste à définir des éléments dans les écrans, en suivant les UC MSS - scénario de réussite principal et à essayer de supprimer toutes les autres données rarement nécessaires, en les déplaçant vers des sous-écrans supplémentaires. Le but est que l'utilisateur qui fait la chose normal ne voit que les données normal.
"Suivre le MSS" signifie fournir un moyen de faire ce que dit le MSS.
Comme, par exemple (artificiel): dans un formulaire de connexion, affichez l'identifiant et le mot de passe, seuls les éléments de données dont la grande majorité du temps sera nécessaire, et imaginez un moyen pour permettre à un utilisateur perdu de faire apparaître les éléments de récupération et d'enregistrement de mot de passe qui seront rarement utilisés.
Pour chaque élément de données affiché dans n'importe quel écran, notez comment il a été rendu et restituez-le de la même manière sur tous les écrans de l'application.
Dans l'ensemble, vous devez être très clair sur ce que vous voulez réaliser pour faire est simple.