Dans ce bundle complet de plus de 5h20 de vidéo, je vous propose de découvrir ensemble le WebDesign sur le logiciel Figma.
Cette formation en ligne est avant tout pour les débutants, c’est-à-dire ceux qui ne connaissent pas ou peu le webdesign et qui n'ont pas encore ouvert de logiciel tel que Figma auparavant.
Nous prendrons en exemple un site vitrine pour une entreprise qui propose de recharger sa voiture électrique gratuitement.
Au programme de cette formation WebDesign Débutant sur Figma
- Épisode 1 : On découvrira ensemble le brief, puis on fera un tour d’horizon rapide du logiciel avant de commencer à créer la Homepage du site. On utilisera un système de grille, des dégradés, des icônes SVG, l’auto-layout, aérer le contenu pour améliorer la lisibilité...
- Épisode 2 : Puis nous allons désigner des mises en pages dynamiques pour présenter le contenu des différentes pages du site : Histoire, Services, Contact... et nous verrons comment utiliser les composants, créer un menu sticky et enfin mettre en place un prototype animé pour naviguer dans le site comme si celui-ci était déjà intégré.
- Épisode 3 : Dans cette dernière étape, nous adapterons les maquettes précédemment créées pour une version mobile. Je vous donnerai plein de tips pour adapter le menu, ou choisir une mise en page adaptée en raison de la place limitée sur un navigateur mobile.
Je vous invite à regarder l’extrait vidéo pour vous rendre compte du résultat final obtenu à la fin de la formation.
Toutes les sources sont fournies avec la formation.
N'hésitez pas à me soumettre des questions dans le salon d'entraide si vous rencontrez des difficultés pendant ou après le visionnage de la formation.
Bonne formation !
Tuto composant ce bundle :
Webdesign débutants : Designer une page d'accueil sobre & attractive sur Figma (voir la fiche produit)
- Introduction & Installation de Figma gratuit00:05:39
- Découverte de l'interface de Figma 00:09:49
- Lecture du Brief client, conseils & astuces sur le webdesign 00:13:55
- Mise en place de la grille & design du header avec le logo et le menu 00:16:27
- Designer le visuel d'accroche avec un bouton call to action 00:13:46
- Designer la partie des avantages en 3 colonnes 00:20:40
- Designer le bandeau vidéo 00:11:56
- Designer le footer pour terminer la maquette 00:14:29
- Conclusion 00:02:08
Webdesign débutants - Episode 2 : Déclinaison des pages & Prototype animé (voir la fiche produit)
- Créer des composants pour le header & footer à partir de la page d'accueil gratuit00:11:33
- Design de la page Histoire - Partie 1 00:14:03
- Design de la page Histoire - Partie 2 00:20:36
- Design de la page Offre - Partie 1 00:16:43
- Design de la page Offre - Partie 2 00:23:56
- Design de la page Contact 00:23:17
- Design de la page Mentions légales 00:10:55
- Design de la Connexion à l'espace client 00:14:47
Webdesign débutants - Episode 3 : Décliner les maquettes du site en version mobile + Prototype (voir la fiche produit)
- Introduction gratuit00:01:28
- Créer une frame pour le mobile et visualiser le prototype 00:03:24
- Adapter le header en version mobile 00:05:34
- Homepage - Adapter le hero en version mobile 00:11:04
- Homepage - Adapter le reste du contenu 00:09:33
- Adapter le footer en version mobile 00:11:29
- Créer le menu en version mobile 00:06:27
- Page - Adapter le contenu part.1 00:13:48
- Page - Adapter le contenu part.2 00:09:27
- Conclusion 00:02:59
Formateur : Adrien Gazaix
-
Quel est le niveau requis pour suivre ce tuto ?débutant
