[ - Tutoriel - ] Comment mapper avec des panoramas
Publié : mer. nov. 17, 2010 10:49 pm
Bon, voilà voilà, j'ai dis que j'allais le faire, alors je le fais.
Je compte indiquer étape par étape ce que je fais, avec peut-être quelques parties annexes pour faciliter un peu la tâche.
Les captures d'écrans sont faites sur Photoshop pour faire la map, mais rien n'empêche d'utiliser autre chose, comme The Gimp, Paint, etc...
Bon bon bon, alors, je commence où... (pour tout dire, au moment où j'écris ce tuto, j'ai rien préparé, pour bien être dans la même situation que vous).
Première étape : Préparer le terrain
Bon, on commence par ouvrir son RPG Maker VX (pas besoin de vous faire un dessin pour ça, vous êtes assez grands je pense).
On commence par créer une carte avec les proportions qu'on veut, je vais donc en faire une petite, pour faire rapide et facile.
Comme on peut le voir ici, rien de compliqué : un nom de map, la taille minimum, et rien de plus.
Comme vous le verrez en appuyant sur OK, vous obtenez une map normale, tout ce qu'il y a de plus basique, elle est simplement vide et transparente (exactement ce qu'on veut donc).
Le résultat à obtenir. Les carrés bleu clair/foncé indiquent la transparence.
Voilà, la première étape est finie. Rien de difficile jusqu'ici.
Deuxième étape : Faire notre panorama/carte
Ici, ça se complique un petit peu.
Préparez votre logiciel de retouche d'images favori (pour ce tutoriel, j'utiliserai Paint et Photoshop, libre à vous d'en utiliser un autre).
Vous allez donc devoir créer une image vide, de la taille de votre map (ou plus petit si vous désirez faire un panorama qui ne prend pas toute la map).
Pour connaître la taille de votre map, il faudra utiliser un logiciel très difficile d'utilisation. J'ai nommé... la calculatrice Windows (ou le cerveau pour les chanceux qui en ont un, ici c'est pas mon cas...).
Si on regarde la carte que j'ai crée, on remarque que la largeur est de 17 cases et la hauteur de 13.
Une case fait 32 pixels. Vous devez donc faire les calculs suivants pour obtenir la taille de votre carte :
Largeur en cases * 32
Hauteur en cases * 32
Ce qui donne pour moi :
17 * 32 = 544
13 * 32 = 416
(en gros, la hauteur/largeur de la fenêtre de jeu de RMVX).
Donc vous pouvez créer votre image vierge (non Darxenas, non, pas de sous-entendus) grâce a ceci :
Voilà à quoi ça doit ressembler sur Photoshop.
Normalement, vous obtenez un rectangle blanc.
Vous pouvez dessiner votre carte directement sur le logiciel, mais j'expliquerai pas ici car vous n'êtes pas là pour apprendre à utiliser Paint.
Bon, après un p'tit temps, vous devriez avoir votre carte (ouais, je sais, je me suis pas foulé... Pour la grille qui divise l'image en cases de 32*32, faudra chercher tout seul ou me faire un don de 20 Korulz en espèces).
Celui qui reconnait ce que j'ai dessiné aura un cookie.
Bon bah voilà, vous avez votre... *toussote* magnifique map !
Vous pouvez donc l'enregistrer, et la placer dans le dossier "Parallaxes" de votre projet.
Ça va vous aider pour la prochaine étape.
Bon, l'étape 2 est terminée.
Troisième étape : Utiliser le panorama dans RPG Maker
Et oui, c'est long hein ? Une fois que vous aurez l'habitude, ça ira plus vite.
On retourne donc dans RPG Maker, et on fait un clic droit -> "Propriétés de la Carte" sur la carte sur laquelle on veut utiliser le panorama.
Vous retombez sur la fenêtre que vous avez vu à la création de votre carte.
C'est normal. Mais cette fois, on va y apporter des changements.
Cliquez donc sur le bouton "..." du menu déroulant "Image :" dans la partie "Panorama Défilant".
Surprise, qu'est-ce qui s'y trouve?
Bawi, on retrouve notre panorama, on peut donc cliquer sur OK, et ensuite cocher "Afficher dans l'éditeur" dans les propriétés de la carte.
Ce qui va donner...
Voilà voilà, on a notre panorama dans l'éditeur. Maintenant, il manque plus que les collisions des cases.
Vous allez donc devoir enregistrer ces deux images dans le dossier "System" de votre jeu.
Vous n'êtes pas obligés de faire ça mais c'est pour une question de facilité, vous comprendrez après.
En voilà une déjà :
TileE.png:
Oui, on ne la voit pas. C'est justement ça qui est utile !
Et enfin, TileEPano.png
Une fois que c'est fait, allez dans le dossier "System" de votre projet et renommez "TileEPano" en "TileE" (et donnez un autre nom à TileE).
Ensuite, retournez dans RPG Maker, et allez dans l'onglet E des tilesets.
Cliquez ensuite sur le bouton "Gestionnaire des ressources", dans votre barre d'outils.
Un peu au-dessus du panorama avec la bulle d'aide.
Refermez simplement la fenêtre ensuite et vous verrez votre tileset avec des carreaux bleu et rouge à gauche.
Cliquez ensuite sur le bouton "Paramètres de passage" (il se trouve à gauche du bouton "Carte" dans la barre d'outils).
Ce mode vous permettra de dire quelle case est traversable et laquelle ne l'est pas.
Ici c'est simple, on clique sur la rouge pour obtenir une croix et on mets un cercle sur le bleu.
Après ça, désactivez le mode "Paramètres de passage" et passez sur le mode "Carte" (bouton juste à droite) et utilisez le carré bleu pour faire des endroits traversables, et le rouge pour les endroits non-traversables.
Pour moi, ça donne ça :
Bon, vous avez fini. Votre map est prête.
Pour ne pas avoir les carrés rouge/bleu sur votre map (vous le remarquerez en testant votre projet), il suffit simplement de retourner dans le dossier "System" et de nommer l'image vide "TileE". Vous aurez alors un panorama convenable et praticable.
Voilà, ce tuto s'achève ici.
Après, à partir de ça, vous pouvez développer de nouvelles techniques : comme faire votre éclairage vous-même, etc... Mais ça, c'est plus pour ici (manque de temps et de sommeil, mais je tenais à le boucler pour aider ceux qui en ont besoin).
Après, pour faire des maisons sans se cogner au toit ou marcher dessus, c'est une autre technique que je détaillerai pas ici : les évènements.
Si vous réfléchissez un peu (pensez aux fiches des persos), vous pourrez le faire assez facilement.
Bon, certes, j'utilise pas la meilleure méthode. Mais bon, tant qu'elle me va à moi hein...
Vous pouvez aussi télécharger le projet en fichier joint pour observer ce qu'il y a dedans.
Je suis disponible pour répondre aux questions, si elles sont posées dans ce topic.
Et si vous avez une suggestion à faire pour améliorer le tuto c'est pareil.
Merci de le signaler et je ferai mon possible.
Je compte indiquer étape par étape ce que je fais, avec peut-être quelques parties annexes pour faciliter un peu la tâche.
Les captures d'écrans sont faites sur Photoshop pour faire la map, mais rien n'empêche d'utiliser autre chose, comme The Gimp, Paint, etc...
Bon bon bon, alors, je commence où... (pour tout dire, au moment où j'écris ce tuto, j'ai rien préparé, pour bien être dans la même situation que vous).
Première étape : Préparer le terrain
Bon, on commence par ouvrir son RPG Maker VX (pas besoin de vous faire un dessin pour ça, vous êtes assez grands je pense).
On commence par créer une carte avec les proportions qu'on veut, je vais donc en faire une petite, pour faire rapide et facile.
Comme on peut le voir ici, rien de compliqué : un nom de map, la taille minimum, et rien de plus.
Comme vous le verrez en appuyant sur OK, vous obtenez une map normale, tout ce qu'il y a de plus basique, elle est simplement vide et transparente (exactement ce qu'on veut donc).
Le résultat à obtenir. Les carrés bleu clair/foncé indiquent la transparence.
Voilà, la première étape est finie. Rien de difficile jusqu'ici.
Deuxième étape : Faire notre panorama/carte
Ici, ça se complique un petit peu.
Préparez votre logiciel de retouche d'images favori (pour ce tutoriel, j'utiliserai Paint et Photoshop, libre à vous d'en utiliser un autre).
Vous allez donc devoir créer une image vide, de la taille de votre map (ou plus petit si vous désirez faire un panorama qui ne prend pas toute la map).
Pour connaître la taille de votre map, il faudra utiliser un logiciel très difficile d'utilisation. J'ai nommé... la calculatrice Windows (ou le cerveau pour les chanceux qui en ont un, ici c'est pas mon cas...).
Si on regarde la carte que j'ai crée, on remarque que la largeur est de 17 cases et la hauteur de 13.
Une case fait 32 pixels. Vous devez donc faire les calculs suivants pour obtenir la taille de votre carte :
Largeur en cases * 32
Hauteur en cases * 32
Ce qui donne pour moi :
17 * 32 = 544
13 * 32 = 416
(en gros, la hauteur/largeur de la fenêtre de jeu de RMVX).
Donc vous pouvez créer votre image vierge (non Darxenas, non, pas de sous-entendus) grâce a ceci :
Voilà à quoi ça doit ressembler sur Photoshop.
Normalement, vous obtenez un rectangle blanc.
Vous pouvez dessiner votre carte directement sur le logiciel, mais j'expliquerai pas ici car vous n'êtes pas là pour apprendre à utiliser Paint.
Bon, après un p'tit temps, vous devriez avoir votre carte (ouais, je sais, je me suis pas foulé... Pour la grille qui divise l'image en cases de 32*32, faudra chercher tout seul ou me faire un don de 20 Korulz en espèces).
Celui qui reconnait ce que j'ai dessiné aura un cookie.
Bon bah voilà, vous avez votre... *toussote* magnifique map !
Vous pouvez donc l'enregistrer, et la placer dans le dossier "Parallaxes" de votre projet.
Ça va vous aider pour la prochaine étape.
Bon, l'étape 2 est terminée.
Troisième étape : Utiliser le panorama dans RPG Maker
Et oui, c'est long hein ? Une fois que vous aurez l'habitude, ça ira plus vite.
On retourne donc dans RPG Maker, et on fait un clic droit -> "Propriétés de la Carte" sur la carte sur laquelle on veut utiliser le panorama.
Vous retombez sur la fenêtre que vous avez vu à la création de votre carte.
C'est normal. Mais cette fois, on va y apporter des changements.
Cliquez donc sur le bouton "..." du menu déroulant "Image :" dans la partie "Panorama Défilant".
Surprise, qu'est-ce qui s'y trouve?
Bawi, on retrouve notre panorama, on peut donc cliquer sur OK, et ensuite cocher "Afficher dans l'éditeur" dans les propriétés de la carte.
Ce qui va donner...
Voilà voilà, on a notre panorama dans l'éditeur. Maintenant, il manque plus que les collisions des cases.
Vous allez donc devoir enregistrer ces deux images dans le dossier "System" de votre jeu.
Vous n'êtes pas obligés de faire ça mais c'est pour une question de facilité, vous comprendrez après.
En voilà une déjà :
TileE.png:
Oui, on ne la voit pas. C'est justement ça qui est utile !
Et enfin, TileEPano.png
Une fois que c'est fait, allez dans le dossier "System" de votre projet et renommez "TileEPano" en "TileE" (et donnez un autre nom à TileE).
Ensuite, retournez dans RPG Maker, et allez dans l'onglet E des tilesets.
Cliquez ensuite sur le bouton "Gestionnaire des ressources", dans votre barre d'outils.
Un peu au-dessus du panorama avec la bulle d'aide.
Refermez simplement la fenêtre ensuite et vous verrez votre tileset avec des carreaux bleu et rouge à gauche.
Cliquez ensuite sur le bouton "Paramètres de passage" (il se trouve à gauche du bouton "Carte" dans la barre d'outils).
Ce mode vous permettra de dire quelle case est traversable et laquelle ne l'est pas.
Ici c'est simple, on clique sur la rouge pour obtenir une croix et on mets un cercle sur le bleu.
Après ça, désactivez le mode "Paramètres de passage" et passez sur le mode "Carte" (bouton juste à droite) et utilisez le carré bleu pour faire des endroits traversables, et le rouge pour les endroits non-traversables.
Pour moi, ça donne ça :
Bon, vous avez fini. Votre map est prête.
Pour ne pas avoir les carrés rouge/bleu sur votre map (vous le remarquerez en testant votre projet), il suffit simplement de retourner dans le dossier "System" et de nommer l'image vide "TileE". Vous aurez alors un panorama convenable et praticable.
Voilà, ce tuto s'achève ici.
Après, à partir de ça, vous pouvez développer de nouvelles techniques : comme faire votre éclairage vous-même, etc... Mais ça, c'est plus pour ici (manque de temps et de sommeil, mais je tenais à le boucler pour aider ceux qui en ont besoin).
Après, pour faire des maisons sans se cogner au toit ou marcher dessus, c'est une autre technique que je détaillerai pas ici : les évènements.
Si vous réfléchissez un peu (pensez aux fiches des persos), vous pourrez le faire assez facilement.
Bon, certes, j'utilise pas la meilleure méthode. Mais bon, tant qu'elle me va à moi hein...
Vous pouvez aussi télécharger le projet en fichier joint pour observer ce qu'il y a dedans.
Je suis disponible pour répondre aux questions, si elles sont posées dans ce topic.
Et si vous avez une suggestion à faire pour améliorer le tuto c'est pareil.
Merci de le signaler et je ferai mon possible.
Facile à comprendre, puis t'as carrément bien foutu des images (lol tu rigoles mais ça va aider) ! Sans parler des petites allusions humouristiques ici et là (ma raison de vivre...)... Ahh... j'aime j'aime j'aime ! 
Merci beaucoup !!!
