Créez des interfaces que l'on comprend au premier coup d'œil.

Qu'est-ce que l'UI design ?

UI signifie « user interface », l'interface utilisateur : tout ce qu'une personne voit et touche pour utiliser un produit. Un designer UI décide de la disposition de chaque écran, du texte le plus grand, de l'apparence d'un bouton et de sa réaction quand on appuie dessus.

Une bonne UI est presque invisible. Les gens ne remarquent ni la grille ni l'échelle typographique. Ils remarquent qu'ils ont trouvé le bouton, lu le prix et terminé leur tâche sans y penser.

Chaque composant a des états

Les débutants dessinent un bouton une fois. Les professionnels conçoivent chacun de ses états. Les utilisateurs doivent savoir ce qui peut être pressé, ce qu'ils viennent de presser et ce qui n'est pas disponible pour l'instant. Chaque état est une promesse que vous leur faites.

Les briques de base de l'UI

Le cours consacre une unité à chacune d'elles, avec des exercices et un vrai écran à concevoir.

• Typographie : choisir et associer des polices, construire une échelle typographique, régler des longueurs de ligne lisibles.
• Couleur : palettes, signification et contraste conforme aux exigences d'accessibilité.
• Mise en page : grilles, systèmes d'espacement et hiérarchie qui fonctionnent du téléphone à l'ordinateur.
• Composants : boutons, champs, cartes et menus, avec tous leurs états.
• Design systems : des tokens et des bibliothèques pour qu'une équipe entière conçoive de façon cohérente.
• Accessibilité : des designs qui fonctionnent pour les personnes malvoyantes, daltoniennes ou qui naviguent au clavier.

Apprendre en observant les meilleurs

Les Human Interface Guidelines d'Apple et Material Design de Google sont gratuits, détaillés et rédigés par des équipes qui conçoivent pour des milliards de personnes. Vous en lirez des extraits, puis vous utiliserez l'auto layout et les composants de Figma pour construire vos propres écrans dans les règles de l'art.

Les outils d'IA peuvent désormais ébaucher un écran en quelques secondes. Le savoir-faire UI n'en a que plus de valeur : il faut voir pourquoi une ébauche sonne faux et la corriger. La hiérarchie est-elle claire ? Le texte a-t-il assez de contraste ? Les coins sont-ils cohérents ? Ce sont les questions que vous apprendrez à poser.