1. Mode Graphique
    1. 1- Principes fondamentaux
      1. Processus de conception
      2. Caractéristiques d'un grand logiciel
        1. Haute performance
        2. Facilité d'utilisation
        3. Aspect attractif
        4. Fiabilité
        5. Adaptabilité
        6. Interoperabilité
        7. Mobilité
      3. Principes de conception
        1. Principes (1)
        2. Principes (2)
        3. Principes (3)
      4. Pensez aux utilisateurs
        1. Compatibilité internationale
        2. Accessibilité aux handicapés
        3. Etendre l'interface
      5. Priorités
    2. 2- L'expérience du Mac
      1. L'environnement
        1. L'environnement (1)
        2. L'environnement (2)
      2. Les technologies
        1. Les technologies (1)
        2. Les technologies (2)
        3. Les technologies (3)
        4. Les technologies (4)
      3. Installation et mises à jour
        1. Packaging, installation
        2. Les assistants
    3. 3- L'interface Aqua
      1. Entrées utilisateur
        1. La souris
        2. le clavier
          1. Fonction des touches
          2. Raccourcis-clavier
          3. Navigation au clavier
        3. Sélection
        4. Edition de texte
      2. Glisser-déposer
        1. Glisser-Déposer (1)
        2. Glisser-Déposer (2)
      3. Le texte
        1. Les fontes
        2. Le style
      4. Les icônes
        1. Genres et familles d'icônes
        2. Création des icônes
        3. Icônes des barres d'outils
        4. Images propres au système
      5. Les pointeurs
      6. Les menus
        1. Comportement des menus
        2. Conception des menus
        3. La barre de menus
          1. Les menus (1)
          2. Les menus (2)
          3. Les menus (3)
        4. Menus contextuels et du Dock
      7. Les fenêtres
        1. Type et apparence
        2. Eléments
          1. Barre de titre
          2. Barre d'outils
          3. Barre de recherche
          4. Barre latérale
          5. Barre inférieure
          6. Les Tiroirs
        3. Comportement des fenêtres
          1. Comportement (1)
          2. Comportement (2)
          3. Superposition
          4. Défilement
        4. Les panneaux
          1. Les panneaux
          2. Panneaux transparents
          3. Autres panneaux
      8. Les dialogues
        1. Types de dialogues
        2. Aspect et comportement
      9. Fenêtres de dialogues
        1. Recherche, Préférences, Ouverture
        2. Enregistrement
        3. Choix, Impression
      10. Les contrôles
        1. Contrôles du cadre
          1. Contrôles en capsule
          2. Contrôles hérités
        2. Les boutons
          1. Boutons poussoirs
          2. Boutons en icônes
          3. Boutons de recherche
          4. Boutons de gradient, et d'aide
          5. Boutons à champfrein
          6. Boutons ronds
        3. Contrôles de sélection
          1. Boutons radio
          2. Cases à cocher
          3. Contrôles segmentés
          4. Boutons et menus pop-Up
          5. Menus Action
          6. Boîtes de combinaison
          7. Contrôles de chemin
          8. Puits, sélection de date
          9. Menus pop-down
          10. Glissières
          11. Contrôles pas-à-pas et placards
        4. Indicateurs
          1. Indicateurs de progression
          2. De niveau, de capacité
          3. D'estimation, de pertinence
        5. Contrôles de texte
          1. Champs d'entrée
          2. Champs à jeton
          3. Champs de recherche
          4. Listes de défilement
        6. Contrôles de visualisation
          1. Triangles d'affichage
          2. Boutons d'affichage
          3. Vues en liste
          4. Vues en colonnes
          5. Vues éclatées
          6. Vues à onglets
        7. Contrôles de groupage
          1. Séparateurs
          2. Boîtes de groupage
        8. Règles de disposition
          1. Dans le corps de la fenêtre
            1. Fenêtre de préférences
            2. Fenêtre à onglets
            3. Alerte, Dialogue
          2. Contrôles réduits et mini
            1. Contrôles réduits
            2. Mini contrôles
          3. Groupement des contrôles
          4. Positionnement dans la barre inférieure
      11. Glossaire
        1. Entrées en anglais
          1. 1- A à C
          2. 2- D à H
          3. 3- I à R
          4. 4- S à Z
        2. Entrées en français
          1. 1- A à C
          2. 2- C à G
          3. 3- I à P
          4. 4- P à Z
        3. `
    4. 4- Les leçons de Lion
      1. L'environnement de Mac OS X
      2. Principes fondamentaux
      3. L'expérience utilisateur
        1. Règles de conduite (1)
        2. Règles de conduite (2)
        3. Règles de conduite (3)
        4. Règles de conduite (4)
        5. Règles de conduite (5)
        6. Règles de conduite (6)
      4. Les technologies d'Apple
        1. Les technologies (1)
      5. -->
  2. Mode Commande

Principes de conception de l'interface utilisateur (3)




Ce que dit Apple :




6- Stabilité ressentie

L'interface Aqua est conçue pour procurer un environnement compréhensible, familier, prévisible. Pour donner un sentiment visuel de stabilité, l'interface définit de nombreux éléments graphiques standards, comme le barre des menus, les contrôles des fenêtres. Avec cet environnement familier, ils savent comment les choses se comportent, et comment les utiliser.

Pour cela, l'interface fournit un ensemble clair et fini d'objets, et un ensemble d'actions pour agir sur ces objets. Par exemple, si une commande de menu ne s'applique pas à un objet sélectionné, ou à l'objet dans l'état où il est, l'affichage de la commande est assombri, il n'est pas supprimé.

Pour garder cette perception de stabilité, conservez les réglages de l'utilisateur, comme la dimension et la position des fenêtres. Ces réglages doivent se maintenir jusqu'à ce que l'utilisateur les modifie.

La rétroaction, et des informations d'état contribuent aussi au sentiment de stabilité, en faisant savoir à l'utilisateur dans quelle tâche l'application est impliquée.


7- L'intégrité esthétique

Cela signifie que l'information est bien organisée, et conforme aux principes d'une bonne vision. Le produit doit être agréable sur l'écran, même sur une longue période.

Faites des graphiques simples, et n'y recourez que quand ils améliorent vraiment les choses. Ne surchargez pas les fenêtres et les dialogues avec des douzaines d'icônes et de boutons. Pour représenter des concepts, n'utilisez pas des symboles arbitraires qui peuvent confondre ou distraire les utilisateurs. L'organisation des fenêtres, et la disposition des éléments de l'interface utilisateur doivent reproduire le modèle mental de l'utilisateur pour la tâche accomplie par l'application.

Il y a plusieurs choses qui peuvent fournir une meilleure qualité :
• Toutes les icônes doivent être d'excellente présentation.
• L'anti-crénelage du texte ; Il est automatique avec les fontes standard.
• Les tailles et les types de fontes doivent être homogènes dans une fenêtre.
• La taille des contrôles doit aussi être homogène dans une fenêtre. Ne pas mélanger des contrôles standards et des petits.

Associez un élément graphique au comportement que l'utilisateur en attend. Ne modifiez pas la signification ou le comportement des items standards. Par exemple :
• Toujours utiliser des cases à cocher pour des choix multiples, mais pas pour des choix exclusifs.
• Les boutons poussoir ont une action immédiate, comme "Ouvrir".
• Eviter les boutons poussoir pour afficher des menus pop-up ou comme onglets.
• Ne pas utiliser des boutons arrondis comme onglets.


8- Pas de comportement modal, sauf cas particulier

Autant que possible, permettez aux utilisateurs de faire ce qu'ils veulent à tout moment. Evitez un comportement modal qui les enferme dans une opération, et les empêche de faire autre chose tant que l'opération n'est pas terminée.

Avec les tiroirs et les feuilles, Mac OS X fournit un comportement non modal : les tiroirs procurent une fonctionnalité complémentaire tout en permettant l'accès à la fenêtre parente ; les feuilles sont des dialogues modaux affectés à la fenêtre parente, pour éviter l'usage de dialogues modaux d'application.

Le comportement modal peut être acceptable dans certains cas :
• Des modes à court terme, où l'utilisateur agit en permanence pour maintenir le mode ; par exemple, maintenir enfoncé le bouton de la souris pour parcourir du texte, ou presser la touche Maj pour étendre une sélection de texte.
• Des alertes, dans lesquelles un utilisateur doit rectifier une situation inhabituelle avant de continuer. Les utiliser le moins possible.
• Des installeurs et des assistants, dont le but est de guider l'utilisateur dans des tâches importantes.

D'autres modes sont possible dans les cas suivants :
• Ils miment une situation familière, qui est elle-même modale ; par exemple, le choix d'un outil dans une application.
• Ils changent seulement les attributs d'un objet, pas son comportement ; par exemple, un mode gras ou souligné dans du texte.
• Ils bloquent toutes les opérations normales du système pour mettre l'accent sur le mode ; par exemple, une fenêtre de dialogue qui rend toutes les commandes de menu inutilisables, sauf Couper, Copier, Coller.

Si une application utilise des modes, il doit y avoir une indication visuelle claire du mode en cours, et il doit être très facile de sortir du mode ou d'y entrer. Par exemple, dans beaucoup d'applications graphiques, le pointeur est une indication de mode, comme un crayon, une croix, un pinceau, une gomme. Des contrôles segmentés peuvent aussi indiquer des modes, comme dans iPhoto.


9- Gérer la complexité du logiciel

La meilleure approche pour un logiciel facile à utiliser est une conception aussi simple que possible. Une conception simple est une bonne conception, et les meilleurs outils sont ceux que dont l'utilisateur n'est même pas conscient. Plus vous simplifiez l'interface, plus vous avez de chances de faire un produit qui satisfait les besoins et est agréable.

Plus la tâche de l'application est complexe, plus il est important de maintenir une interface simple et bien conçue : respecter le modèle mental de l'utilisateur. Quelques moyens pour gérer la complexité :
• La découverte progressive, propose d'abord à l'utilisateur les choix les plus courants, et fournit des options pour découvrir des choix complémentaires ou plus d'information. Cela facilite la compréhension par les débutants, et permet aux plus compétents d'accéder à des caractéristiques plus évoluées.
On peut utiliser des triangles ou de boutons de découverte.
• Les fenêtres d'inspection (ou à un moindre degré les fenêtres d'information) diminuent la confusion de l'interface principale en affichant une information complémentaire ou des réglages dans une fenêtre séparée, qui peut visualisée ou cachée par l'utilisateur.
• Les préférences réduisent la complexité de l'interface utilisateur en lui permettant de personnaliser ce qu'il veut voir sur l'écran, et le comportement de l'application. Proposez des Préférences pour permettre au débutant ou à l'expert de moduler l'application en fonction de leurs besoins.


Mes commentaires en tant qu'utilisateur :

J'ai encore une fois envie de réagir à propos de l'intégrité esthétique ! Est-ce que la semi-transparence, utilisée maintenant à toutes les sauces par Apple préserve l'intégrité esthétique des fenêtres qui sont affichées ? Evidemment non ! Voilà comment on peut s'aveugler quand on appartient à une équipe qui ne réfléchit plus à ce qu'elle fait, et ne sait pas revenir aux fondamentaux...

La semi-transparence fait exactement que qu'Apple recommande de ne pas faire : "ne surchargez pas les fenêtres". Une information surchargée (et qu'est la semi-transparence sinon cela ?) est contraire aux principes d'une bonne vision ! Mais cela n'empêche pas Apple d'y recourir à tout bout de champ ! Voilà pourquoi je deviens méchant !

Apple recommande aussi de conserver la dimension et la position des fenêtres, mais l'une de ses applications les plus utilisées, Text Edit, ne sait pas le faire ! C'est d'autant plus stupide que la position des fenêtres annexes (la fenêtre de recherche, le tableau des couleurs) est correctement conservée, mais pas celle de la fenêtre principale ! Faites l'expérience : ouvrez un fichier Text Edit, déplacez-le sur votre écran, sauvegardez-le, et fermez la fenêtre. Puis ouvrez à nouveau le même fichier... où est la fenêtre ? La position que vous lui aviez donnée a été perdue ! Cela fait des années que cette situation dure, en contradiction flagrante avec les recommandations d'Apple. Et pourtant, pour les ingénieurs d'Apple, la mise en conformité avec celles-ci ne serait qu'un jeu d'enfant... Le discours est édifiant, mais les actes ne suivent pas.

En fait, à chaque fois que vous ouvrez Text Edit, il crée un document sans titre toujours au même endroit sur l'écran et conserve cette position indéfiniment. C'est très gênant pour l'utilisateur, car cela l'oblige à re-posisionner ses fenêtres, dans des configurations qu'il est amené à rencontrer très souvent. Cependant, les modifications de taille que vous apportez à votre document sont conservées. La position de l'ascenseur et celle du curseur au moment de la sauvegarde ne sont pas non plus conservées. Il serait pourtant souhaitable de retrouver le document dans l'état où on l'a laissé ! (au besoin, ce pourrait faire l'objet d'une Préférence).

Les passages sur la stabilité ressentie et la gestion de la complexité ont été rajoutés depuis la version de 2001, qui n'en faisait pas état ; les autres sont repris presque intégralement, avec quelques adjonctions occasionnellement. Rien à dire de particulier sur ces recommandations pleines de bon sens, et bien pensées, sauf qu'entre la théorie et la pratique, il peut y avoir beaucoup de marge ! Tous ces conseils rendent difficile la tâche du programmeur.