Webdesign - Initiation

Cette formation au webdesign vous permet d’acquérir la méthodologie de réalisation d’une maquette graphique de site web en respectant les contraintes techniques et de diffusion de l’information sur le web, y compris en responsive design. Vous saurez faire une proposition graphique à votre client et collaborer efficacement avec un développeur ou un webmaster.

Présentiel / Distanciel
5 jours - 35 heures
Max. 8 pers
Session à Paris
Prochaines sessions
Du 02/12/2024 au 06/12/2024
Du 27/01/2025 au 31/01/2025
Du 07/04/2025 au 11/04/2025
Du 07/07/2025 au 11/07/2025
Du 22/09/2025 au 26/09/2025
Du 03/11/2025 au 07/11/2025
Tarif : 1 900 € HT

Objectifs

Maîtriser dans sa globalité le processus de conception design d’un site web à destination de tous les supports. Au cours de la formation webdesign les notions apprises sont mises en pratique et les stagiaires réalisent une maquette graphique.

Taux de satisfaction pour l'année 2023 : 4/5 ⭐

Programme

Découverte du webdesign

  • Découverte du Webdesign
  • Les métiers du Webdesign et ses différences avec le Print
  • Comment fonctionne le Web
  • Comment est construit un site ou une application et comment les mettre en ligne
  • Comprendre une URL
  • En parallèle du Design

UX Design : Présentation

  • L’expérience utilisateur
  • Le rôle de l’UX Designer

UX Design : Architecture de l’information

  • Définition
  • Travailler avec des grilles
  • Les blocs qui constituent un site ou une application
  • Les différents types de pages d’un site Web
  • Les différents éléments d’interface
  • Les bons sens de lecture
  • La zone de flottaison
  • La hiérarchie textuelle
  • Réussir ses formulaires

UX Design : Le facteur humain

  • Définition
  • Le cerveau comme micro-processeur
  • 6 lois liées à la théorie de la forme (Gestalt)
  • Les neurones miroirs
  • Les interférences
  • Les limites cognitives
  • Les 4 moteurs de séduction

UX Design : Figma

  • Ouvrir, importer, enregistrer, exporter, partager et fermer un document
  • L’onglet Design et l’onglet Prototype
  • La barre d’outils
  • Le panneau des actifs
  • Le panneau des plans de travail
  • Les plans de travail
  • Les repères Les grilles
  • Les outils de dessin
  • Le texte La fluidité responsive
  • Les colonnes
  • Les actifs
  • Les composants
  • Le prototype
  • L’animation
  • Responsiver sa conception

UX Design : Les 7 étapes clés

  • La stratégie (vision du projet)
  • Les personas
  • La taxonomie
  • L’user flow
  • Le croquis
  • Le wireframe / prototype
  • Le test utilisateur
  • L’anticipation

UX Design : Les principes de conception

  • Le feedback (retour système)
  • L’affordance
  • Le mapping
  • Le guidage
  • La découverte progressive
  • L’homogénéité
  • L’anticipation de l’erreur
  • La narration (le storytelling)

UI Design : Architecture d’interface

  • Qu’est-ce que le Design d’interface
  • Quel est le rôle du Designer d’interface
  • Pourquoi la qualité graphique doit être au rendez-vous
  • Les grandes tendances
  • Le Skeuomorphisme
  • Le Flat Design
  • Les devices et les checkpoints
  • Le responsive

UI Design : Typographie

  • Définition
  • Les différents formats
  • Différence entre police et fonte
  • Les 5 familles typographiques
  • Les polices à éviter
  • Les balises H
  • Jouer avec les formes et les familles
  • L’usage des textes
  • Les sites indispensables

UI Design : Colorimétrie

  • Définition
  • Le bon choix de couleurs
  • Le bon vocabulaire
  • La règle des 60-30-10
  • Adobe Color
  • Les différentes combinaisons
  • L’importance du contraste
  • L’exploitation des couleurs
  • Définition de toutes les couleurs

UI Design : Iconographie

  • Définition
  • Dénotation & connotation
  • Le réalisme
  • La géométrie
  • Les signes
  • Toucher au plus juste
  • Hiérarchie des composants visuels
  • Comment choisir la bonne image
  • La règle de tiers
  • Le nombre d’or
  • Les bons outils
  • Où faire sa veille graphique

Travaux pratiques

  • Conceptions sur Figma
  • Wireframe d’une Newsletter
  • Maquette d’une application
  • Wireframe & Maquette d’une landing page

Pré-requis

Connaitre l’environnement web et être à l’aise avec le travail sur logiciels.

Modalités d'inscription

L’admission du candidat se fait sur la base :

  • D’un questionnaire préalable dans lequel le candidat détaille ses compétences, ses acquis, ses formations et études et son objectif professionnel 
  • D’un entretien (téléphonique ou face à face, selon les cas) avec le responsable des formations, de la pédagogie et de la coordination des programmes afin de valider l’admission et répondre aux questions du candidat

Méthode pédagogique

Formation présentielle et/ou distancielle durant laquelle seront alternés explications théoriques et exercices pratiques.

Matériel pédagogique

Un ordinateur Mac ou PC par personne. Support de cours fourni.

Modalités d'évaluation

Evaluation en fin de parcours type QCM ou questions ouvertes. Exercices pratiques.

Public

Graphiste ou toute personne souhaitant réaliser des maquettes pour le web et les mobiles. Webdesigner et intégrateur souhaitant maîtriser les étapes de conception graphique.

Accessibilité

Nos formations sont accessibles aux personnes en situation de handicap. Les aspects, l’accessibilité et le type de handicap au regard des modalités d’accompagnement pédagogiques sont à évoquer impérativement au cours de l’entretien préalable à toute contractualisation afin de pouvoir orienter ou accompagner au mieux les personnes en situation de handicap.

Mise à jour le 9 octobre 2024

Formation
en intra et sur-mesure

EN SAVOIR PLUS

Financement

Les nombreux dispositifs de financement existant peuvent financer votre formation. Nous vous accompagnons pour monter votre dossier auprès des financeurs.

Découvrez les financements
Présentiel / Distanciel
5 jours - 35 heures
Max. 8 pers
Session à Paris
Prochaines sessions
Du 02/12/2024 au 06/12/2024
Du 27/01/2025 au 31/01/2025
Du 07/04/2025 au 11/04/2025
Du 07/07/2025 au 11/07/2025
Du 22/09/2025 au 26/09/2025
Du 03/11/2025 au 07/11/2025
Tarif : 1 900 € HT
Aller au contenu principal