Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. UX
Webdesign

L'art de structurer l'Information efficacement

by
Length:MediumLanguages:

French (Français) translation by Henri Lotin (you can also view the original English article)

L'utilisateur typique d'un système d'information (un site web, par exemple) exercera peut-être trois minutes de bonne volonté, au cours desquelles il (ou elle) va donner cours à la curiosité, peek and poke et essayer de comprendre comment trouver les choses. Si aucun progrès n'est fait à ce moment-là, la relation de l'utilisateur au système deviendra définitivement contradictoire ; des tentatives de recherche supplémentaires seront considérées inutiles. Il y a une petite fenêtre de temps pendant laquelle un utilisateur peut être conquis par le système - nous allons examiner un ensemble de principes qui faciliteront cela.


Catégories mutuelles

Nous commençons par la conception d'un ensemble de catégories qui hébergera des exemples d'informations.

La première condition d'un ensemble intelligible de catégories est qu'elles soient mutuelles. J'entends par là qu'elles subdivisent une population en partitions proportionnées. Peu de choses sont plus ennuyeuses qu'une présentation qui transgresse cette règle. Par exemple :

  • Rapports mensuels
  • Rapports sur les ventes
  • Rapports de Joe
  • Nouveaux rapports

Personne ne veut perdre d'effort mental en essayant de deviner où se trouve quelque chose. Pour éviter cela, présentez les informations dans des catégories mutuelles :

  • Rapports mensuels
  • Rapports hebdomadaires
  • Rapports trimestriels

Ou :

  • Rapports sur les ventes
  • Rapports sur les dépenses
  • Rapports d'impôt

Ou :

  • Rapports de Joe
  • Rapports de Jack

Mais supposons que vous voulez conserver la possibilité de trouver les rapports de Joe et les rapports de ventes et les rapports mensuels ? Vous devez passer à un niveau plus élevé, au cours duquel ces catégories deviennent mutuelles :

  • Rapports par période de temps
  • Rapports par type de flux de trésorerie
  • Rapports par agent
  • Rapports selon l'âge

Définition des espèces

Pour inventer une sorte de terminologie, disons qu'un ensemble commun de catégories doit appartenir à la même espèce. Donc « période de temps » serait une espèce et « mensuel » serait une catégorie au sein de ceci. Cela conduit au principe suivant : l'observateur ne devrait jamais avoir à regarder plus d'une espèce à la fois.

Donc, si un système dispose de ce qui suit :

  • Rapports par période de temps
  • Rapports par région
  • Cubes

Alors, ce principe a été transgressé. Rapports par « Région » et « Cubes » n'appartiennent pas à la même espèce. Voici une meilleure présentation :

  • Rapports
  • Cubes

Elles appartiennent aux espèces, disons, « véhicule de présentation ». « Rapports par région » et « Rapports par période de temps » appartiennent à l'espèce « Rapport ».

Pour assembler ces idées, notez tout d'abord que chaque sous-division commence par vivre comme catégorie et deviendrait ensuite une espèce à part entière :

  • Espèces : Véhicule de présentation
  • Catégories : Rapports et Cubes
    • Espèces : Rapports
    • Catégories : Rapports par période de temps ; Rapports par type de flux de trésorerie ; Rapports par agent ; Rapports selon l'âge
      • Espèces : Rapports par Type de flux de trésorerie.
      • Catégories : Rapports sur les ventes ; Rapports sur les dépenses ; Rapports d'impôt

Ainsi le principe selon lequel un observateur ne devrait voir qu'une espèce à la fois est une autre façon de dire qu'il doit seulement voir les catégories qui sont réciproques entre elles ; ou, pour être plus précis : un observateur ne devrait voir, à un moment donné, qu'une espèce et ses catégories composantes.

Si l'espace le permet, plusieurs espèces peuvent être présentées, aussi longtemps que les limites sont claires, et qu'il n'y a aucune ambiguïté sur l'organisation.


Décisions organisationnelles

Imaginer un ensemble de catégories peut être un très dur labeur ; dans certains cas, ce n'est ni plus ni moins qu'une description conceptuelle de toute une entreprise. À cet égard, il est semblable à la conception d'une base de données.

