UI/UX Flashcards

(17 cards)

1
Q

Qu’est-ce que l’UX (User eXperience) ?

A

L’UX est l’ensemble des perceptions, émotions et réactions de l’utilisateur face à un produit.

C’est l’équivalent de l’architecture.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Qu’est-ce que l’UI (User Interface) ?

A

L’UI est l’interface visuelle et interactive du produit.

C’est l’équivalent de la décoration intérieure.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Quel est le cycle d’un produit ?

A

Research -> Structure -> Interface -> Test

  1. Research : recherche utilisateur, analyse des besoins, définition des problèmes
  2. Structure : parcours utilisateur, wireframe
  3. Interface : design visuel, couleurs
  4. Test : tests utilisateurs, analyse des frictions et incompréhension
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Qu’est-ce que la loi de Hick ?

A

Plus il y a de choix, plus on hésite.

-> réduire les options visibles, regrouper

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Qu’est ce que la loi d eFitts ?

A

Le temps pour cliquer dépend de la taille et de la distance.

-> faire des choses accessible (proche et gros)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Qu’est-ce que la loi de Miller ?

A

Le cerveau retient 7, plus ou moins 2, éléments à la fois.

-> éviter la surcharge d’informations.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Qu’est ce que le principe de Gestalt ?

A

Le cerveau regroupe les formes similaires ou proches.

-> aligner, espacer, regrouper par logique.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Quels sont les principes UI fondamentaux ?

A
  • hiérarchie visuelle : l’œil doit comprendre immédiatement ce qui est important
  • cohérence : les mêmes actions doivent se ressembler
  • simplicité : chaque écran = un objectif
  • espacement/alignement : l’espace est un outil de lisibilité
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Qu’est-ce qu’un wireframe ?

A

Un wireframe est un schéma de la structure et des fonctionnalités de l’application. Il se concentre sur la fonction, pas sur l’esthétique.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Qu’est-ce qu’un persona ?

A

Un persona est une représentation d’un utilisateur type, basée sur des données ou hypothèses réalistes.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Qu’est-ce qu’un scénario utilisateur

A

Un scénario utilisateur est une histoire qui décrit comment le persona interagit avec le produit pour atteindre un objectif.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Qu’est-ce que le design thinking ?

A

C’est une méthode pour penser comme un utilisateur avant de créer une solution.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Quelles sont les étapes du design thinking ?

A
  1. Empathize : comprendre l’utilisateur (persona, interview)
  2. Define : reformuler le problème (how might we?)
  3. Ideate : produire un maximum d’idées (crazy 8s, brainstorming)
  4. Prototype : donner forme à l’idée
  5. Test : vérifier la pertinence
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Qu’est-ce que la méthode “How might we” ?

A

On repère une frustration clé dans notre persona.

On la reformule sous la forme :
“Comment pourrions-nous [verbe d’action] afin que [objectif utilisateur] ?”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Qu’est-ce que la méthode “crazy 8s” ?

A

Il s’agit de sortir 8 idées en 8 minutes chronométrées.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Quel est l’objectif de prototyper ?

A

Cela permet de :
- valider une idée avant de coder ;
- voir si l’utilisateur comprend et agit comme prévu ;
- récolter des feedbacks concrets sur le parcours et les interactions ;
- proposer une base solide aux développeurs.

17
Q

Quels sont les étapes d’un prototypage ?

A
  1. Choisir un parcours clé (action principale).
  2. Créer 3 à 5 écrans cohérents.
  3. Ajouter les interactions essentielles (“clic”, “retour”, “confirmation”).
  4. Faire tester la navigation sans explication.