Bonjour à tous,
Ceci est mon premier tutoriel, donc si vous avez des remarques, des améliorations à me faire part n'hésiter pas.

Auteur : Nagasakiss

Remerciements : Je tiens à remercier Zangther, TaZ, Angellan, LeM et Tiroflan pour leurs conseils donnés à moi ou à d'autre.

Niveau : Moyen, des connaissances sur le logiciel ainsi qu'en mapping sont requises.

Introduction

Ce tutoriel va porter sur une technique de mapping assez pratique : le mapping en panorama, appelé également mapping en parallaxe ou panoramisation.

Cette technique consiste a prendre un screenshoot de la map à modifier, d'ajouter des éléments grâce à un logiciel de retouche d'image, d'importer la map modifiée en tant que parallaxe, puis de régler la passabilité avec RPG Maker.

Nous allons voir toutes ces étapes l'une après l'autre.

I) La prise du screenshoot de la Map.

Pour notre plus grand bonheur, il existe un script qui permet de faire un screenshoot d'une map In Game, réalisé par Milow. ( Lien vers le script ici )
Malheureusement, comme vous pouvez le voir dans le topic ce script n'est pas parfait.
Pour le problème des fogs : pour nous la question ne se pose pas. En effet, ne prenez pas un screenshoot d'une map avec un fog ce serait contre-productif, tous les éléments rajoutés par la suite seraient par dessus ce fog.

Mais si jamais le script ne fonctionne pas il reste la méthode manuelle : c'est à dire prenez un screenshoot de votre écran complet, au moyen de la touche Impr écran ou d'un logiciel de screen, puis de raccorder toute les parties de la map avec un logiciel de retouche d'image. ( C'est assez fastidieux mais essayez d'être le plus précis possible le résultat final de votre map en dépend. )

II) La modifications de la Map

Une fois le screenshoot pris, ouvrez votre logiciel de retouche d'image. ( Théoriquement tout logiciel de retouche pourrait convenir, mais utilisez de préférence un logiciel qui gère les calques et la transparence : je vous conseille The Gimp ou Photoshop car ils possèdent des fonctionnalités qui nous seront utiles. )

Ne possédant pas Photoshop, toute la suite du tutoriel sera réalisé sous Gimp, les deux logiciel se ressemblant un peu les utilisateurs de Photoshop n'auront pas de mal à suivre.

A) Configuration du logiciel

-Avec The Gimp :

Pour rendre la modification de la map plus aisée, nous allons utilisé un outils de Gimp bien pratique : la grille.
Mais pour cela il faut la configurer.

Tout d'abord allez dans Éditions -> Préférences -> Grilles par défauts
Là vous avez plein de paramètres : couleur de la grille, apparence ... Ce qui nous intéresse c'est l'espacement, réglez les deux valeurs sur 32px et validez.
Puis ouvrez l'image à modifier, allez dans Affichage -> Afficher la grille, faites aussi Aligner sur la grille, une options qui alignera tous nos outils sur la grille que nous venons de créer.
Nous avons maintenant, une grille qui nous aide à découper nos tilesets et à les placer sur la map.

Une image pour illustrer le tout :



(cliquez sur l'image pour l'agrandir)

-Avec Photoshop : ( Un grand merci à Angellan )

Tout d'abord allez dans Éditions -> Préférences -> Repère, grilles et tranches...
Là vous avez plein de paramètres : couleur de la grille, apparence ... Ce qui nous intéresse c'est le pas, réglez la valeur sur 32px. Vous pouvez également réglez le nombre de subdivisions sur 2 ou 4 puis validez.
Puis ouvrez l'image à modifier, allez dans Affichage -> Afficher -> Grille, faites également Affichage -> Magnétisme (il faut qu'il soit coché).

Nous avons maintenant, une grille qui nous aide à découper nos tilesets et à les placer sur la map.

Une image pour illustrer le tout :



B) La modifications de la map

Une fois la grille affichée, la modification de votre map peut commencer.Je vous conseille de faire toutes les modifications de votre map dans un autre calque ( Calques -> Nouveau calque et sélectionnez transparence en type de remplissage de calque puis affichez le gestionnaire de calque en faisant Fenêtre -> Fenêtre ancrable -> Calques ), ainsi votre screenshoot ne sera pas détérioré si vous vous rendez compte que cela ne vous plait pas.
Ouvrez l'image que vous voulez ajouter à votre map, sélectionnez la, copier la puis collez la sur l'image de votre map. Recommencez ainsi pour toutes les images que vous voulez ajouter.

Une fois toutes les modifications faites, sauvegardez votre image directement dans le dossier parallaxe de votre projet ( le chemin est quelque chose comme C:\Documents and Settings\Utilisateur\Mes documents\RPGVX\Nom_de_votre_projet\Graphics\Parallaxes ). Ou alors importez votre images avec le gestionnaire de ressource de RPG Maker. ( Voir image ci dessous )



C) Le panorama

