Création d'un Welcome Screen avec Figma

Création des layers et de l'écrans Welcome
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Atelier Figma - Design d'application
Revoir le teaser Je m'abonne
4,5
Transcription

159,00€ 79,50€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
4,5
159,00€ 79,50€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

À la fin de cette vidéo, vous serez capable de :

  • Créer un Welcome Screen professionnel pour une application
  • Utiliser et gérer les frames et calques dans Figma
  • Appliquer des composants et symboles réutilisables
  • Aligner et organiser correctement les éléments graphiques

Découvrez comment créer un Welcome Screen pour l'application RainAlert en utilisant Figma.

Dans cette leçon, vous apprendrez à concevoir le Welcome Screen pour l'application RainAlert en utilisant Figma. Nous verrons comment :

  • Créer une nouvelle frame correspondant à un iPhone 11 Pro
  • Importer et intégrer des éléments dans cette frame
  • Organiser et renommer les calques pour une meilleure gestion
  • Créer et utiliser des composants (ou symboles) pour standardiser les éléments réutilisables
  • Gérer les alignements, les textes et les couleurs
  • Utiliser des repères et des grilles pour une mise en page précise

Nous explorerons les fonctionnalités de Figma pour s'assurer que chaque élément est parfaitement placé et que les composants peuvent être modifiés globalement de manière efficace.

Voir plus
Questions réponses
Quels sont les éléments principaux du Welcome Screen dans cette leçon ?
Les éléments principaux du Welcome Screen sont un texte, un logo et une image d'arrière-plan.
Pourquoi est-il important de renommer les calques dans Figma ?
Renommer les calques régulièrement aide à s'organiser et à éviter de se perdre parmi les différents éléments.
Comment peut-on vérifier qu'une image est bien intégrée à une frame dans Figma ?
Pour vérifier qu'une image est bien intégrée à une frame, il faut s'assurer qu'elle apparaît en dessous du calque de la frame dans la liste des calques.

Programme détaillé

8 commentaires
4,5
8 votes
5
4
3
2
1
pa12
Il y a 1 year
Je viens de débuter la formation mais quel dommage de ne pas avoir le fichier de travail avec... Une grosse perte de temps pour les images, les icones...etc. Pouvez-vous svp ajouter ce fichier à télécharger?
jc.mosca
Il y a 1 year
Comme dit plus haut, mise à part les centaines de "du coup" et "en fait" plutôt agaçants, c'est comme d'habitude chez Elephorm une formation enrichissante. J'ai mis seulement 4 étoiles car il manque la démonstration des overlays, des contraintes, des listes à puces et pas mal d'autres. Ce serait bien qu'Elephorm fasse des mises à jour de ses formations.
ousmane.ndia
Il y a 1 year
Bien pour apprendre les bases, mais manque les nouveautés de 2022.
nicolas.dessis
Il y a 2 years
Merci !
pioupiou06
Il y a 2 years
Super formation ! très bien expliquée !
pulpozien
Il y a 2 years
Très bonne formation.
Trop de "du coup" et du coup ça agace mais sinon super
maellechancerelle
Il y a 3 years
Super formation!!
stephanehugon
Il y a 3 years
Cette formation est vraiment au top ! Je ne connaissais rien de Figma (étant "seulement" développeur à la base) et j'ai appris beaucoup de choses, je recommande donc cette formation; le formateur est très sympathique et professionnel dans sa pédagogie, c'est très agréable à suivre. Je recommande par contre d'avoir au moins deux écrans (voir trois) pour suivre la vidéo et pratiquer/prendre des notes en même temps.

Seul bémol par contre, pitié Elephorm, mettez les fichiers de travail avec la formation... (Ce n'est pas la seule sur laquelle il manque les fichiers d'ailleurs); mais mettez-les, ça évite d'aller chercher à droite et à gauche des SVG que l'on doit convertir, des images, etc...

A part ça, super formation !