[Graphisme] Utiliser les modèles 3D des jeux DS

7 Réponses • 242 Vues

SirMalo

Graphiste

Exploiter les modèles 3D des jeux Pokémon sortis sur Nintendo DS


Domaine : graphismes
Difficulté : moyenne
Temps : moins de 5 minutes par modèle
Logiciels/outils requis :
  - Blender
  - Logiciel de retouche d’images gérant la transparence
  - Preset Blender par shiney570


Je tiens avant tout à remercier Shiney50, qui m’autorise à partager ici son setup Blender, essentiel au fonctionnement de ce tutoriel. Conformément à son souhait, je tiens à rappeler que ce tutoriel vise à étendre le plus possible les ressources disponibles pour tous. Merci de partager le fruit de votre travail dans la section appropriée du forum et éventuellement sur DeviantArt par la suite.




Le "ripping" (de l’anglais to rip : arracher) désigne l’action d’extraire différents éléments graphiques d’un jeu vidéo afin de les rendre exploitables. Il s’agit non pas de récréer plus ou moins à l’identique une ressource, mais bien d’isoler la ressource en question directement, avec des techniques allant du découpage de screenshot jusqu’à l’utilisation de logiciels ou outils dédiés.

Le ripping est une étape souvent nécessaire et fastidieuse dans le domaine de la création de fangame, puisqu’il s’agit de récupérer, parfois nettoyer et/ou adapter, et enfin de classer un grand nombre d’éléments graphiques afin de les rendre utilisables.

Évidemment, la tache est plus aisée lorsqu’il s’agit d’extraire des ressources pixelisées : pas ou peu de transparence à gérer, des éléments dont la forme ne varie pas en fonction de l’emplacement de la caméra, des animations facilement sécables image par image… En outre, les émulateurs de Game Boy et Game Boy Advance ont rapidement été dotés d’outils permettant l’extraction en masse des sprites, tiles et palettes.
C’est notamment ce qui explique que les ressources des jeux allant des versions Bleu et Rouge à Rouge-Feu et Vert-Feuille soient très complètes.

Pour ce qui est des versions suivantes, la chose a été rendue plus compliquée en raison de l’apparition de la 3D. Si les menus et sprites sont restés pixelisés comme avant, les rippeurs de tiles se sont retrouvés confrontés à une difficulté majeure : l’utilisation de la 3D déforme l’image et empêche une extraction directe des ressources.

Un moyen efficace de "ripper" correctement un élément 3D des versions DS est alors d’utiliser les modèles 3D de ces éléments et les textures qui vont avec. Une chance pour nous : une grande partie de ces éléments a été compilée :
- modèles des versions Diamant et Perle ;
- modèles de la version Platine ;
- modèles des versions HGSS ;
- modèles des versions Noire et Blanche ;
- modèles des versions Noire 2 et Blanche 2 ;

Nous allons donc voir comment utiliser ces modèles dans Blender afin d’en faire des ressources utilisables sur RPG Maker et Tiled.




I – Gestion du modèle 3D sur Blender

Lancez Blender et ouvrez le setup créé par Shiney570. Il contient tous les paramétrages de caméra, de lumière, de texture… permettant de reproduire le rendu des jeux DS :
> File
  > Open

Importez ensuite le fichier .obj du modèle que vous souhaitez extraire :
> File
  > Import
      > Wavefront (.obj)



Vous devriez alors vous retrouver avec le modèle grisé de votre tile. Pas de panique, une simple manipulation permettra d’y appliquer la texture adéquate. Pour cela, cliquez sur l’icône en forme de sphère située en bas à gauche de l’interface et sélectionnez "Texture". Pas besoin d’en faire plus : le fichier de texture est automatiquement détecté.



Toutefois, votre texture apparaîtra sûrement floue. Pour y remédier, il suffit de changer un paramètre dans vos préférences Blender (vous n’aurez à le faire qu’une seule fois, Blender va garder ce paramétrage par la suite) :
> File
  > User Preferences
      > Onglet "System"
        > Décocher "Mipmaps"
            > Enregistrer