Enfin, il faut mettre l'image que nous avons modifier en tant que panorama.
Pour cela, ouvrez RPG Maker et créez une map de la même taille que celle dont vous avez pris le screenshoot. ( Ou effacez complétement celle-ci )
Puis faites un clique droit sur le nom de cette map : un menu apparait, sélectionnez Propriétés de la carte. Une fenêtre s'ouvre, en bas à droite de cette fenêtre il y a un cadre appelé Panorama défilant. Dans ce cadre vous pouvez sélectionner l'image que vous avez modifiée ( Cliquez sur le cadre blanc juste sous Image ). Puis cochez la case à côté de "Afficher dans l'éditeur", ainsi nous verrons notre image. Faites OK, l'image est définie comme panorama de la carte.

Une image pour tout récapituler :




III) La configuration de la passabilité.

Nous arrivons enfin à l'étape finale : la configuration de la passabilité, c'est peut être l'étape la plus difficile, alors suivez bien.

Tout d'abord vous devez avoir dans vos tilesets deux cases de vides, si vous n'en avez pas faite de la place car c'est indispensable.
Vous attribuerez la passabilité "croix" à une de ces deux cases et la passabilité "rond" à l'autre.
Et grâce à ces deux cases vous pourrez atribuer à votre map les endroits passables ou non.

-Mais pour la passabilité "étoile" comment fait-on ?

C'est là que cela se complique, en effet il existe deux méthodes.

A) La méthode avec des évents.

Cette méthode consiste à transformer les tilesets ou images, que vous voulez mettre en passabilité "étoile", en charset.
Pour cela, il existe un tutoriel de Matsuo Kaito qui explique la méthode à suivre. ( Lien vers le tutoriel ici. )

Une fois vos charset créés, vous n'avez plus qu'à les afficher grâce à un événement, en n'oubliant pas de régler la priorité d'affichage sur "au-dessus du héros" ou même mieux en passabilité "même niveau que le héros" option "traverse tout" ainsi le événements passeront eux aussi "derrière".

B) La méthode avec une image.

Cette méthode consiste à afficher une image contenant uniquement tout les "morceaux d'image" qui seront en passabilité "étoile".
Je m'explique au moyen d'une image :



Nous allons créer cette image. Tout d'abord créé un nouveau calque du parralaxe ( Calques -> Nouveau calque et sélectionnez transparence en type de remplissage de calque puis affichez le gestionnaire de calque en faisant Fenêtre -> Fenêtre ancrable -> Calques ), puis dans ce calque copiez tous les éléments qui doivent être en passabilité "étoiles" et superposez les. A la fin, votre image ne doit pas avoir changé.

Puis copiez votre calque ( cliquer sur la calque puis faite Édition -> Copier ou Ctrl +C ), créez une nouvelle image ( Fichier -> Nouveau, Réglez les dimensions de l'image pour quelles soient égales à celles du parallaxe, et sous "Options avancées" sélectionnez remplir avec : Transparence )

Une image qui récapitule la création de l'image :



Enregistrez l'image dans le dossier Pictures de votre projet ( le chemin est quelque chose comme C:\Documents and Settings\Utilisateur\Mes documents\RPGVX\Nom_de_votre_projet\Graphics\Pictures ) ou importez-la avec le gestionnaire de ressources de RPG Maker.

Maintenant il ne vous reste plus qu'à afficher l'image. Là deux cas de figure s'impose :

- Soit la taille de la map est minimale ( 17*13 ), et il suffit d'afficher l'image le plus simplement possible. Pour cela, créé un événement en processus parallèle puis faite Afficher une image... ( 2eme page, 5eme cadre ), choisissez l'image que vous venez de créer et ne toucher à rien d'autres.

Une image pour récapituler le tout :



- Soit la map est plus grande, alors il faut "fixer" l'image par rapport au héros. Pour ce faire, on peut utiliser le script Fixed Picture d'OriginalWij mais m'y connaissant très peu en script, je ne pourrait pas vous aider.
Il existe toutefois une autre méthode au moyen d'événements, présenté par TrashX dans ce tutoriel ( lien vers le tutoriel ici ).

Voilà votre map en panorama est terminée !

IV) Remarques

- Bien qu'il soit possible de mapper des maps complètes en panorama, cette technique est plus souvent utilisée pour rajouter des détails et passer outre la limitation de tilesets ou de couches imposée par RPG Maker.

- Les deux méthodes expliquées ci-dessus pour configurer la passabilité "étoile" sont interchangeables en fonction de la map. Si la map est grande privilégiez la méthode avec les événements. Si la map est petite ou que la passabilité "étoile" est fréquente privilégiez la méthode avec l'image.

- La méthode pour mapper en panorama expliquée ci-dessus présente une faille : la gestion des hautes herbes. En effet, lorsque le héros passe dans les hautes herbes, un effet apparait. On a l'impression que le héros a de l'herbe jusqu'au genoux. Cet effet n'est pas présent en mapping en panorama. Pour remédier à cela, une méthode toute simple : supprimer sur vos tilesets une des hautes herbes que vous possédez. Il faut que dans l'éditeur on voit un carré transparent. Puis mappez normalement et lors de la configuration de la passabilité, mettez ce carreau à la place du rond habituel.

