ANALYSE ET CONCEPTION DE SYSTÈMES

NOTES DE COURS 10




LES NORMES DE CONCEPTION
"DESIGN GUIDELINES"







Pour le designer professionnel, le livre de référence essentiel est The Windows Interface Guidelines for Software Design. C'est produit par Microsoft Press et ça couvre tous les éléments du design d'une application Windows, incluant l'aspect visuel, l'interface GUI.



Programming today is a race between software engineers striving to build bigger and better idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning.
-- Rich Cook


Principes de design

  • L'utilisateur a le contrôle:
    L'utilisateur doit sentir qu'il contrôle le logiciel plutôt que d'être contrôlé. L'utilisateur initie les tâches au lieu de toujours réagir aux actions du programmes. L'utilisateur doit être capable de personnalier certains aspects de l'interface - la couleur, les fonts, etc.

  • Consistence:
    La consistence permet à l'utilisateur de transférer des habiletés acquises à un nouvel environnement. Quand l'interface est familier et prévisible, l'utilisateur peut concentrer sur la tâche sans avoir à se soucier d'apprendre des nouvelles commandes, actions, etc.
    Consistence dans le produit: commandes agissent de la même façon partout - "Couper" veut toujours dire "Couper et mettre dans le Clipboard" - ne doit pas effacer à un endroit et couper à un autre.
    Consistence avec Windows: utiliser les actions de Windows dans la mesure du possible - elles sont connues de l'utilisateur
    Consistence des symboles: utiliser les symboles appropriés - la poubelle a une signification différente de l'incinérateur - l'utilisateur reconnait qu'un document incinéré ne pourra pas être récupéré.

  • Permissivité (en anglais on dit "Forgiveness"):
    Permet à l'utilisateur d'explorer, d'essayer différentes choses sans faire sauter tout le système - l'utilisateur va faire des erreurs et il faut que le logiciel pardonne ses fautes et puisse récupérer facilement - la touche "Undo" doit être disponible dans la mesure du possible.

  • "Feedback":
    On donne toujours du feedback en réponse aux actions. Le feedback peut être visuel ou auditif. Par exemple, on change le curseur pendant qu'un document charge ou on montre une barre d'état qui affiche le progrès des opérations. L'utilisateur devient frustré au bout de quelques secondes devant un écran qui semble mort et un clavier qui ne répond pas aux commandes.

  • Esthétique:
    Esthétique = beauté, apparence visuelle. L'environnement doit être plaisant, agréable aux yeux; l'apparence doit contribuer à la compréhension de l'information présentée.

  • Simplicité:
    L'interface doit être simple sans être simpliste, facile à maitriser et convivial. Il doit aussi fournir toutes les fonctions dont l'application a besoin. Il faut balancer la simplicité et la fonctionnalité de l'interface. Par exemple, en utilisant des menus contextuels (Popup menu), on maintient la fonctionnalité sans encombrer l'écran de trop de fonctions à la fois.



Méthodologie de design

  • L'équipe: on requiert des habiletés en développement, design visuel, graphisme, rédaction technique, ergonomie et testing. Il est rare de trouver toutes ces habiletés chez un seul individu - il faut donc former une équipe qui regroupe des personnes ayant l'expertise dans ces différents domaines.

  • Le cycle de design:
    • Le design: concevoir l'application - établir le but final, comprendre les exigences du client et comprendre les utilisateurs. Lorsqu'on sait ce qu'on doit réaliser, on dessine un premier plan sur papier et, si possible, on le valide avec l'utilisateur. On incorpore dans le dessin les suggestions du client et on raffine le plan.

    • Le prototypage: un prototype est un modèle physique du produit final qui n'a pas nécéssairement toutes les fonctions du vrai produit. Les outils RAD (PB, VB, Delphi) sont très utiles pour cette tâche. Par exemple, on peut créer un Form (ou un Window) qui a toutes les caractéristiques du produit final mais qui n'a pas la fonctionnalité, c'est à dire qu'il n'a pas de code; mais, du point de vue visuel, on peut l'évaluer et le tester. Pour développer le produit final on modifie graduellement le prototype de sorte à ce qu'il possède éventuellement toutes les fonctions requises.

    • Le testing: on implique l'utilisateur dans le processus de testing - on appelle ceci "usability testing" car on évalue si le produit est utilisable et convivial. Il faudra aussi faire du "quality testing" pour trouver les bugs dans le code et s'assurer que les calculs sont exacts.



Le design visuel - création du GUI


  • Principes de base:
    Le design visuel de l'application est beaucoup plus que de la décoration - c'est un outil de communication important. Le design visuel détermine si l'utilisateur capte le message ou bien s'il reste confu et frustré.
    En créant le design visuel on essaie d'utiliser l'écran à son maximum. On utilise la composition, les formes, les couleurs, le contraste et le focus afin de communiquer le message de la façon la plus efficace possible.

  • Composition et organisation:
    Détermine comment les éléments sont placés à l'écran; on lit un écran comme un page - l'oeil est attiré par les couleurs avant le noir et blanc, par un dessin avant un texte, etc. En plaçant les éléments il faut penser à comment on veut qu'ils soient perçus.

    • La séquence: placer les informations importantes en premier, placer les tâches dans l'ordre où elle sont exécutées.

    • Le focus: attirer l'attention sur les points importants en les isolants ou avec la couleur, par exemple.

    • Relations entre les éléments: indiquer quand différents éléments ont un rapport entre eux; par exemple, si une adresse est composée de quatre champs, mettre un cadre autours.

    • Le déroulement, "flow": tous les éléments doivent se suivre logiquement; ils doivent aussi avoir tous une raison d'être et contribuer à l'effet visuel total de l'interface.


  • La couleur:
    • La couleur peut servir à augmenter l'efficacité du message en attirant l'attention, en créant des associations dans l'esprit ou en établissant un état psychologique.

    • La couleur est subjective - ce qui est plaisant pour un peut être déplaisant pour l'autre.

    • L'interprétation des couleurs peut être culturel - une couleur n'a pas toujours la même signification.

    • Un certain nombre de personne ont des difficultés avec les couleurs; environ 9% des hommes souffrent d'une forme quelconque de daltonisme.

    • La couleur devrait être secondaire dans l'interface - on le crée en monochrome d'abord et on ajoute la couleur pour faire resortir certains points.

    • Utilser une palette restreinte - même si on a 16 million de couleurs disponibles, on n'est pas obligé de toutes les utiliser. L'utilisation de trop de couleurs rend l'interface chargé et compliqué. En général les couleurs sobres sont préférables aux couleurs voyantes. On doit aussi éviter les contrasts dans le "background" et "foreground" - du rouge sur fond vert, par exemple, est déplaisant pour l'oeil.



[ PAGE D'ACCUEIL ]      [ PRÉCÉDENTE ]      [ SUIVANTE ]