Concevoir pour le web : approche UX Design et Front End

Modalités

Le programme associé à la formation doit permettre aux apprenants de placer l’expérience utilisateur au cœur de leurs projets digitaux.

 

Formation de 21 heures (3 jours)

 

Prix sur devis (Contactez-nous pour connaître les possibilités de financement)

Prérequis

  • Maîtriser l’outil informatique
  • Bonne connaissance du web en tant qu’utilisateur / Savoir naviguer sur le web
  • Culture développée en HTML-CSS
  • Avoir des notions de design Graphique
  • Connaissance minimale d’un outil de conception graphique tel qu’Adobe XD ou Sketch

Objectifs de la formation

  • Comprendre ce qu’est une « expérience », en quoi consiste le « design d’expérience » et quels en sont les bénéfices
  • Mettre en œuvre les principes du « mobile first » lors de la conception graphique d’un projet digital.
  • Appréhender le design d’interaction sur une maquette, un prototype. Savoir travailler en collaboration avec un développeur front-end

Contenu de la formation

  • Notions d’UX appliquées à la conception web (1/2 journée)
    • Détermination des personas
    • Création d’une carte d’expériences
    • Le brainstorming
    • Co-conception (DA, graphiste, web designer, développeur front-end / back-end)
  • Fondamentaux de l’ergonomie digitale (1/2 journée)
    • Principes de l’ergonomie digitale, des patterns d’ergonomie, et de leur mise en œuvre en amont de la conception
    • Fondamentaux de la conception « mobile first » de site internet ou de web app par la présentation du workflow zoning > wireframe > prototype fonctionnel > design UI > prototype
    • Auto-évaluation à l’aide des critères d’ergonomie de Bastien et Scapin et amélioration des prototypes par les tests utilisateurs
    • Atelier pratique : zoning et wireframe d’une application web
  • Du design au développement front-end (1 jour)
    • Veille technologique et conception
    • Travailler en collaboration avec un développeur front-end : design en perspective d’un framework CSS ; exporter les éléments graphiques pour l’intégration HTML/CSS ; notion de design system.
    • Atelier pratique : conception d’un storyboard pour une page animée avec la bibliothèque d’animation GreenSock
  • Ateliers de conception (1 jour)
    • Conception d’un prototype de site vitrine
    • Conception d’un prototype de site e-commerce

Demande d'inscription