EDIT :

-Suite aux remarques de Tiroflan, la méthode pour afficher la passabilité "étoiles" grâce à une image présente elle aussi quelques failles :

Tiroflan a écrit:

Objection votre honneur ! [...]

-> L'image passe par dessus les effets météorologiques.

-> L'image passe par dessus les évènements qui passent par dessus le joueur, il est donc par exemple impossible de faire un toit sous lequel on passe, mais avec une cheminée et de la fumée par dessus.

-> Le changement du ton d'écran n'est pas pratique, puisqu'il faut penser à changer le ton d'image avec. Je chipote là dessus, mais la méthode characters se passe de cette ligne supplémentaire, c'est ça de pris.

En bref, la méthode avec image n'est avantageuse que pour les petits intérieurs. La solution actuelle est de mettre ton image, sans modification, dans un charset, et de mettre ce charset dans la map en passabilité "même niveau que le joueur", avec l'option "traverse tout".

Ce tutoriel est terminé merci à vous de l'avoir lu et bon mapping !

Tuto complet et bien fait.

+2 en Mapping, +3 Participation.

D'ailleurs, voici un tutoriel de Celianna pour ceux qui voudraient aller plus loin.

http://pinkfirefly.deviantart.com/art/Advanced-Parallaxing-196222246

Objection votre honneur !
La méthode "avec image" de la passabilité étoile n'est pas bonne, pour plusieurs raisons :

-> L'image "suit" le personnage lorsqu'il se déplace, ce qui fait qu'on ne voit qu'une partie de l'image, et si on ne fixe pas l'image sur le parallaxe (une méthode avec deux variables était proposée par TrashX, il me semble, mais c'est très chiant à mettre en place), l'image n'est valable que pour les maps 17x13. Le script Fixed Picture d'OriginalWij permet de faire ça aussi, il me semble.

-> L'image passe par dessus les effets météorologiques.

-> L'image passe par dessus les évènements qui passent par dessus le joueur, il est donc par exemple impossible de faire un toit sous lequel on passe, mais avec une cheminée et de la fumée par dessus.

-> Le changement du ton d'écran n'est pas pratique, puisqu'il faut penser à changer le ton d'image avec. Je chipote là dessus, mais la méthode characters se passe de cette ligne supplémentaire, c'est ça de pris.

En bref, la méthode avec image n'est avantageuse que pour les petits intérieurs. La solution actuelle est de mettre ton image, sans modification, dans un charset, et de mettre ce charset dans la map en passabilité "même niveau que le joueur", avec l'option "traverse tout".

Objection retenue, et modification du tutoriels en conséquence ...
Merci de cette remarque.

Nagasakiss

PS : Pour plus de faciliter je vais copier-coller ton messages dans les remarques, est-ce que cela te dérange ?

Pas de souci, j'avais d'ailleurs expliqué comment placer le chara-map dans mon "usine", si ça t'intéresse, tu peux te servir sans problème.
C'est une bonne idée de faire un tuto dessus, en tout cas !

Le lien qu'a posté Zang explique le parallaxe mapping (en anglais par contre), et inclue un lien de téléchargement de trois scripts très utiles, parallaxe animés, picture fixed, et un truc pour les passabilités étendues qui est vachement cool.

Jvous conseille vraiment de le lire si l'anglais vous fait pas peur (et merci à Doddy qui me l'a filé)
Avec un peu d'astuce on peut du coup contourner tous les problèmes "purs" de la picture. Après le truc de la météo, ouais, mais vu que seules les parties en mode étoile ont besoin d'être sur la picture, les parties sont très petites (à moins de vouloir faire un gros labyrinthe ou le joueur ne voit pas où il va) et donc l'effet est pas trop dérangeant.

Mais bon reste que le mapping en parallaxe même si c'est joli, c'est long, chiant, et pas pour les débutants.

Salur je trouve pas le scripte script "Fixed Picture" don parle le sujet

Citation :

Soit la map est plus grande, alors il faut
"fixer" l'image par rapport au héros. Pour ce faire, on peut utiliser le
script Fixed Picture d'OriginalWij

(j'ai vue le tuto en Évènement mais sa marche pas pour moi !!! )

Je te renvoie au post d'Angellan : sur ce lien ( http://pinkfirefly.deviantart.com/art/Advanced-Parallaxing-196222246 ), tu trouvera 3 scripts dont celui qui t'intéresse.

Nagasakiss

Merci ;D

Bonjour ! Je t'invite à aller lire le règlement, parce que manifestement, cela n'a pas été fait. Je t'en donnerai donc un petit résumé ici :

-La présentation est obligatoire sur ce forum, afin que nous puissions mieux nous connaître. Je te conseille donc d'aller te présenter.
-Le nécropost est interdit, c'est-à-dire poster un message inutile plus d'un mois après le dernier post
-Le flood est tout aussi interdit, c'est à dire poster un message qui n'apporte rien de nouveau à un topic

A l'avenir, je te conseille donc de faire attention !

Sur ce, bonne continuation !

P.S : Ah oui, et lock aussi