Titre RNCP 100% CPF

Design d'interfaces web & mobile

KAELIS FORMATION

3 000 €à partir de
Durée variabledurée
2sessions actives
Val-de-Marnelieu

Objectifs de la formation

• Analyser un brief client et schématiser l'interface à concevoir
• Concevoir des wireframes structurés et fonctionnels, pensés pour l'expérience utilisateur
• Réaliser des maquettes haute fidélité sur Figma en respectant les codes du design UI professionnel
• Décliner les maquettes sur desktop, tablette et smartphone et livrer un prototype interactif multi-support
• Présenter et défendre ses choix graphiques et UX devant un jury

Programme

La formation Designer UX/UI – Design d'interfaces web & mobile s'articule autour d'un projet fil rouge consistant à concevoir une interface web ou mobile complète pour un client fictif, réparti en quatre modules progressifs sur 50 heures.
Le Module 1 — Fondamentaux UX/UI (11h) pose les bases : définitions, enjeux et cycle de vie d'un projet UX/UI, ergonomie, accessibilité, intuitivité et heuristiques de Nielsen. L'apprenant apprend à décrypter un cahier des charges, mener interviews et questionnaires, construire des personas et réaliser un benchmark concurrentiel. Les fondamentaux de l'interface sont abordés (typographie, couleurs, espacement, hiérarchie visuelle) ainsi que les typologies web, mobile et application. Les outils enseignés sont Figma et Miro. Les cas pratiques incluent un benchmark critique en groupe, la rédaction d'un brief reformulé et la création des personas du projet fil rouge.
Le Module 2 — Wireframing & architecture de l'information (13h) porte sur la conception de wireframes basse et moyenne fidélité avec Balsamiq et Figma, l'analyse comparative d'interfaces concurrentes, l'élaboration d'arborescences, de flux de navigation et de zonings selon les principes d'ergonomie. Le prototypage rapide, l'A/B testing et les itérations sont également traités. Outils : Figma, Balsamiq et papier-stylo pour le design thinking. Cas pratiques : wireframe papier d'une page d'accueil en atelier chrono, wireframe numérique mobile sur Figma et production des wireframes du projet fil rouge.
Le Module 3 — Figma – Maquettage haute fidélité & design system (19h) constitue le cœur technique : maîtrise avancée de Figma (calques, styles, auto-layout, variables, composants), conception de maquettes statiques et dynamiques, élaboration d'un design system complet (brand board, couleurs, typographies), prototypage interactif (flux, transitions, animations, micro-interactions) et export des assets. Outils complémentaires : Adobe Illustrator, Photoshop, Adobe Color, Google Fonts, en s'appuyant sur Material Design et les Human Interface Guidelines. Cas pratiques : création d'un design system simplifié, landing page sous contraintes et maquettes haute fidélité desktop et mobile du projet fil rouge.
Le Module 4 — Prototypage multi-support, accessibilité & tendances (7h) clôt le parcours avec la déclinaison responsive sur desktop, tablette et smartphone, l'accessibilité numérique (WCAG, RGAA, contrastes, lisibilité), les design systems avancés, la veille tendances et la préparation au jury (structuration du dossier, argumentation, jury blanc). Outils : Figma, InVision ou ProtoPie. Cas pratiques : déclinaison responsive complète du projet fil rouge et présentation orale simulée avec feedback formateur.

Résultats attendus

À l'issue de la formation Designer UX/UI – Design d'interfaces web & mobile, l'apprenant aura acquis l'ensemble des compétences nécessaires pour concevoir, prototyper et présenter une interface web ou mobile professionnelle, conformément aux exigences du bloc RNCP37805BC04.
Sur le plan analytique et stratégique, l'apprenant sera capable de décrypter un brief client, de reformuler les besoins exprimés, de mener une recherche utilisateur structurée (interviews, questionnaires, personas) et de réaliser un benchmark concurrentiel pertinent. Il saura schématiser une interface en cohérence avec les objectifs du commanditaire et les attentes des utilisateurs finaux.
Sur le plan conceptuel, il maîtrisera la construction de wireframes basse et moyenne fidélité, l'élaboration d'une architecture de l'information claire (arborescence, flux de navigation, zoning) et l'application des principes d'ergonomie issus des heuristiques de Nielsen. Il sera en mesure de produire des prototypes rapides, de les soumettre à des tests utilisateurs et d'itérer à partir des retours obtenus.
Sur le plan technique et graphique, l'apprenant disposera d'une maîtrise avancée de Figma : auto-layout, variables, composants réutilisables, styles et bibliothèques. Il saura concevoir des maquettes haute fidélité respectant les codes professionnels du design UI, construire un design system complet (brand board, couleurs, typographies, composants) et créer des prototypes interactifs intégrant transitions, animations et micro-interactions. Il sera également capable d'optimiser et d'exporter les assets pour les équipes de développement.
Sur le plan multi-support et accessibilité, il saura décliner ses maquettes sur desktop, tablette et smartphone en respectant les principes du responsive design, et appliquer les normes d'accessibilité numérique (WCAG, RGAA) en matière de contrastes, de tailles de police et de lisibilité. Il intégrera également les standards Material Design et Human Interface Guidelines dans ses productions.
Sur le plan professionnel, l'apprenant sera préparé à présenter et défendre ses choix UX/UI devant un jury, à structurer un dossier de certification argumenté et à valoriser son travail dans un cadre client ou employeur. À l'issue du parcours, il repartira avec un portfolio composé des livrables du projet fil rouge : wireframes, maquettes haute fidélité, design system, prototype interactif multi-support et assets exportés.
L'apprenant recevra une attestation de fin de formation, un relevé de compétences et bénéficiera d'un accompagnement à la constitution de son dossier de certification RNCP37805BC04, lui permettant d'attester officiellement de sa capacité à exercer le métier de Designer UX/UI.

Les points forts

Projet fil rouge concret, maîtrise avancée de Figma, design system complet, déclinaison responsive desktop/tablette/mobile, accessibilité (WCAG/RGAA), préparation au jury et accompagnement individualisé jusqu'à la certification RNCP.

La certification

Développeur Web

RNCP 37805 RS -1 CertifInfo 115146

Organisme & lieu

Formations similaires