IFT2905 - Semaine 3 - ✨ L'utilisateur qui navigue l'interface ✨

Microdevoir 2

• Disponible sur studium
• à remettre le 27 janvier, 23h59
• L'écran du protoype figma à critiquer est bel et bien le premier écran que l'on voit sur le prototype:

Le meilleur achat que vous pourrez faire de votre vie*

*nous ne sommes pas affiliés à Don Norman ni à Amazon

Plan de la démo

1. Concepts importants; démo IRL avec switch de lumière et mannette wii;
2. 👀

Concepts importants

• Affordance

Capacité d’action qu'un utilisateur peut effectuer avec un objet

La relation entre l’utilisateur et l’objet qui déterminent comment l’objet peut être utilisé

• Signifiants

utilisés pour rendre visible les affordances:

• ils indiquent quelles actions sont possibles, et (souvent)

• où et comment ils devraient être appliqués

Exemple:

Sur l'interface ci-contre:

Affordance: le bouton lui-même. Ce n'est PAS le carré blanc qui ressemble au bouton, mais bien l'espace designé dans l'interface qui, lorsque appuyé, va activer l'action reliée à celui-ci.


Signifiants: - Le carré blanc servant à designer le bouton qui nous indique qu'on peut appuyer sur cette partie là de l'écran.
- L'ampoule qui indique que c'est bel et bien une lumière que l'on contrôle
- Le label (étiquette?) qui indique la lumière se retrouve dans quelle chambre
- Le pourcentage pour indiquer l'intensité à laquelle la lumière brille.
source

TLDR: Les signifiants nous aident à rendre une affordance qui n'est pas si apparante à l'utilisateur plus visible.

• Correspondances (mapping)

Une relation logique entre la dynamique de contrôle d'une interface et l'action ou résultat de ce contrôle.

Correspondance naturelle

Prendre avantage des analogies au monde physique ou aux standards culturels.

Un exemple: La mannette Wii avec l'accessoire "Volant" pour Mario Kart Wii

À réfléchir:

plusieurs personnes ont préferé utiliser l'autre type de contrôle pour contrôler leurs voitures de Mario Kart. Pourquoi?  Est-ce que malgré cela, le contrôle "volant" est plus facile à apprendre? Qui était le public cible de la Wii?

Un autre exemple: notre switch de lumière de tantôt:

correspond à:

Dans l'appli Google Home, l'on peut ajuster l'intensité d'une lumière en glissant de gauche à droite dans le bouton de celle-ci, un peu comme un gradateur de lumière (dimmer)

• Modèles conceptuels

Une explication, souvent très simplifiée, de la façon dont quelque chose fonctionne.

→ Un modèle conceptuel n’a pas besoin d’être complet ou même précis tant qu’il est utile

Modèle fonctionnel → function: intuition

On sait quoi faire sans savoir pourquoi

Modèle structurel → on connait la structure/les composantes

Modèles conceptuels sont formés à travers

• des connaissances et hypothèses préexistantes
• interaction avec l'objet
• explication

👀