BraveCLCréer une icône d’app en calques sur Mac
Créez quatre groupes de profondeur modifiables, réglez le verre, validez les cibles activées et enregistrez un projet en calques dans Assets for Xcode.
- Le résultat
- Votre projet MyIcon enregistré contient quatre groupes modifiables nommés Orange Plate, Purple Plate, Blue Plate et Paper Plane.
- Ce qu’il vous faut
- Installez Assets for Xcode sur un Mac.
- Préparez les éléments graphiques pour quatre groupes de profondeur : une base, deux plaques colorées et un symbole au premier plan.
- Choisissez un emplacement accessible en écriture pour votre projet MyIcon modifiable.
Créez une icône d’app en calques sans aplatir votre illustration trop tôt. Ce guide reprend l’avion en papier composé de quatre groupes de profondeur, présenté dans la première capture d’Assets for Xcode sur l’App Store : ajoutez les images sources, réglez les matériaux verre, configurez les cibles d’exportation, vérifiez l’icône et enregistrez un document modifiable.
1.Commencez par les images de l’icône
Ouvrez Assets for Xcode et faites glisser votre première image source dans la fenêtre d’accueil. Vous y trouverez aussi Open Project et Create New Project ; dans cet exemple, déposez l’image de base dans la zone d’accueil pour commencer le document modifiable.
Fenêtre d’accueil d’Assets for Xcode avec les boutons Open Project et Create New Project. 2.Importez et nommez la plaque du fond
Après l’importation de la première image, sélectionnez le nouveau groupe dans Layers et nommez-le Orange Plate. L’aperçu de l’icône montre une base dégradée d’orange à rose dans son propre groupe de profondeur modifiable.
Icône modifiable avec le groupe de profondeur Orange Plate et une illustration orange et rose. 3.Ajoutez la plaque violette
Sélectionnez la racine du canevas, importez la deuxième image source comme nouveau groupe de profondeur et nommez-le Purple Plate. Purple Plate et Orange Plate restent séparés dans Layers.
Purple Plate ajouté au-dessus d’Orange Plate dans la liste Layers et l’aperçu de l’icône. 4.Superposez la plaque bleue
Sélectionnez de nouveau la racine du canevas, importez la troisième image source et nommez son groupe Blue Plate. Vérifiez dans l’aperçu que l’illustration bleue se trouve au-dessus des plaques violette et orange.
Blue Plate ajouté comme troisième groupe de profondeur modifiable, au-dessus des plaques violette et orange. 5.Terminez l’icône d’avion en papier
Importez ensemble les trois composants SVG de l’avion en papier dans un seul groupe de profondeur, nommez ce groupe Paper Plane et appelez le document MyIcon. La liste Layers comporte désormais quatre groupes modifiables séparément.
Paper Plane au-dessus de trois plaques colorées, avec quatre groupes de profondeur nommés dans MyIcon. 6.Gardez l’avion opaque
Sélectionnez Paper Plane, ouvrez l’inspecteur des matériaux et désactivez Glass dans Material (Glass). L’avion au premier plan devient une forme blanche nette et opaque plutôt qu’un verre translucide.
Inspecteur des matériaux montrant Glass désactivé pour le groupe Paper Plane sélectionné. 7.Appliquez Clear Glass au groupe bleu
Sélectionnez Blue Plate, passez dans Elevation, puis réglez Recipe sur Clear Glass dans l’inspecteur des matériaux. Vérifiez que Glass est activé et examinez la superposition des groupes en profondeur.
Aperçu Elevation de quatre groupes de profondeur de l’icône, Clear Glass activé pour Blue Plate. 8.Activez les plateformes souhaitées
Activez Apple Watch, puis ajoutez Android Adaptive Icon, Windows App Icon et Icon Composer aux cibles Apple déjà présentes. Vérifiez que la barre latérale et la bande d’aperçu affichent toutes les destinations à valider.
Liste de cibles comprenant Apple Watch, Android Adaptive Icon, Windows App Icon et Icon Composer. 9.Validez les cibles activées
Lancez la validation de l’icône et consultez la barre d’état en bas. Dans cet exemple, les états Apple ready, Android ready et Windows ready s’affichent, et toutes les tailles requises sont générées. Corrigez tout problème de cible avant d’enregistrer.
État de validation Apple ready, Android ready et Windows ready pour les cibles activées. 10.Enregistrez et examinez le projet
Revenez dans Design, sélectionnez la racine du document pour masquer les contours de sélection, puis enregistrez le projet sous MyIcon.braveicon. Le titre MyIcon, les quatre groupes nommés et l’indicateur Saved confirment l’enregistrement. L’exportation des fichiers finaux des plateformes se fait séparément.
Icône MyIcon terminée dans la vue Design, avec quatre groupes modifiables et l’état Saved.
Après la dernière étape
L’avion reste opaque, le calque bleu utilise Clear Glass et les cibles Apple, Android et Windows activées passent la validation. L’enregistrement du projet n’exporte pas les fichiers finaux des plateformes.
Conseils
Conservez chaque plaque dans son propre groupe sous Layers pour la modifier sans aplatir le dessin.
Utilisez Elevation pour contrôler l’ordre des profondeurs avant de choisir une recette de verre.
Consultez l’état de validation de chaque cible activée avant d’enregistrer le document d’icône.
AttentionCe guide enregistre le projet d’icône modifiable ; il n’exporte ni AppIcon.appiconset ni les autres fichiers finaux des plateformes.
AttentionSi une cible n’est pas prête après la validation, corrigez le problème avant d’exporter.
