La formation “Les fondamentaux du webdesign”, nommée en abrégé "FWD", permet à toute personne ayant les prérequis attendus de définir le webdesign dans tous ces aspects : écosystème, métiers, compétences et d'expliquer ses stratégies annexes telles que, la conception d'un projet web, l'UX-design, le maquettage, le Responsive Design.
Cette formation à pour objectif d'informer, présenter, introduire les notions fondamentales du webdesign afin d'acquérir une base de connaissances solide. Elle vient en préambule aux autres formations déployées pour la validation du Titre Pro "Designer Web".
Programme de la formation
La formation “Les fondamentaux du webdesign” est découpée en 6 modules de 6 séquences de 8 heures chacunes.
L'ordre dans lequel le programme des séquences est abordé peut varier légèrement d'une session à l'autre.
Module 1 → 8 heures (1 journée)
Découvrir l'écosystème, les métiers, les compétences, le HTML/CSS/JS, les outils du webdesign.
- Séquence 1-m1 → 4 heures (1 demi‑journée)
- Définir le webdesign, ses métiers, les compétences nécessaires et ses outils.
- Séance 1-s1m1
- Définir ce qu'est le webdesign
- Lister les métiers qui gravitent autour du webdesign
→ 2 heures - Séance 2-s1m1
- Lister avec précision les logiciels et outils du designer web
- Définir les stratégies annexes aux webdesign
→ 2 heures
- Séance 1-s1m1
- Séquence 2-m1 → 4 heures (1 demi‑journée)
- Réaliser une première mise en page web.
- Séance 1-s2m1
- Expliquer la structure HTML/CSS d'une page web
- Répondre à un quizz interactif et collaboratif
→ 2 heures - Séance 2-s2m1
- Réaliser en HTML/CSS et manuellement une mise en page web simple
→ 2 heures
- Séance 1-s2m1
Module 2 → 8 heures (1 journée)
Définir les étapes de la conception d'un projet web.
- Séquence 1-m2 → 4 heures (1 demi‑journée)
- Définir les étapes de la conception d'un site web - partie-1.
- Séance 1-s1m2
- Lister les définitions d'un projet web
- Identifier les documents de référence
→ 2 heures - Séance 2-s1m2
- Définir ce qu'est la stratégie de contenu
- Expliquer les profils utilisateurs
→ 2 heures
- Séance 1-s1m2
- Séquence 2-m2 → 4 heures (1 demi‑journée)
- Définir les étapes de la conception d'un site web - partie-2.
- Séance 1-s2m2
- Spécifier ce qu'est un audit des contenus
- Définir la hiérarchie du contenu
- Définir l'architecture de l'information
→ 3 heures - Séance 2-s2m2
- Expliquer l'importance du prototypage
- Répondre à un quizz interactif et collaboratif
→ 1 heure
- Séance 1-s2m2
Module 3 → 8 heures (1 journée)
Réaliser les maquettes d'un projet web - partie-1.
- Séquence 1-m3 → 4 heures (1 demi‑journée)
- Définir les techniques possibles de maquettage.
- Séance 1-s1m3
- Expliquer les compositions de calque avec Adobe Photoshop
- Expliquer les plans de travail avec Adobe Photoshop
- Étudier le projet de maquettage et son cahier des charges
→ 4 heures
- Séance 1-s1m3
- Séquence 2-m3 → 4 heures (1 demi‑journée)
- Réaliser 7 maquettes d'un projet web - partie-1.
- Séance 1-s2m3
- Utiliser Adobe Photoshop et réaliser des maquettes pour le web (1/3)
→ 4 heures
- Séance 1-s2m3
Module 4 → 8 heures (1 journée)
Réaliser les maquettes d'un projet web partie-2.
- Séquence 1-m4 → 4 heures (1 demi‑journée)
- Réaliser 7 maquettes d'un projet web partie-2.
- Séance 1-s1m4
- Utiliser Adobe Photoshop et réaliser des maquettes pour le web (2/3)
→ 4 heures
- Séance 1-s1m4
- Séquence 2-m4 → 4 heures (1 demi‑journée)
- Réaliser 7 maquettes d'un projet web - partie-3.
- Séance 1-s2m4
- Utiliser Adobe Photoshop et réaliser des maquettes pour le web (3/3)
→ 3 heures - Séance 2-s2m4
- Exporter les maquettes dans tous les formats existants
→ 1 heures
- Séance 1-s2m4
Module 5 → 8 heures (1 journée)
Réaliser une mise en page Responsive design simple.
- Séquence 1-m5 → 4 heures (1 demi‑journée)
- Définir le Responsive Design.
- Séance 1-s1m5
- Lister les contraintes et avantages du Responsive Design
- Définir le processus CSS des alertes médias
- Explorer des sites web Responsive Design
→ 4 heures
- Séance 1-s1m5
- Séquence 2-m5 → 4 heures (1 demi‑journée)
- Réaliser une page web simple Responsive Design.
- Séance 1-s2m5
- Utiliser Adobe Brackets et coder une page web Responsive Design
- Répondre à un quizz interactif et collaboratif
→ 4 heures
- Séance 1-s2m5
Module 6 → 8 heures (1 journée)
Définir les fondamentaux de l'UX-design.
- Séquence 1-m6 → 4 heures (1 demi‑journée)
- Définir les notions principales de l'UX - partie-1.
- Séance 1-s1m6
- Identifier les principes de l'UX-design
- Différencier l'UX de l'UI
- Définir l'usabilité
→ 2 heures - Séance 2-s1m6
- Définir le taux de rétention
- Expliquer le "Hook Canvas"
- Définir l'importance de l'expérience utilisateur
→ 2 heures
- Séance 1-s1m6
- Séquence 2-m6 → 4 heures (1 demi‑journée)
- Définir les notions principales de l'UX - partie-2.
- Séance 1-s2m6
- Concevoir un produit simple
- Créer (designer) pour l'utilisateur mobile
- Définir un persona
- Expliquer le concept d'affordance
→ 2 heures - Séance 2-s2m6
- Identifier les principe du Design Thinking
- Définir une séance de test
- Répondre à un quizz interactif et collaboratif
→ 2 heures
- Séance 1-s2m6
.
Titre Pro Designer Web
Les compétences acquises et validées au cours de la formation “Les fondamentaux du webdesign” s'inscrivent dans le programme de la préparation à la validation du Titre Professionnel Designer Web.
Les compétences acquises au cours de la formation “Les fondamentaux du webdesign” permettent d'envisager la validation d'une partie seulement des compétences visées pour le titre. Pour envisager la validation de toutes les compétences du Titre Pro Designer Web, d'autres formations doivent nécessairement compléter la formation “Les fondamentaux du webdesign”.
▶ Public concerné • Formation “Les fondamentaux du webdesign”
La formation “Les fondamentaux du webdesign” s'adresse à toute personne souhaitant :
- acquérir les compétences fondamentales pour se préparer au métier de Designer-web, d'en comprendre les stratégies et techniques et possédant toutes les compétences requises en informatique (voir plus bas) ;
- préparer la validation de la compétence professionnelle suivantes :
- CP1 intitulée “Concevoir un site ou une application Web”.
- CP3 intitulée “Réaliser des maquettes et des interfaces”.
- CP5 intitulée “Intégrer des pages Web en tenant compte des standards, du référencement, de l'accessibilité et de l'ergonomie”.
Ces compétences font partie des 1e et 2e CCP du Titre Professionnel “Designer Web”
▶ Prérequis • Formation “Les fondamentaux du webdesign”
Être capable d'utiliser avec assurance une version récente d'un des systèmes informatiques suivants : Windows, Linux ou MacOSX.
Être capable d'utiliser un navigateur web .
▶ Outils utilisés • Formation “Les fondamentaux du webdesign”
- Un éditeur de code en local (Adobe Brackets) ou en ligne (Repl.it)
- Un navigateur Web (Chrome ou Firefox)
- Adobe Photoshop
▶ Durée et lieu de formation • Formation “Les fondamentaux du webdesign”
6 séances d'une journée (6x8 heures), au Pôle Plurimédia du lycée La Fayette, à Clermont‑Ferrand, 21 boulevard Robert Schuman.
Objectifs • Formation “Les fondamentaux du webdesign”
| 2 objectifs généraux | Registres de savoir |
|---|---|
| Définir le webdesign et ses stratégies | Savoir faire |
| Réaliser une première mise en page HTML/CSS simple et responsive | Savoir faire |
À la fin de la formation “Les fondamentaux du webdesign”,
l'apprenant sera donc capable de :
Évaluation des acquis • Formation “Les fondamentaux du webdesign”
Une évaluation des acquis en cours de formation s'effectue de manière formative, permettant une remédiation individualisée quand cela est nécessaire.
Des travaux pratiques permettent à chaque apprenant, au cours de chaque module, de se situer par rapport à des critères d'exigence communiqués à tous.