Formation UI/UX Design

Partie 1 : L’UX Design

Qu’est-ce que l’UX Design?
– Définition (UX vs UX)
– Histoire de l’UX Design
– Le principe d’affordance
– Application dans un projet
– L’importance du facteur humain
– L’utilisateur en tant qu’être humain
– La psychologie cognitive
– Les neurones miroirs
– La notion d’attention
– La prise de décision chez l’être humain

La recherche utilisateurs
– Pourquoi mener une recherche utilisateurs ?
– Préparer le terrain
– Les différents types de recherche
– Les limites de la recherche utilisateurs
– Cas pratique (mener une recherche utilisateurs)

Les personas
– Pourquoi utiliser des personas ?
– Comprendre les personas
– Les différents types de personas
– Utiliser les personas en UX Design
– Cas pratique (création de personas)

Travailler en collaboration avec les utilisateurs
– Les méthodes de collaboration
– Scrum et les méthodes agiles
– Le Design Thinking

Partie 2 : L’UI Design

Qu’est-ce que l’UI Design ?
– Définition de l’UI Design
– Le graphisme et l’UI Design
– Les différentes interfaces d’applications
– Application dans un projet

L’identité visuelle
– Qu’est-ce que l’identité visuelle ?
– Présentation d’une identité visuelle complète
– Les couleurs et leurs codes
– Les différentes familles de typographies
– Vectoriel vs Matriciel

– Les règles fondamentales du webdesign
– Introduction aux règles du webdesign
– Le responsive design
– Le positionnement et le sens de lecture avec la loi de Fitts
– La familiarité avec la loi de Jakob
– La quantité avec les lois de Miller et de Hick
– Choisir ses couleurs
– Choisir ses typographies
– Hiérarchiser ses informations
– Ergonomie et accessibilité

Utiliser un logiciel de prototypage
– Découverte de Figma
– Les différents panneaux de l’interface
– Les frames et sections
– La manipulation des calques et des groupes
– Naviguer dans l’interface de Figma
– Les grilles et repères
– Les formes géométriques simples
– L’alignement
– Contraintes et autolayout
– L’outil plume
– Afficher, masquer et combiner des formes
– Créer et styliser du texte
– Importer des fichiers
– Enregistrer des styles pour son projet
– Les plugins
– Les composants
– Démonstration de création d’une maquette (recopier de l’interface de Spotify)
– Cas pratique (recopier l’interface de Netflix)

Créer une maquette de site web
– Recherche graphique et moodboard
– Choix des couleurs et typographies
– Zoning
– Wireframe
– Réaliser un header et un menu
– Créer une bannière
– Réaliser une section de pricing
– Réaliser une section témoignages
– Prévoir la version responsive de sa maquette
– Créer d’autres pages pour la suite
– Exporter et partager sa maquette
– Cas pratique (créer la page d’une application web)

Animer sa maquette de site web
– Prototyper avec Figma
– Les variantes de composants
– Créer une navigation entre ses pages
– Présentation de quelques possibilités d’animations
– Créer un carrousel animé
– Créer un menu déroulant
– Animer sur une maquette mobile
– Cas pratique (animer sa maquette d’application web)

Ressources utiles
– L’onglet Community
– Quelques bons plugins
– Les UI kits
Conclusion générale

• Connaissance de base en Informatique
• Motivation et curiosité
• Goût pour la résolution de problème
• Capacité à apprendre par soi-même

L’aboutissement logique de cette formation est le passage de la certification bloc n°4 RNCP37805BC04 intitulé «Design d’interfaces utilisateur (UI/UX).» issu de la certification RNCP37805 Développeur WEB de notre partenaire WEBECOM;

En suivant cette formation, vous vous engagez à passer l’examen de cette certification. Il devra être passé après la formation et après vos révisions personnelles.

Dans le cadre de cette certification professionnelle inscrite au RNCP il vous sera demandé de fournir les données suivantes : 

Nom et prénom, date de naissance, lieu de naissance, coordonnées, expérience professionnelle avant et après la certification, fonction/statut, type de contrat, nom de l’entreprise, rémunération brute annuelle à 6 mois et à 1 an/2 ans.

Ces informations sont collectées afin d’éditer le parchemin de certification, d’alimenter le passeport de compétences, et pour répondre à l’obligation de l’évaluation de l’impact économique et social de la certification professionnelle

Modalités de Passage du bloc de la certification

L’évaluation est composée d’une note de contrôle continu et d’une mise en situation professionnelle sous forme d’étude de cas.

• 1. Contrôle continu

 Des évaluations formatives à visée pédagogique sont réalisées par les formateurs.

Elles sont effectuées tout au long de la formation via des exercices pratiques réalisés en autonomie par les candidats.

A L’issue du parcours de formation, le responsable de la formation renseigne pour chaque bloc de compétence une appréciation ainsi qu’un niveau d’acquisition du bloc de compétence sur une échelle de 0 à 5.

