TP 2 – Don Norman, Premier regard

Cinq définitions clés de la théorie du design

  1. Affordance

    lien de relation entre l’interface et l’utilisateur.
    Plus précisément : relation entre les propriétés (fonctionalités) de l’interface et les capacités de l’utilisateur de reconnaitre comment l’objet peut être utilisé.

    Donc : Affordance → fonctionnalité de l’interface ET sa capacité à être utilisé par son utilisateur
  2. Signifiers (signaux)

    Si une fonctionnalité est difficilement atteignable, voire inatteignable, lien d’affordance brisé. IMPORTANT de renforcer le lien à l’aide d’un signal. Communication avec l’utilisateur des fonctionnalités qui peut utiliser.

    Contrairement à l’affordance, les signaux SONT DES PROPRIÉTÉS des objets de l’interface.



    ”Good design requires good communication of the purpose, structure, and operation of the device to the people who use it. That is the role of the signifier”.

    -Don Norman



    Exemple de signaux : Icônes sur un bureau d’ordinateur, Boutons avec différents icones sur Reddit, carrés applications sur iPad, inscription “POUSSER” sur une porte.

    RECAP : Affordance : Façons qu’un utilisateur peut utiliser l’interface. Signaux : propriété associée à une fonctionnalité pour la rendre visible à l’utilisateur.
  3. Mapping

    Correspondance entre les propriétés de deux ensembles d’objets. Souvent il s’agit d’interrelation spatiale entre les deux objets.
    Exemple : Voiture : tourner le volant sens horaire fait simultanément tourner les roues dans le même sens.
    Exemple 2 : Menu iPhone : Glisser son doigt vers la gauche applique une translation du menu dans le même sens.
  4. Modèle conceptuel

    Explication très simplifié de comment une fonctionnalité fonctionne. Pas besoin d’être complet NI précis, tant que le modèle est UTILE.
    Exemple : Système de fichier et documents sur un ordinateur : Aide les utilisateurs à se créer un modèle mental de comment l’hiérarchie entre les objets de l’interface fonctionne. (Plus de détails sur les modèles conceptuels dans une prochaine démo 🙂)
  5. Feedback

    Façon de dire à l’utilisateur que sa requête a fonctionné. Il s’agit d’un élément sensoriel ajouté à l’interface .

    Exemple : Like Button Youtube change de couleur lorsqu’on aime une vidéo.
    Exemple 2 : Hyperlien sur Google (voir image Ex2_hyperlien) Change de couleur sur un site déjà visité
    Exemple 3 : Page de confirmation d’achat après une transaction sur un site d’achat en ligne