Il y a une décision de design fondamentale pour l'organisation de données : le choix entre adhésions multiples et adhésion unique. Dans un système d'appartenance multiple, les renseignements se retrouvent dans plusieurs catégories. « Ventes de janvier » peut être dans la catégorie vente ou dans la catégorie mensuel. Un exemple de système d'affiliation unique est un menu de restaurant, où le client ne veut pas trouver (et l'entreprise ne dispose pas d'espace pour) le même élément dans plusieurs rubriques.

Une autre décision porte sur le fait que les étiquettes font référence à des informations ou à des utilisateurs. Un site web de collège peut avoir un onglet nommé « faculté ». C'est ambigu : contient-il des informations pour, ou au sujet de la, faculté ? Certains sites de collège sont explicites : les onglets sont étiquetés "pour la faculté" ou "à propos de la faculté". Toutefois, en règle générale, il est préférable d'étiqueter l'information, pas l'utilisateur. Comment le web designer sait ce qu'un membre du corps professoral voudra chercher ?

Les étiquettes de catégories devraient identifier le contenu de la catégorie. C'est tellement élémentaire que vous pouvez vous demander si'il ne s'agirait pas d'une remarque sarcastique. Si seulement. Ainsi nous pouvons nous référer à cela, nous allons lui donner un nom : le principe de l'étiquetage descriptif.

Les étiquettes de catégorie peuvent être signifiantes pour les utilisateurs réguliers, mais pas pour les nouveaux arrivants. Ceci devrait être surmonté, en ajoutant des sous-étiquettes explicatives. Une fois, j'ai visité un site web théâtral qui avait un choix étiqueté « Discovery Series ». Je n'ai jamais su ce que c'était ; le site avait perdu ma bonne volonté à ce moment-là. Il n'y aurait pas eu beaucoup d'espace pour apporter une précision, quelle qu'elle soit. "Discovery Series — nos conférences du samedi soir" ; ou "Discovery Series  — nos écoutes enregistrées".

Monopole visuel : lorsqu'un utilisateur sélectionne une catégorie, tous les candidats sont présentés ensemble.

La sélection de la catégorie devrait être organisée, pour ainsi dire, en vertu d'un monopole visuel. Les listes de choix ont tendance à capter l'attention ; Si l'utilisateur sélectionne parmi une rangée horizontale de boutons, il ne va pas en même temps remarquer une autre ligne ailleurs sur l'écran. Quand il le découvre, il sera agacé — il a déjà dépensé de l'effort pour essayer de localiser sa cible au sein de la première rangée ; Il a essayé de former une image mentale de l'information comme logé dans les catégories qu'il recherche ; ce sera du gaspillage d'efforts s'il trouve un autre ensemble de catégories ailleurs.

Ce n'est pas destiné à être une interdiction contre les lignes multiples, tant qu'elles apparaissent ensemble, comme une seule population de choix portant sur plusieurs lignes ; elle vise à interdire une rangée, avec une autre ligne, loin de la première sur l'écran, avec des icônes de formes différentes et ayant des catégories pas clairement liées à cette première.


Attitude psychologique de l'utilisateur

Le concepteur de site doit définir les positions psychologiques attendues de l'utilisateur : l'utilisateur est-il une conscience passive, ouverte à la manipulation et le contrôle ; ou une conscience dirigée, recherchant l'information avec un objectif clair à l'esprit ? Dans un premier temps, les principes de la publicité régiront le design ; dans le second, les principes de présentation d'information, qui est l'objet de cet article. Il existe un état intermédiaire : quelqu'un qui n'a pas un objectif clair, mais qui veut néanmoins comprendre la géographie d'information du site ; l'usager est également mieux servi par des principes discutés ici.

Pour voir ces principes (violées) en action, examinez les choix que vous voyez dans Microsoft Word, sous le bouton « Office », Options Word :

  • Populaires
  • Affichage
  • Épreuvage
  • Enregistrer
  • Avancé

Tout d'abord, pour atteindre cette liste, vous cliquez sur le bouton office ; vous voyez une liste de choix. « Options » n'est pas sur la liste. Vous pourriez passer des moments (pas exactement joyeux) à essayer de deviner quel élément choisir. Enfin, lorsque vous êtes prêt à sortir et aller voir ailleurs, vous remarquez un bouton marqué « options » à côté du bouton "quitter", loin des autres choix. Il s'agit d'une violation de la règle de monopole visuel.

