Alertes de codage couleur
J'ai des problèmes avec les couleurs d'alerte d'un projet.
J'ai deux cas qui déclenchent une alerte.
L'une est si la valeur est supérieure à 40 et l'autre supérieure à 45.
Atteindre la valeur 40 est une très mauvaise chose et atteindre 45 est encore pire.
Le problème est que je ne peux pas utiliser d'orange pendant plus de 40 ans car c'est vraiment important et il faut que des mesures soient prises immédiatement.
Actuellement j'utilise du rouge clair et du rouge dur mais j'ai bien peur qu'ils ne se différencient pas assez bien.
Des suggestions s'il vous plait?
Lorsque vous doutez de la façon de différencier les éléments graphiques, un bon outil consiste à tester tous les contrastes visuels dans la conception.
Contraste de forme
Contraste de taille
Contraste de texture
Contraste des couleurs
Si le contraste des couleurs n'est pas suffisant ou n'est pas autorisé, essayez le mélange avec la couleur et la texture:
Contraste de poids
Contraste figure/sol
Contraste de style
Contraste d'espacement
Pour compléter la réponse, il y a un autre contraste mais je pense qu'il ne s'applique pas à cette conception.
Contraste de position
Enfin, il existe un autre type de contraste que nous excluons souvent en tant que tel:
Contraste chronologique
Il semble que vous devez simplement utiliser une nuance de rouge, l'arrière-plan de la boîte et l'opacité.
Voici un exemple de quelques états différents utilisant une seule couleur de rouge. L'opacité n'est utilisée qu'une seule fois, sur l'exemple 42, et c'est l'arrière-plan à 50%.
Dans ces derniers, les utilisateurs doivent seulement pouvoir voir la différence entre le noir, le rouge et le rouge à 50%.
Si votre interface utilisateur est autrement lumineuse, vous pouvez utiliser une nuance de rouge plus foncée pour la différencier comme "très mauvaise" - voir la légende avec des couleurs en bas:
Les avertissements de feux de brousse australiens utilisent des rayures pour indiquer la gravité la plus élevée.
Exemple:
Vous pouvez essayer de conserver vos couleurs et pendant le codage, si c'est une valeur supérieure à 40, déclencher un point d'exclamation, peut-être dans un triangle ou un cercle. À l'intérieur de la boîte sur le côté droit opposé au triangle. Ou même en dehors de la boîte à côté. Selon le spectre de la lumière visible allant de l'orange au rouge, montrer un nombre croissant de gravité est un bon modèle de conception comme vous l'avez fait. Mais une icône supplémentaire déclenchée à la marque 40+ avec les couleurs peut rendre ce composant de conception plus clair pour l'utilisateur ...
Je dirais qu'il n'y a aucun avantage à les dénommer différemment. Bien que vous ayez dit que 47 est pire que 42, vous avez également déclaré que tout ce qui dépasse 40 nécessite une action immédiate.
Il semble que l'action que l'utilisateur doit effectuer pour les deux 42 et/ou 47 est le même (agir immédiatement). Par conséquent, je ne vois aucun problème à ce que le style soit le même.
Si l'argument est que 47 est plus important que 42, eh bien ... cela est déjà apparent par le nombre lui-même, donc pas besoin de styles différents pour le montrer.
En résumé, le rouge peut signifier "prendre des mesures immédiates", puis le nombre indique l'ordre de priorité (le plus élevé en premier).
Je vous suggère d'utiliser plus de "jaune" plus clair que le rouge si vous n'avez pas besoin d'utiliser de plus sombre.
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
Ou bien je recommanderais de flasher les limites extérieures de préférence avec la même couleur avec les polices.
Et comme dernière alternative est la combinaison de ces deux ci-dessus
Remarque: Je n'ai pas essayé de créer la même forme géométrique car l'éditeur ne la propose pas par défaut, mais veuillez la considérer comme indépendante de la forme comme votre question et ma réponse est plus en perspective de couleur.