Créer un Sprite pour Unity avec Inkscape
La mise à jour 4.3 de Unity a marqué un tournant majeur pour les développeurs de jeux 2D, en introduisant de nombreux outils et approches pour le développement de jeux en 2D dans ce moteur déjà puissant. Il est essentiel de créer autant de pièces complètes que possible pour vos sprites, car les développeurs demanderont fréquemment des changements de couleur et des variations. Il est également conseillé de tester vos personnages en les plaçant sur les arrière-plans que vous utilisez pendant le développement, tout en gardant à l'esprit votre "budget" de sprites.
Étape 1 : Préparation et Esquisse dans Inkscape
Pour commencer, ouvrez Inkscape et sélectionnez Fichier > Nouveau. Choisissez une taille de document qui correspond le plus probablement à la résolution de votre jeu. Si vous travaillez avec un développeur, assurez-vous de connaître la résolution appropriée.
Créez un nouveau calque en sélectionnant Calque > Ajouter un calque (Maj+Ctrl+N) et nommez-le "Sketch". C'est sur ce calque que vous rassemblerez vos concepts. Vous pouvez importer une esquisse créée dans un autre logiciel, comme Sketchbook Pro. Si vous faites glisser le fichier, sélectionnez "Intégrer" plutôt que "Lien".
Pour une gestion plus aisée des couleurs, vous pouvez personnaliser la palette de couleurs d'Inkscape. Ouvrez le fichier "Inkscape.gpl" avec un éditeur de texte. Vous pouvez y ajouter vos propres valeurs RVB et hexadécimales ; elles apparaîtront dans l'ordre où vous les avez saisies. Assurez-vous d'ajouter les codes tels qu'ils sont affichés dans le fichier.
Étape 2 : Création du Sprite Principal
Commencez par dessiner le corps principal du personnage. Par exemple, pour un poulpe, utilisez une forme de cercle simple pour le corps.
Pour ajouter de la profondeur, vous pouvez créer les membres en plusieurs pièces. Par exemple, pour les pattes avant d'un poulpe, créez une première forme, puis ajoutez une deuxième forme ovale et faites-la pivoter pour obtenir la position désirée. Il est possible de rendre les pattes avant en plusieurs morceaux pour plus de détails.
Une fois le corps et les membres principaux créés, ajoutez des ombres et des rehauts pour donner du volume. Pour cela, vous pouvez copier et coller une forme existante, ajuster sa taille et sa position pour créer une zone d'ombre ou de lumière, puis lui donner une couleur différente pour la distinguer. Une forme de cercle peut être utilisée pour créer un rehaut lisse.
N'oubliez pas d'ajouter des rehauts sur les membres également. Utilisez l'outil Bézier (Maj+F6) pour dessiner ces détails. Assurez-vous de dessiner sur le calque approprié pour chaque tentacule et de les regrouper avec leur pièce correspondante une fois terminés.
Pour les yeux, l'outil Cercle (F5) est idéal. Vous pouvez ajouter des rehauts supplémentaires pour accentuer la profondeur.
Ajout d'éléments secondaires : L'exemple de l'escargot
Pour ajouter un point d'intérêt, comme un escargot sur la tête du poulpe, créez le corps de l'escargot en utilisant l'outil Courbe de Bézier (Maj+F6). Créez l'escargot sur un nouveau calque, mais vous n'avez pas besoin de créer un calque séparé pour la coquille tant que les éléments sont correctement regroupés.
Utilisez le mode Édition des nœuds de chemin (F2) pour supprimer les nœuds inutiles et lisser le corps de l'escargot. Ajoutez ensuite des teintes plus claires pour accentuer le volume de l'escargot. Assurez-vous de regrouper les objets du corps une fois terminé, car les courbes irrégulières ne sont pas souhaitables.
Pour la base de la coquille, dessinez un cercle avec l'outil Cercle (F5). Faites ensuite pivoter et positionnez la spirale pour qu'elle ressemble à une vraie coquille. Pour le rehaut de la coquille, utilisez à nouveau la courbe de Bézier. Utilisez du blanc pour la couleur, mais réglez l'opacité à 50% pour qu'il se mélange bien. Continuez avec les autres rehauts. Il est important de noter que la coquille et le corps de l'escargot ont été créés en tant que groupes séparés.
Étape 3 : Organisation et Préparation pour l'Exportation
Une fois le dessin principal terminé, supprimez le calque "Sketch" pour qu'il ne gêne pas. Assurez-vous de déverrouiller le calque avant de tenter de le supprimer, sinon vous ne pourrez pas le faire. Vous pouvez également supprimer le calque via le menu Calque.
Sauvegardez votre fichier avant de passer à l'étape suivante, et il est conseillé de sauvegarder fréquemment tout au long du processus.
Il est maintenant nécessaire de séparer les différentes parties du personnage de manière à ce qu'elles soient suffisamment éloignées pour que l'outil de découpage dans Unity puisse les reconnaître comme des éléments distincts. C'est un bon test de vos compétences en matière de regroupement. Si vous avez correctement regroupé tous les éléments, cette étape devrait être relativement simple. Des tutoriels sur le regroupement dans Inkscape peuvent être utiles.
Alignez les bords des objets à l'extérieur de la feuille. Bien que les ordinateurs actuels soient rapides, il est toujours préférable de réduire l'espace blanc autant que possible et de rendre la feuille aussi petite que possible. L'alignement n'a pas besoin d'être parfait ; l'objectif est de réduire l'espace blanc superflu.
Tassez la feuille autant que possible. Vous remarquerez peut-être que les yeux semblent inutilement éloignés pour l'empaquetage de textures. Cela est dû au fait qu'ils ont été traités comme un seul objet plutôt que de fonctionner indépendamment.
pelican sprite tutorial spaceship
Étape 4 : Exportation de la Feuille de Sprites
Pour exporter votre feuille de sprites, sélectionnez Fichier > Exporter (Maj+Ctrl+E). Vous pouvez modifier le nom du fichier dans la boîte de nom de fichier pour qu'il soit reconnaissable. Sinon, il sera nommé par Inkscape d'après le dernier chemin ou groupe sélectionné.
Vous remarquerez peut-être l'option "Exporter par lots les objets". Note : Il existe actuellement un bug dans Inkscape concernant cette fonctionnalité.
Étape 5 : Importation et Configuration dans Unity
Pour cette partie, nous supposons que vous savez comment ouvrir Unity et démarrer un projet.
Importez votre feuille de sprites dans le dossier d'assets de votre projet Unity. Sélectionnez l'image importée dans la fenêtre du projet, et dans l'Inspecteur, modifiez le Mode Sprite sur "Multiple". Le format "Truecolor" est un bon choix pour obtenir des images nettes, surtout pour les sprites en pixel art.
Cliquez sur le bouton "Slice". Vous devriez voir apparaître des boîtes englobantes autour de vos différents éléments de sprite. Si vous rencontrez des problèmes, comme une découpe incorrecte, vous devrez peut-être supprimer une boîte englobante et la recréer manuellement. Pour corriger cela, cliquez sur l'une des boîtes englobantes et supprimez-la.
Vous remarquerez également une zone en bas à droite où vous pouvez nommer chaque pièce. C'est très important pour l'organisation, car lorsque vous ferez glisser des sprites sur la scène, ils seront automatiquement nommés selon le nom indiqué dans cette boîte.
Un autre paramètre que vous pouvez ajuster est le Pivot, qui indique le point d'ancrage principal du sprite. Par exemple, le pivot d'un bras devrait être à l'épaule pour une rotation correcte.
Maintenant, vous pouvez faire glisser les pièces découpées sur la scène pour créer des objets de jeu.
Ajustement de l'ordre et des Pivots
Comme vous l'avez peut-être remarqué, les tentacules du poulpe ne sont pas dans l'ordre souhaité. Vous pouvez corriger cela en utilisant les Calques de Tri (Sorting Layers) dans l'Inspecteur. Cela permet de contrôler l'ordre de rendu des sprites.
Regroupez les objets et assignez des points de pivot dans de meilleures positions. Par exemple, faire pivoter un bras à son centre n'a pas de sens ; déplacez le pivot à l'épaule pour qu'il tourne correctement. Faites des groupes logiques. Regroupez les objets de la chaussure et définissez le pivot à la cheville.
Sauvegardez une scène de test et le projet (Fichier > Enregistrer la scène).
Ce personnage n'a pas encore d'animations, il n'est donc pas encore "prêt pour le jeu". Il est bénéfique pour les artistes de savoir à quoi ressemblera leur art dans le moteur et comment il peut être animé, afin de créer des graphismes plus adaptés au développement de jeux.
Il est utile de noter que même après avoir atteint ce stade, vous pouvez facilement mettre à jour votre feuille de sprites et la réimporter dans le dossier d'assets (Unity utilise par défaut le dossier de votre projet dans "Documents"), et le jeu sera automatiquement mis à jour.
tags: #create #un #sprite #avec #inkscape