Affichage des initiales de l'utilisateur (nom), mais que se passe-t-il si plus d'un utilisateur a les mêmes initiales?
Je conçois une application dans laquelle les utilisateurs peuvent attribuer des tâches à d'autres personnes. L'espace dont je dispose pour transmettre à qui la tâche est assignée est d'environ 23-25 pixels. Donc en ce moment, nous montrons juste deux initiales, ex: Megan Smith serait montrée comme MS
Mais il y a un problème. Que faire si plus d'un utilisateur porte les mêmes initiales?
Les options que nous avons exclues sont,
- Nous ne différencions pas les gens en utilisant des couleurs.
- Nous n'allons pas utiliser une image miniature de l'utilisateur car cela ajoute de l'encombrement.
Également important - l'utilisateur doit être en mesure de dire à qui la tâche est affectée sans avoir à passer/cliquer sur la tâche. L'idée est que vous devriez pouvoir le voir en un coup d'œil.
Que devons-nous faire ici?
L'un des problèmes immédiats est l'évolutivité, vous ne pourrez jamais prendre en charge 26 * 26 utilisateurs sans ambiguïté que le maximum absolu, bien que cela nécessiterait des utilisateurs avec des initiales comme QX et ZJ, donc en réalité ce sera un ensemble plus petit, même si vous êtes global.
vous excluez les info-bulles (ce qui est une bonne idée entre autres), cependant, vous pouvez prendre en compte d'autres éléments:
- des panneaux plus grands: faites de la place dans votre interface utilisateur s'il est crucial que les utilisateurs soient reconnaissables de manière unique, mais que les techniques pour les créer dans un si petit espace (images, info-bulles) sont exclues.
- ensembles restreints d'utilisateurs: affiche uniquement les utilisateurs assignables s'ils sont réellement assignables. Je suppose ici, mais l'attribution des tâches est généralement effectuée à quelqu'un de spécifique et pertinent, pas seulement à n'importe qui.
- marquage basé sur le rôle: autoriser l'attribution de rôles d'utilisateur et utiliser ces informations
- marquer le dernier utilisateur auquel vous avez attribué une tâche, ou les trois derniers ou quelque chose comme ça
- si vous rencontrez deux utilisateurs avec les mêmes initiales dans un ensemble restreint, marquez l'un et non l'autre - gardez cela cohérent (cela pourrait ne pas vraiment fonctionner en conjonction avec d'autres marques)
Je mentionne le marquage plusieurs fois. Je conseillerais les bordures plutôt que la couleur. Vous n'avez pas besoin d'utiliser une bordure complète qui donne des options pour différentes marques. Vous pouvez également appliquer du gloss (comme Stack Exchange le fait avec ses badges de balises)
Cela dépend un peu des mathématiques. Vous pouvez vérifier si l'ajout d'une lettre supplémentaire dans des cas conflictuels résoudrait tous les conflits pour le moment (vous ne pouvez pas savoir pour l'avenir). Ainsi, par exemple, si Megan Smith est déjà MS, Matt Smith pourrait devenir MSm. Vous pouvez également débattre de la transformation de Megan en MeS et de Matt en MaS pour le garder plus clair et plus informatif. Cependant, aucun de ces systèmes n'est parfait et ils ne s'adapteront pas bien.
Je suggère d'utiliser la zone 25 px comme une "carte". En le qualifiant de carte - je veux dire un jeu de cartes physique. Maintenant, gardant cela comme une métaphore - Idéalement, il y aurait deux côtés d'une carte. Dans le monde numérique au toucher, la carte retourne. Pour confirmer la sélection de cette "personne" "MS" - utilisez un curseur sur ON/OFF, ou balayez vers la droite (pour le déplacer vers le bac pour d'autres actions) ou une approche rationnelle qui convient le mieux au contexte (non descriptif car cela serait un sujet à part entière)
Maintenant face à face peut avoir votre "MS" ou "MS2 "ou" MS3 ", j'utilise
- nombres ou deux premières lettres raccourcies "Ma" "Moi" ici en tant que sous/super-script pour décodifier la différence.
- Direction - Pouvez-vous changer le flux de direction horizontal des lettres en vertical?
- Vous pouvez soit avoir police de caractères différente pour différencier différentes personnes comme une autre idée, ce qui peut réduire la sensation d'encombrement mais des dispositions avec plus d'attribut comportemental pour identifier la personne par des moyens implicites.
- Combiner ces options
Pourquoi les polices de caractères?
Puisque vous négligez d'utiliser des couleurs - j'essaie ici de renforcer l'idée d'identité de marque en utilisant des différences typographiques. Je n'ai pas de recherche actuellement pour soutenir cela. Mais sur une période de temps si vous associez une police de caractères à une personne - ou plus qui s'imprègne de l'identité de marque ou de l'identité personnelle de la personne - à quel point les visages, les couleurs, les robes définissent une personne.
Maintenant face arrière de la carte - il s'agit simplement d'une transition animée en utilisant du code JS simple sur l'application (ou tout autre moyen), la carte retourne (rappelez-vous - retourner seulement si dans le besoin ou au pire une confusion survient), tandis que retourné, vous pouvez montrer un Gravatar ou des détails spécifiques de la personne qui déchire le puzzle ou en décodifie un autre. - Mieux vaut que cette étape soit une saveur supplémentaire pour aider à la confusion, mais pour tuer une manière monotone de différenciation - nous essayons de construire des expériences élégantes et agréables.
lors de l'inscription de l'utilisateur, avoir un champ appelé "initiales affichées" et y mettre leurs initiales par défaut.
si ceux-ci sont pris, faites-leur choisir un autre ensemble d'initiales
Vous pouvez ajouter une info-bulle pour afficher le nom complet de la personne lorsque vous survolez le contrôle.
C'est un problème que je rencontre aussi très souvent au travail. L'info-bulle aurait été une excellente solution sur le bureau, vous pouvez avoir un bouton WHO à côté des initiales montrant le nom complet ou l'image ou les deux lorsque vous appuyez dessus; ou Lorsqu'il est sélectionné, le nom peut avoir une info-bulle complète. Ainsi, lorsque vous faites glisser l'élément sur le nom, lorsqu'il est concentré sur l'élément, le nom devient complet; sinon initiales.
Quelques idées.
24px par 24px en utilisant une police Arial est beaucoup d'espace pour afficher clairement 3 lettres. Vous pouvez donc jouer avec le choix de la police et la taille.
Cette taille est également suffisamment d'espace pour afficher un glyphe ou une icône pour les utilisateurs individuels. Comme un coup de tête ou similaire. Cela pourrait même être une caractéristique de l'application que les gens sélectionnent leur propre image. De nombreuses applications de communication qui s'exécutent sur les téléphones le font généralement.