Par défaut, l’ensemble des polygones seront sélectionnés, d’où le maillage orangé tracé tout autour de votre bâtiment. Pour s’en débarrasser, il suffit de double-cliquer sur le polygone appelé "Camera", en haut à droite, dans la liste des polygones. Étant donné que la caméra est un polygone invisible, cela aura pour effet de faire disparaître la sélection. Profitez-en par ailleurs pour cliquer sur l’œil situé à droite de "Camera" afin de masquer entièrement tout ce qui s’y rapporte sur votre rendu.



Astuce : n’hésitez pas à masquer d’autres polygones en cliquant sur l’icône d’œil si vous souhaitez enlever une ou plusieurs parties de votre modèle final (une barrière, une lumière, de la fumée, etc.)


Il s’agit maintenant de réduire votre bâtiment à la dimension voulue. Pour cela, utilisez uniquement les touches + et - de votre pavé numérique. Les zooms à la molette sont bien trop imprécis.

Pour trouver la bonne taille de votre bâtiment, pas de secret : il faut y aller à l’œil. Personnellement, en cas de doute, j’essaie de trouver le bâtiment en question sur une map de Bulbapedia, puis je réduis ma fenêtre internet et je viens placer le bâtiment à côté de mon modèle sur Blender.



Si le doute persiste, gardez toujours un bâtiment trop grand que trop petit : vous pourrez toujours le réduire avec votre logiciel de traitement d’image.


Astuce : avec les touches 2, 4, 6 et 8 de votre pavé numérique, vous pouvez modifier le pivot et le roulis de votre modèle. Cela peut s’avérer intéressant pour certains modèles qui existent en deux versions (une version Nord/Sud et une version Est-Ouest, comme les péages de Pokémon BN par exemple) ou pour varier les plaisirs !



Une fois que vous avez une image finale de votre bâtiment, vous pouvez exporter le rendu. Au préalable, dans l’onglet "Render Presets" situé à droite de votre interface, vérifiez que la résolution est bien à 100% et n’hésitez pas à passer la "Colors depth" de 8 à 16. Puis, cliquez sur l’icône en forme d’appareil photo en bas de votre interface et laissez le rendu se faire :



Une fois le rendu fait, vous aurez votre modèle sur fond transparent. Appuyez alors sur F3 pour l’enregistrer et choisissez votre dossier de destination. Cette façon de faire présente l’avantage de garder la transparence des ombres, lumières et éléments semi-opaques de votre rip.

Un conseil : n’hésitez pas à abuser des dossiers et sous-dossiers pour avoir un classement le plus précis possible (ex : HGSS > Azuria > Bâtiments, plutôt qu’un simple dossier Rips).

Si vous souhaitez revenir à la vue précédente (avant rendu), sélectionnez "3D View" dans la liste déroulante située tout en bas à gauche.



Il se peut que l’image affichée par le rendu ne corresponde pas à celle que vous avez sur la vue 3D (bâtiment plus petit, flou…). Si tel est le cas, je ne sais personnellement pas quels paramétrages toucher pour modifier ça, et je me contente de prendre une capture d’écran de ma vue 3D, que je modifierai ensuite sur mon logiciel de retouche.


Astuce : si vous souhaitez enchainer avec un autre modèle, vous pouvez faire CTRL Z jusqu’à revenir à l’étape juste avant l’import de votre fichier .obj (ce qui peut être prendre du temps voire être impossible en fonction du nombre de changements que vous aurez fait sur votre modèle). Cela à l’avantage de garder l’application des textures actives et d’utiliser directement le zoom approprié. Vous n’avez plus qu’à importer le .obj suivant.
Si cela n’est pas possible, rouvrez simplement le fichier blender de preset (CTRL + Maj + O pour la liste des fichiers ouverts récemment). Vous devrez alors modifier de nouveau le zoom, la résolution, la profondeur des couleurs ainsi que l’application automatique des textures, puis importer le .obj voulu.


II – Finitions sur le logiciel de retouche

Si vous avez utilisé la technique de la capture d’écran plutôt que celle du rendu, commencez premièrement par supprimer la couleur de fond. Attention, il se peut que cette couleur soit également utilisée sur l’élément que vous êtes en train de ripper, donc prenez garde à ne pas effacer certains pixels qui ne seraient pas ceux du fond.

