À partir d’un texte, je devais créer une maquette pour la marque Délices Daisy en utilisant les outils de mise en page Figma.
Compétences acquises:
Système de Design & UI (Figma) :
- Architecture de styles : Mise en place de bibliothèques de styles (couleurs, typographies, effets) pour garantir une cohérence visuelle totale.
- Design atomique : Création de composants réutilisables et gestion des variantes (états de boutons, icônes, menus) pour un workflow optimisé.
- Auto Layout et contraintes : Utilisation des fonctionnalités avancées de Figma pour concevoir des interfaces flexibles et structurées.
Recherche iconographique et configuration du plan de travail
J’ai sélectionné des visuels cohérents avec l’identité de Délices Daisy sur Pexels. Ensuite, j’ai configuré un frame au format Desktop (1440×1024) sur Figma. Cette étape permet de poser les bases d’une interface adaptée aux écrans d’ordinateurs. De plus, ce choix de format garantit une zone de travail standard pour le web.
Création graphique et opérations booléennes
J’ai conçu une forme en croissant de lune personnalisée pour enrichir le visuel. Pour ce faire, j’ai superposé deux cercles avant d’utiliser l’outil de soustraction booléenne. Grâce à cette technique, j’ai obtenu un élément graphique unique et vectoriel. Par la suite, cet élément a servi de base pour l’esthétique de la maquette.
Système de composants et styles typographiques
J’ai instauré des styles de caractères et de couleurs pour harmoniser l’interface. Ensuite, j’ai transformé les éléments récurrents, comme le menu, en composants réutilisables. En effet, cette méthode facilite grandement la maintenance et l’évolution du design. De cette manière, j’ai créé des variantes pour les différentes sections tout en conservant une unité visuelle.
Adaptabilité et exportation finale
J’ai configuré des contraintes précises sur chaque calque pour rendre la maquette responsive. Ainsi, l’interface s’adapte automatiquement aux formats tablettes et smartphones. Une fois le design finalisé, j’ai exporté le plan de travail au format JPG de haute qualité. Finalement, ce projet démontre ma capacité à créer un prototype professionnel et structuré.
