Officiel
UI/UX Design pour développeurs
Par DevWorkWeb
Un développeur qui comprend les bases du design UI/UX construit des interfaces plus intuitives, même sans designer dédié. Ce cours couvre les principes visuels fondamentaux (hiérarchie, contraste, espacement), l'ergonomie des parcours utilisateur, l'accessibilité, et une introduction pratique à Figma pour collaborer avec des designers ou prototyper soi-même.
Ce que vous allez apprendre
Prérequis
Avoir des bases de développement web (HTML/CSS) pour pouvoir mettre en pratique les principes vus.
Public cible
- • Développeurs frontend souhaitant améliorer leurs interfaces sans dépendre systématiquement d'un designer
- • Développeurs travaillant en petite équipe où le rôle de designer n'est pas dédié
Programme détaillé
6 modules · 17 leçons1. UI vs UX 3 leçons
Deux disciplines complémentaires mais distinctes, souvent confondues sous le terme générique « design ».
- UI : l'interface visuelle 10 min
- UX : l'expérience globale 12 min
- Pourquoi un développeur doit s'y intéresser 10 min
2. Hiérarchie visuelle 2 leçons
Guider l'œil de l'utilisateur vers ce qui compte le plus, dans l'ordre voulu, grâce à des choix visuels délibérés.
- Taille, poids et couleur pour hiérarchiser 14 min
- L'espace blanc (whitespace) 12 min
3. Couleurs et typographie 3 leçons
Choisir une palette et une typographie cohérentes, plutôt que d'accumuler des choix arbitraires.
- Construire une palette de couleurs cohérente 14 min
- Contraste et lisibilité 12 min
- Choisir une typographie lisible 10 min
4. Parcours utilisateur 3 leçons
Concevoir le chemin qu'un utilisateur emprunte pour accomplir une tâche, avant même de penser aux couleurs ou aux polices.
- Cartographier un parcours utilisateur simple 14 min
- Réduire la friction 12 min
- Retours visuels et états de chargement 10 min
5. Accessibilité (a11y) 3 leçons
Concevoir des interfaces utilisables par tous, y compris les personnes en situation de handicap — une responsabilité partagée entre design et développement.
- Pourquoi l'accessibilité concerne tout le monde 12 min
- Les bases des WCAG 12 min
- Attributs ARIA en bref 10 min
6. Prototypage avec Figma 3 leçons
Figma est devenu l'outil standard pour concevoir et prototyper des interfaces, aussi bien pour les designers que pour les développeurs qui collaborent avec eux.
- Prise en main de l'interface Figma 12 min
- Composants et systèmes de design 14 min
- Lire une maquette Figma en tant que développeur 12 min
🎯 Projet final
Refonte UI/UX d'une interface existante
Le projet fil rouge consiste à choisir une interface déjà codée (par exemple le portfolio du cours « Développement Web ») et à la repenser en appliquant les principes de ce cours.
- Accès à vie
- Certificat inclus
- Exercices pratiques
- Mises à jour gratuites
Avis des apprenants
Aucun avis pour l'instant. Soyez le premier à donner le vôtre.