Il se peut que vous deviez ensuite redimensionner le votre rendu. N’hésitez pas à utiliser un character ou un autre bâtiment en guise de repère. Souvent, pour un même style graphique (DPPt + HGSS / NB + NB2), certains éléments font souvent la même taille. C’est le cas notamment des fenêtres, des portes ou encore des ombres.

Une fois que votre tile est à la bonne taille et que le fond est transparent, il convient de le placer sur votre grille de tileset. Pour cela, faites en sorte de garder toujours un même placement.

Pour ma part, je fais toujours en sorte que les entrées de mes bâtiments soient centrées par rapport à ma grille et située à 2px du bas d’une case de grille.



Enfin, quelques légères retouches peuvent être effectuées pour "nettoyer" le tile, en adoucissant une courbe ou en corrigeant quelques pixels parasites.



Et voilà ! Vous avez un tile tout beau prêt à être utilisé en jeu !

Encore une fois, merci de partager vos créations une fois celles-ci finies, c’est pour le bien de tous et c’est une volonté claire de l’auteur de ce preset Blender.



BONUS

Pour vous simplifier la vie, n'hésitez pas à jouer un peu avec les modèles de portes, voire à changer les textures pour faire vos propres animations !

« Modifié: 20 décembre 2018, 19:23:25 par SirMalo »

Tiles Tuto Graphique

Woah super ! Merci pour ce tuto ! :D

Amras Anárion

Scénariste

Moi qui croyait que les jeux DS étaient de la 2D avec une couche de Mode 7 pour donner une impression de perspective.
En lisant le titre avec le mot 3D, je pensais aussi qu'on apprendrait comment extraire les environnements 3D des jeux 3DS.

Quoi qu'il en soit, le secret de l'extraction des ressources 4G et 5G nous est révélé. Et on comprends mieux tout le travail qui est derrière. Merci.  :3

SirMalo

Graphiste

C'est bel et bien de la vraie 3D qui est utilisée dès les versions Diamant et Perle. C'est encore plus visible dans les versions Blanche et Noire, qui utilisent vraiment le moteur de la DS à fond.

J'ai aussi une méthode pour extraire les maps en 3D des versions précitées (et il doit y avoir un moyen de le faire pour les versions 3DS et même Switch à en juger par ces ressources ci et ), mais ça requiert de toucher au fichier du jeu, et pas de ça ici !

Nuri Yuri

HostMaster

La Nintendo DS ne fait tourner que de la 3D.
Tu as le droit d'utiliser que 128 sprites 2D donc autant te dire que beaucoup de chose étaient fait en 3D (en utilisant quelques trick caméra pour que ça rende en 2D).

(Pour info, le Tilemap de PSDK utilise 1200 sprites).
ln(yo) = <3

Amras Anárion

Scénariste

Game Freak a donc probablement dû ruser en usant de sprites CSS (je ne me souviens plus du nom que tu avais dit sur le DIscord pour qualifier une même image où plusieurs sprites étaient, mais c'est le terme employé pour une page Web). 128 images en 2D, c'est très vite atteint, rien qu'avec les menus et toutes les icônes d'objets.
Ou les mystères des limitations du moteur de jeu de la Nintendo DS. (Sachant que les calculs en 2D sont moins gourmands qu'en 3D, qui peut le plus peut le moins.)
L'exploit reste quand même d'être resté dans le pur style de la 3G avec une 3D imposée.
(C'est vrai que je rappelle que dans la plus grande ville d'Unys, la caméra tourne progressivement le long du quai en arc de cercle, prouvant que c'est bien de la 3D.)

Nuri Yuri

HostMaster

Je sais pas s'il y avait une BG map mais en tout cas non, les calculs 2D sont plus gourmand que les calculs 3D pour une raison simple : Le processeur 3D ne sait que faire de la 3D et le fait très bien.

Si tu veux t'en convaincre, ouvre n'importe quel projet Essentials. C'est de la 2D calculé en 2D (donc avec le CPU) et ça rame son cul.
ln(yo) = <3

SirMalo

Graphiste

Tuto mis à jour avec l'image manquante + petite technique pour faire facilement vos animations de portes tout en bas :)

There was an error while thanking
Thanking...