Après avoir cliqué sur le bouton options, vous voyez la liste à puce ci-dessus. Ici, nous voyons des noms de catégories qui ne sont pas significatifs. Comment une personne sait-elle si le choix qu'il cherche est populaire ? Comment sait-il si c'est avancé ? Ces étiquettes rompent le principe de l'étiquetage descriptif.

Une fois que vous êtes sensibilisés à ces choses, il vous sera difficile de rater la bonne disposition. Tout va vous offenser. C'est le prix à payer pour l'initiation au cours supérieur sur la présentation des données. Vous devez devenir une lumière dans le monde et faire avancer la cause.


Résumé

Il y aura du dur labeur

Tout d'abord, concevez les catégories. Il s'agit d'une hiérarchie. Au niveau supérieur, un ensemble d'espèces. Chaque espèce contiendra un ensemble de catégories. Chaque catégorie deviendra une espèce à part entière, avec un ensemble de catégories sous elle. Et ainsi de suite. La top liste d'espèces, ainsi que toutes les listes subordonnées de catégories, doivent être mutuelles : notre principe directeur. L'observateur ne devrait jamais voir une liste de catégories sauf si elles sont mutuelles entre elles. Les catégories sont mutuelles si elles subdivisent une population en partitions proportionnées. Il s'agit d'un travail acharné ; il représente le squelette conceptuel de tout l'effort. Afin que vous n'exagériez pas cette tâche, soyez clair au sujet des contenus du projet ; ça peut être un petit sous-ensemble d'activités ou de produits de l'entreprise.

Vous devrez définir votre approche esthétique. J'aime les designs simples, propres et sans encombrement ; je n'aime pas les choses flashy ; j'aime les présentations uniformes, plutôt que, disons, une liste horizontale dans certains endroits et verticale répertoriée ailleurs (bien que celles-ci peuvent être traitées avec goût). Il n'y a aucune raison d'insister sur ce point ; il fait partie du processus créatif, et un bon designer voudra développer ses propres standards.

Ensuite décidez sur le rapport de l'étiquette à l'information. Voulez-vous que l'observateur ne voit que les étiquettes seulement, avec les informations qui apparaissent lorsqu'il clique sur une d'elle ? Ou voulez-vous de l'information ainsi que les étiquettes, au niveau supérieur ? Cela dépendra de la profondeur d'imbrication et de la quantité d'étiquettes.

Réfléchissez attentivement sur les icônes ; ils sont parfois utiles ; pas toujours. Internet Explorer devient moins verbal avec chaque nouvelle version. Il y a une flèche circulaire verte qui veut dire « historique ». Je ne vois pas le rapport. Il y a un carré jaune avec le coin soulevé, ce qui signifie « discuter ». Ni le carré jaune ni le verbal « discuter » ne transmettent quoi que ce soit pour moi. De manière générale, vos clients ne seront pas des archéologues faisant briller une lampe de poche sur un mur de cave ; ils attendront des symboles intelligibles, pas d'énigmes.


Voici les principes :

  • Les catégories devraient être mutuelles.
  • Une catégorie est un composant d'une espèce. Elle peut également devenir une espèce elle-même, s'il y a autres catégories en dessous.
  • Un observateur devrait se pencher sur une seule espèce (et ses composantes de catégories) à la fois.
  • Décidez entre adhésion multiple et adhésion simple. Un élément peut-il être classé dans plus d'une catégorie ?
  • Soyez cohérent dans votre utilisation d'étiquettes : identifient-elles les utilisateurs ou l'information ? Rendez cela évident.
  • Principe de l'étiquetage descriptif : les utilisateurs devraient être en mesure d'inférer le contenu d'une catégorie en lisant l'étiquette.
  • Le sous-étiquettes peuvent être utiles si les étiquettes ne sont pas explicites. Il n'y a habituellement aucune excuse à cela, mais parfois l'étiquette est un nom propre, se référant au programme, produit ou autre attribut exclusif de l'entité en cours de modélisation.
  • Monopole visuel : lorsqu'un utilisateur sélectionne une catégorie, tous les candidats sont présentés ensemble.
  • Je pense que vous serez étonné de la quantité d'effort impliquée dans cette activité. La plupart des sites évoluent historiquement, lorsque des choses sont ajoutées à une conception originale ; cela peut se révéler pratique. Visualiser le tout à l'avance est important, mais vous tirez à bout portant sur les bonnes pratiques.
Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.