• 2. Mise en situation professionnelle sur la base d’une étude de cas

Le candidat réalise en autonomie les maquettes d’interfaces de site web ou d’application, adaptées aux différents périphériques en suivant et analysant le cahier des charges fourni. Le candidat doit être force de proposition auprès du client représenté par le correcteur de l’examen. Le candidat présente ensuite à l’oral/ en vidéo les maquettes aux jurys et argumente ses choix graphiques, ainsi que sa réflexion en termes d’interface / expérience utilisateur. • Documents attendus : – Maquettes – Liste des propositions validées par le client. – Tous supports permettant d’appuyer l’argumentation – Sources d’inspiration, – Analyse de la concurrence – Schéma de conception (wireframe) – Fichier validant les choix colorimétriques, typographiques …(Brand Board) – Prototypage des différentes interactions des éléments interactifs – Export des éléments graphiques optimisés en vue de l’intégration (assets)

L’examen se déroule sur la plateforme de Skills4all.

• 3. Modalités de validation d’un bloc

La note globale d’un bloc est pondérée de la manière suivante :

– Mise en situation: 5/8

– Contrôle continue : 3/8

Inscription à l’examen Il n’est pas nécessaire de vous inscrire à l’examen. Il est accessible dans le cours à la section “Examen de validation du bloc de compétences”.

Délais pour passage de l’examen

Le passage de l’examen  est compris dans le temps de votre formation. Il devra être passé à la date de fin de formation.

Correction de votre examen et jury de certification

Après avoir soumis vos réponses, elles seront évaluées par un correcteur.

La note obtenue vous sera communiquée au bout de 3 semaines maximum après la date de fin de la formation.

Votre résultat à cet examen est soumis à un jury de certification organisé par l’organisme certificateur.

Obtention de l’attestation de validation du bloc de compétences

L’obtention officielle de la certification vous sera notifiée par le jury de certification après l’évaluation.

L’émission de votre attestation de validation du bloc de compétences correspondant à l’examen est déclenchée suite à la décision du jury de certification. Les délais peuvent aller jusqu’à plus de 2 mois après la fin de formation à 4 mois en fonction de la tenue des jurys de certification (uniquement 4 jurys de certification par an).

L’objectif de cette formation est de vous permettre de préparer le passage de certification bloc n°4 RNCP37805BC04 intitulé «Design d’interfaces utilisateur (UI/UX).» issu de la certification RNCP37805 Développeur WEB de notre partenaire WEBECOM;

A l’issue de la formation, vous serez en mesure de :

– Maîtriser les fondamentaux de l’UI/UX design et être capable de les appliquer dans la conception d’applications
– Connaître les bases du fonctionnement psychologique de l’humain lorsqu’il navigue sur des applications
– Utiliser les outils de l’UX design pour comprendre ses utilisateurs
– Effectuer une recherche utilisateurs, faire des tests, concevoir des questionnaires
– Connaître les bases du webdesign (couleurs, typographie, alignement, hiérarchisation)
– Concevoir des interfaces orientées utilisateur
– Maîtriser les outils principaux du logiciel Figma
– Créer des prototypes d’applications grâce au logiciel Figma
– Concevoir des maquettes interactives avec le logiciel Figma

A l’issue de la formation vous serez en mesure de :

– Utiliser les notions de l’UX design pour effectuer des recherches utilisateurs
– Exploiter les résultats de ces recherches afin de créer des personas d’utilisateurs-types
– Créer des maquettes d’applications web et mobiles avec Figma
– Animer les prototypes de ces maquettes avec Figma

Formation en digital-learning, 100% en ligne, formée de vidéos, de quiz, de lectures et contenus complémentaires, d’un forum et selon les cas, de webinaires.

Skills4All est un certificateur et organisme de formation en digital learning, qui vous prépare aux certifications les plus reconnues sur le marché : PMI, AXELOS, IASSC, DevOps Institute, PEOPLECERT, GASQ, CFTL, BESTCERTIFS, dans les domaines de la cybersécurité, de l’IT, la data, l’IA, l’agilité, Scrum, Prince2, Lean Six Sigma, Gestion de projet et bien plus encore.

Avec nous, c’est quand vous voulez, où vous voulez, 24/7/365, à votre rythme.

Nous proposons des formations certifiantes, éligibles au CPF et reconnues dans le monde entier.

Skills4All est accrédité par le COFRAC (Comité Français d’Accréditation) en tant que certificateur dans le domaine de la sécurité de l’information : nos certifications sont les meilleures du marché et répondent à la norme ISO 17024, la plus exigeante aujourd’hui. Obtenir une certification Skills4All ou BestCertifs aujourd’hui c’est le gage d’une reconnaissance forte du marché qui valorisera vos compétences.