Installation de Figma
Découverte de l'interface
Refonte de l'application météo "Rain Today"
Prototypage de l'app
Pour aller plus loin / Bonus
Détails de la leçon
Description de la leçon
Cette leçon se concentre sur la création et l'utilisation d'une grille de mise en page pour le design d'un écran clé de l'application. Nous commencerons par créer une frame, puis nous ajouterons une layout grid pour faciliter l'alignement des éléments. La grille par défaut sera remplacée par des colonnes et des gouttières pour une précision accrue. Nous ajusterons ensuite le nombre de colonnes pour correspondre au design souhaité.
En général, une grille de huit colonnes est utilisée pour les applications mobiles. Cependant, pour correspondre à notre modèle spécifique, nous utiliserons une grille de onze colonnes. Vous découvrirez également comment activer ou désactiver la grille sans modifier les paramètres, permettant ainsi de démarrer et d'ajuster librement vos éléments de design.
Objectifs de cette leçon
Les objectifs de cette vidéo sont de :
- Comprendre l'importance d'une grille de mise en page dans le design d'interface.
- Apprendre à créer et ajuster une frame avec une layout grid.
- Découvrir comment adapter une grille en fonction des besoins spécifiques d'un projet.
Prérequis pour cette leçon
Les prérequis pour cette vidéo incluent :
- Une connaissance de base des outils de design d'interface.
- Des notions de design d'interface utilisateur (UI).
Métiers concernés
Les applications professionnelles de cette vidéo concernent :
- Les designer UI/UX travaillant sur des projets d'applications mobiles.
- Les développeurs front-end cherchant à améliorer leurs compétences en design d'interface.
Alternatives et ressources
Les alternatives pour les grilles de mise en page incluent :
- Utilisation d'autres outils comme Sketch ou Adobe XD.
- Recours à des frameworks CSS comme Bootstrap pour des grilles prédéfinies.
Questions & Réponses
Je m'abonne