Dernière mise à jour : 9.11.2023 Exporter au format PDF Imprimer

UX/UI Design : Concevoir un site web réactif avec FIGMA

Informatique - Numérique
Continue

Fiche complète

Module qui vise l’utilisation de FIGMA pour créer un design attrayant d’un site internet et une navigation fluide et intuitive pour le visiteur.

Comment rendre un site web efficace ? Comment faire pour que ses visiteurs trouvent rapidement  l’information qu’ils recherchent et vivent une expérience agréable qui va les pousser à revenir consulter ce site web ? Le logiciel FIGMA permet de créer des sites web, des applications, des interfaces utilisateur et la collaboration d’une équipe de designers.

Objectifs

A l’issue de la formation, les participants seront capables de :

  • Comprendre et maîtriser les concepts et les outils de UX/UI Design. 
  • Appliquer chaque étape du processus de conception UX (empathie, définition, idéation,  prototype, test) pour concevoir une application réactive en utilisant FIGMA.
  • Créer des prototypes interactifs et de les modifier, en collaboration avec les autres  parties prenantes du projet. 
  •  Créer un responsive design pour différentes tailles d’écrans (Smartphone,  Tablette & Desktop) 
  • 1. Introduction à UX/UI design. 

    2. Différence entre UX & UI design 

    3. Les fonctionnalités de base de FIGMA 

    • Création d’un workflow et maquettes simples avec FIGMA
    • Manipuler les composants dans FIGMA
    • Importer des icônes dans FIGMA & les personnaliser
    • Texte et police dans FIGMA 
    • Maîtriser le dialogue entre les interfaces utilisateur

    4. Les fonctionnalités avancées  

    • Importer une police dans FIGMA
    • Comment créer sa bibliothèque de polices dans FIGMA
    • Créer ses propres icônes, boutons et composants UI 
    • Comment créer son logo dans FIGMA
    • Comment accéder à mon design à partir de l’application FIGMA mobile app (sur iPhone &  Android)
    • Comment rajouter des animations et des micro-interactions à un prototype FIGMA
    • C’est quoi un moodboard ? 
    • La théorie des couleurs
    • Comment choisir le thème de son projet et créer des palettes de couleurs harmonieuse
    • Comment insérer des images et des images de fond dans FIGMA
    • Maîtriser l’utilisation des palettes de couleurs et des polices de caractères
    • Créer sa bibliothèque de composants dans FIGMA
    • Développer un prototype interactif
    • Comment partager son projet avec le client pour avis & commentaires
    • Se familiariser avec l’export et l’import des fichiers et le partage des librairies entre les  différents membres de l’équipe
    • Maitriser le redimensionnement réactif dans FIGMA
    • Apprendre le redimensionnement réactif pour augmenter et réduire la taille des  fenêtres en toute souplesse
    • Comment créer une conception pour différents types d’écran (SMARTPHONE,  TABLETTE & DESKTOP)

    Vous mènerez un projet jusqu'au bout - en collaborant avec d'autres membres de  l'équipe et en exportant les bons fichiers prêts à être remis à votre développeur du  logiciel

Où suivre les cours ?