Concevoir un calendrier de type Gantt en niveaux de gris
J'ai eu du mal à décider si cela devait aller ici ou sur le site de conception graphique. J'espère avoir bien compris!
Je repense donc une application de planification. Cela ressemble à ceci: 
Chaque activité a une couleur différente.
Le client souhaite l'intégrer à un autre produit qui utilise principalement des niveaux de gris et n'a que des couleurs pour les alarmes et autres.
Quelqu'un at-il une bonne idée de la façon d'aborder cela? Je pensais utiliser différentes icônes pour les différentes activités mais parfois les activités sont vraiment courtes et ensuite l'icône ne rentre pas dans le bloc.
Il y a aussi beaucoup d'activités différentes (environ 15-20) que vous souhaitez distinguer.
Toute aide serait très appréciée!
* Edit: Un bon point par @ dan1111, c'est une application de bureau, il est donc possible d'utiliser des info-bulles et autres.
N'oubliez pas que le "daltonisme" n'est pas l'absence totale de couleur. Cela s'appelle Achromatopsia et il n'est vu que chez 1 personne sur 33 000. Ce dont les humains souffrent généralement, c'est d'une déficience dans le développement des cônes dans les yeux, ce qui rend difficile de déchiffrer les différences de couleurs telles que le rouge et le vert, ou le bleu et le vert.
Comme mentionné ci-dessus, les motifs sont un excellent moyen de séparer visuellement différents éléments. Cependant, trop de motifs créeront beaucoup de bruit. Ce bruit a le potentiel d'avoir un impact négatif sur l'expérience utilisateur en allongeant le temps de compréhension, plutôt qu'en le raccourcissant. Une bonne règle de base est que si vous considérez que les éléments ont "trop de couleur" dans une zone, ce serait aussi "trop de motifs".
Cela étant dit, bien sûr, il nous reste à essayer de décider comment rendre cela plus facile à comprendre (IE: plus rapide à comprendre). Alors ... commençons par trouver exactement ce dont nous avons besoin.
1. Plusieurs zones de grande taille pour désigner différentes activités.
2. Séparation visible de ces activités afin que les utilisateurs puissent numériser et comprendre leur sujet/signification dans un délai de 800 ms (0,8 seconde).
Ok, considérons que ces zones seront probablement de forme rectangulaire. De plus, nous POUVONS avoir des info-bulles car c'est une application de bureau, cependant; il est réaliste de penser que les info-bulles ou autres "fonctionnalités" ajoutées sont des éléments erronés et que les informations pourraient être mieux fournies d'une autre manière.
Ok, avec la forme en tête, il est plus facile d'employer les Gestalt Principles afin de mieux regrouper les activités pour faciliter le scan mental des informations. Ok, comprenant cela, voyons ce que nous pouvons faire avec ces grappes d'informations.
- Utilisez le contraste pour indiquer différentes activités (utiles en niveaux de gris ou non). Le contraste doit avoir une augmentation ou une diminution de 15% de la luminosité entre les éléments. En effet, si la différence de luminosité est inférieure à 10%, ceux qui ont des défauts de couleur auront plus de mal à numériser.
- Utilisez l'espacement pour indiquer différentes activités. Cela donne également aux articles plus de marge de manœuvre pour l'aider à paraître plus propre (si cela est fait correctement). Cela peut être plus difficile à utiliser car vous disposez de colonnes de temps pour indiquer l'heure à laquelle l'activité se produit.
- La loi du destin commun peut être très utile ici. Vous pouvez être en mesure d'utiliser ce principe de psychologie pour aider à indiquer le moment où l'activité se produit ou "Place 1", "Place 2", etc., comme vous l'avez sur votre maquette actuelle. (IE: vous pouvez demander aux groupements de créer des lignes perçues, au lieu de "montrer" des lignes ici.)
Je pourrais continuer indéfiniment, mais à la place, je terminerai avec quelques autres éléments à garder à l'esprit lorsque vous filaire ou maquette votre nouvelle version:
La loi de la bonne gestale et la loi de l'expérience passée sont très utiles. IE: Retirez tout ce qui ne doit PAS être là ou qui est trop compliqué (IE: info-bulles). En outre, examinez les éléments préexistants dans la vie de tous les jours qui ont la même fonction et découvrez POURQUOI ils fonctionnent et comment les gens les utilisent efficacement (ou pourquoi ils NE SONT PAS efficaces).
Enfin, si votre nouveau projet ne fonctionne pas en niveaux de gris, il ne fonctionnera pas en couleur. J'entends beaucoup de Push back contre cette directive, mais elle est utilisée par les meilleurs concepteurs de logo (c'est là que je l'ai appris) et je l'ai utilisée avec succès dans Level Design (pour les jeux 16 bits), création de logo, pixel art et création de sites web. Je n'ai jamais eu cette simple directive pas vrai.
Quoi qu'il en soit, bonne chance dans votre entreprise et j'espère que cette réponse a été utile.
Pour commencer, c'est une bonne idée de ne pas se fier uniquement aux couleurs (à cause du daltonisme).
- Les couleurs peuvent peut-être toujours être conservées, si elles dans l'échelle de gris entraînent différentes nuances de gris - ce qui peut aider l'utilisateur à numériser la zone.
- La sélection de l'activité 1 pourrait mettre en évidence toutes les zones d'activité 1 dans le calendrier.
- Ajoutez une abréviation de l'activité de chaque bloc.
- Expérimentez avec des modèles. Découvrez comment Stat Counter affiche "Autres" avec une ligne pointillée. Aucune couleur n'est nécessaire pour cela.
Les couleurs ne seront pas un bon moyen de distinguer 15-20 activités, point final. Il y en a trop et les couleurs seront similaires.
Outre les très bons points soulevés par Henrik Ekblom,:
- Je voudrais afficher le nom de l'activité ou la première partie de celui-ci chaque fois qu'il y a de la place.
- S'il existe une fonctionnalité d'infobulle telle que le survol de la souris (pas clair s'il s'agit d'une application de bureau), utilisez-la également pour afficher le nom de l'activité.
- Il peut être utile de laisser l'utilisateur filtrer les activités affichées.
- Vous pouvez proposer une vue qui modifie l'échelle de l'axe du temps, de sorte que les événements soient plus larges et que davantage d'entre eux aient de la place pour une étiquette.
Vous pouvez utiliser le hachage, par exemple:
Voici quelques suggestions que j'ai appuyées pour concevoir un système d'ordonnancement basé sur un diagramme de Gantt pour un gros client à St. Louis.
Modes - éventuellement un sélecteur déroulant
- Un mode tout parce que l'utilisateur veut voir les éléments en contexte les uns avec les autres. Si vos icônes ne correspondent pas, je suggère d'utiliser un état de vol stationnaire pour les petits moments.
- Modes qui permettent à l'utilisateur de voir une ou plusieurs des alarmes ou des actifs. Par exemple, vous pouvez faire apparaître les autres éléments de Gantt en grisé tandis que les éléments en surbrillance deviennent plus apparents.
Selon les autres activités et les types d'alertes, vous souhaiterez peut-être distinguer une hiérarchie de priorité. Cela vous permettrait de développer un thème graphique qui fera ressortir les éléments actionnables les plus importants pour l'utilisateur.