Comment afficher les noms longs dans les applications mobiles?
Je travaille avec un client qui a une base d'utilisateurs existante avec des noms et des noms d'utilisateur très longs. (c'est-à-dire Xx_fakenamehere_xX) Je ne veux pas les tronquer (ils sont déjà tronqués dans la version actuelle), donc j'essaie de trouver des moyens de résoudre ce problème.
Je peux penser à un certain nombre de stratégies. Regardez également n nom d'utilisateur doit-il être tronqué? et Tronquer les étiquettes de texte longues - Meilleures pratiques? pour quelques idées connexes.
Envelopper . Si le nom dépasse une certaine longueur, vous pouvez passer à une police plus petite et envelopper le nom. Cela ne vous sauvera pas dans tous les cas, car vous n'avez que deux lignes d'espace dans cet en-tête et certaines personnes ont des noms vraiment longs.
Échelle . Diminuez la taille de la police pour adapter le nom. Il est probablement préférable d'avoir une échelle minimale. Vous pouvez combiner cela avec la stratégie de bouclage. Fait pour un code compliqué cependant.
Prénom , éventuellement avec la première lettre du nom de famille. Si le nom affiché est celui de l'utilisateur, cela serait suffisant. Il ne suffit probablement pas d'identifier d'autres utilisateurs du système. Vous avez également besoin d'un moyen (info-bulle peut-être) pour afficher le nom complet. Vous devez également savoir quelle partie du nom constitue le prénom (par exemple, si vous ne demandez qu'un "nom" et non "prénom, nom", je ne pense pas que vous puissiez diviser le nom correctement).
Tronquer . À un moment donné, en regardant où et comment le nom est affiché, vous n'aurez plus qu'à tronquer. Assurez-vous de bien faire les choses et de mettre des points de suspension à la fin et pas seulement de couper le dernier caractère en deux.
Tronquer, mais afficher le nom complet sur flotter en utilisant par exemple une superposition superposée à l'original.
Mon erreur: cette question concerne le mobile qui n'a pas de vol stationnaire! (merci @Sheff) Et toucher le nom tronqué n'est pas une option, car le doigt obscurcirait le nom étendu la plupart du temps.
J'essaierais un bouton sous la colonne des noms (je suppose qu'il y en a une) qui, lorsqu'il est touché et seulement lorsqu'il est touché, élargit la largeur de la colonne des noms permettant aux noms d'être vus en entier.
L'utilisateur peut vouloir voir les noms dans la liste, mais peut-être pas le nom complet tout le temps.
Tenez également compte des différences culturelles lors de la définition du avec et de la taille de police de la colonne des noms d'utilisateur. Peut-être que dans votre culture les noms sont courts et monosyllabiques, comme "John Doe", tandis que d'autres cultures comme en Espagne ou en Colombie ont des prénoms doubles et des noms de famille doubles.
Pas une solution mais quelques éléments à considérer qui peuvent vous aider à définir la solution:
1) Longueur typique
Avez-vous une idée des noms qui figureront dans le système? Vous avez dit que c'est une base d'utilisateurs existante, donc si vous analysez ces données, cela peut donner un aperçu? Si vous connaissez la longueur "typique", cela pourrait vous donner une meilleure idée de la façon de gérer le problème.
Par exemple, si je ne vois souvent que le prénom des gens, et qu'il y a beaucoup de gens avec le même prénom, c'est un gros problème
2) Cas d'utilisation
Comment les gens utilisent-ils les informations de nom, y a-t-il beaucoup de noms répertoriés les uns à côté des autres? Ou est-ce comme un nom de profil, 1 par page. Existe-t-il d'autres identifiants uniques ou le nom fait-il partie intégrante de l'exécution de la tâche?
Autre que la solution évidente de suggérer une taille de police plus petite pour garantir que le nom rentre dans la liste, une conception suggérée avec laquelle vous pouvez aller est d'afficher le prénom avec une liste déroulante à côté du nom d'utilisateur qui, lors de l'expansion, affiche le nom complet et tous les autres détails que vous voudrait montrer.
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
Un exemple d'un site qui fait cela est Gmail (bien que j'avoue qu'ils montrent l'identifiant de messagerie connecté) 