Zarok RPG Maker
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.



 
AccueilDernières imagesS'enregistrerConnexion
Le deal à ne pas rater :
SSD interne Crucial BX500 2,5″ SATA – 500 Go à 29,99€
29.99 €
Voir le deal

Partagez | 
 

 mapper avec des images (photofiltre studio)

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
hinola
Atome
Atome
hinola


Masculin Messages : 24
Date d'inscription : 22/07/2010

Caractéristiques du membre
Evolution: Atome
Job: mapping, graphisme, scénario
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyMer 4 Aoû 2010 - 8:45

Salut à tous et à toutes Wink

voici mon tutoriel pour mapper avec des pictures et des panoramas.
avec photofiltre studio
(vous pouvez l'adapter à votre logiciel préféré je pense)

Le tutoriel sera divisé en plusieurs parties :

faire des éléments de décors, partie I : les banderoles
faire des éléments de décors, partie II : quelques retouches
faire un sol en panorama
► créer une ambiance, partie I : avec une image fixe
► créer une ambiance, partie II : faire des succession de couches (exemple : la montagne de mon projet)
► créer une ambiance, partie III : avec une image qui se déplace

désolé je vais faire un quadruple post mais j'ai pas beaucoup d'autres solution ^^"


Dernière édition par hinola le Mer 4 Aoû 2010 - 8:48, édité 3 fois
Revenir en haut Aller en bas
hinola
Atome
Atome
hinola


Masculin Messages : 24
Date d'inscription : 22/07/2010

Caractéristiques du membre
Evolution: Atome
Job: mapping, graphisme, scénario
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyMer 4 Aoû 2010 - 8:46

Bon... voici (enfin) mon tuto pour faire des banderoles.

Je vais en placer sur une map de style "ville fortifiée extérieur"
la première étape est donc... faire une map... (logique)

mapper avec des images (photofiltre studio) Villevierge

► après quoi, vous devrez en prendre une capture d'écran in game et la coller dans photofiltre studio (je sais pas pour les autres logiciels, mais il faut des CALQUES)

si vous voulez photofiltre studio 10 (X), il est téléchargeable ici : http://www.photofiltre-studio.com/download.htm

une fois que cela est fait, créez un nouveau calque (calques => nouveau => vierge) avec la case "transparence automatique" cochée.
Puis verrouillé le calque du fond pour éviter les erreurs. (clique droit sur le calque à droite => verrouiller)

mapper avec des images (photofiltre studio) 42842888

► maintenant, vous pourrez modifier quand vous voulez si vous faites une erreur ou si vous décidez de changer. un coup de gomme, et c'est reparti. Mais ce n'est pas la fonction la plus importante des calques. Si votre logiciel n'en a pas, inutile de continuer.

maintenant, utilisez le pinceau, réglé sur la deuxième forme de la première ligne (les choix de formes sont en dessous des outils de droite). Puis faites le tracé de la corde. Elle peut ne pas être courbée, personnellement je préfère comme sa ^^
pour tracer des traits droit sur photofiltre, cliquez quelque part avec le pinceau, appuyez et maintenez la touche maj et cliquez autre part. Les deux points seront reliés d'un trait droit.
Si vous l'accrochez à un mur, faites votre trait au dessus du mur. On fera une coupure plus nette juste après.
Vous trouverez que le trait est gros, surement mais il n'y a pas plus petit :/ ou alors il y a le pixel mais c'est pas super.

mapper avec des images (photofiltre studio) 87277639

► Comme dit juste avant, la copure sur le mur doit être nette. utilisez la gomme et gommez juste à la limite du mur. Si vous aviez commencé votre trait à coté, la ficelle paraîtrait décrochée.

mapper avec des images (photofiltre studio) 30200513

► la suite est simple à faire, mais pour l'expliquer, je risque de m'embrouiller moi même ^^
vous devez prendre la gomme, avec la la troisième forme de la première ligne. placez le cercle de façon à ce que le bas de celui-ci soit juste au niveau du bas de la corde. (regardez le screen vous comprendrez mieux)
cliquez une fois.

mapper avec des images (photofiltre studio) 66537959

► il faudra procéder par traits droit avec la touche maj. sinon, la gomme s'appliquera de trop et le trait disparaîtra. placez donc le pinceau un peut plus loin , maintenez maj puis appuyez. Ensuite c'est vous qui voyez. Si vous trouvez le trait trop fin ou trop épais, essayez autrement.

mapper avec des images (photofiltre studio) 79645743

► voici la ficelle finie (vous embêtez pas à faire bien aussi fin partout, ils avaient pas la ficelle bleue à l'époque c'était pas de la fine qualité ^^)

mapper avec des images (photofiltre studio) 83641372

► attaquons maintenant les drapeaux.
l'outil sélection (la flèche blanche à droite) a plusieurs options toutes sont utilisables pour les drapeaux.
Le screen à la fin contien des drapeau ovales pour donner un exemple.
Mais pour les formes diverses, ce qu'il faut, c'est l'option polygone (celui qui ressemble à rien avec des traits droits)
faites la forme voulue (moi j'ai fait un triangle :p)

mapper avec des images (photofiltre studio) 38933304

► puis clique droit => contours et remplissage. remplissez avec la couleur voulue, si possible prise du fond :
mon rouge vient du toit, mon vert vient de la fontaine, mon bleu des lampadaires et le doré de l'enseigne du magasin.
et le contour doit être de la même couleur que la ficelle (sa fait bizarre sinon)

mapper avec des images (photofiltre studio) 44209497

► et paf! sa fait un beau drapeau !

mapper avec des images (photofiltre studio) 76731486

► continuez ainsi sur le long de la ficelle.
Vient le moment des ombres. Dans le screen suivant, l'outil utilisé est visible à droite. l'outil gamma - rend l'image plus foncée et gamma +, plus clair. c'est avec sa que vous devrez jouer. Mais faites attention. si vous repassez deux fois au même endroit, sa amplifie l'effet.
ombrez ainsi les drapeaux en fonction de votre soleil et de votre image. un drapeau dans un sens sera forcement plus foncé qu'un dans un autre sens.

mapper avec des images (photofiltre studio) 26656722

► Il reste souvent encore des zones de couleur uniforme. (à moins que vos drapeau soient petit où que vous ayez ombré les 3 quarts)
ajoutez donc du bruit. (en quelques sortes, pixelisez l'image)
filtre => bruit => ajouter du bruit
réglez selon votre envie.

mapper avec des images (photofiltre studio) 70401711

► faites ainsi la map complète.
le bruit s'ajoute partout, il faudra alors soit entouré d'une sélection la dernière banderole avant de l'appliquer puis d'un refaire une, soit appliquer le bruit à la fin, soit même faire un calque par banderoles, cette solution étant la meilleure. (vous auriez aimer le faire avant? fallait tout lire avant de se lancer ^^)

Ensuite, étape finale sur photofiltre, cliquez droit sur le calque du fond puis rendez là invisible.
fusionnez ensuite tout les autres calques entre eux (clique droit sur le calque => fusionner avec le calque inférieur)

enregistrez votre image en .png pour avoir la transparence.
si vous voulez avoir la possibilité de modifier les calques plus tard, enregistrez en .pfi

mapper avec des images (photofiltre studio) 36074922

► retour sur RPG maker.
créez un évents sur la map concernée, appel de l'image n°1 (ou autre) coin haut gauche, X:0 Y:0
condition : processus parallèle.
sur les autres carte accessible depuis cette dernière, créez le même évènement pour afficher une autre image ou l'effacer, mais surtout, gardez toujours le même! sinon vous allez vous retrouver avec plusieurs images en même temps Wink

mapper avec des images (photofiltre studio) Villebanderolle

et voila! tuto fini Wink
Revenir en haut Aller en bas
hinola
Atome
Atome
hinola


Masculin Messages : 24
Date d'inscription : 22/07/2010

Caractéristiques du membre
Evolution: Atome
Job: mapping, graphisme, scénario
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyMer 4 Aoû 2010 - 8:46

voici la partie 2 !
vous inquiétez pas, les autres ne mettrons pas autant de temps à arriver normalement Wink

faire des éléments de décors, partie II : quelques retouches

pour commencer, je vais vous apprendre à faire un petit treillis
autant le dire tout de suite, on vas apprendre ensemble à le créer xD parce que j'avoue que le rendu est pas super, il me faudra l'améliorer, mais je le ferai vous inquiétez pas Wink Pour le moment, il vous donnera des idées et peut être que ce genre de treillis vous ira mieux qu'a moi.

donc pour commencer, il faut savoir que cette étape doit se faire en même temps que la précédente (il est temps que je le dise ^^)

pour commencer, votre "treillis" doit avoir un support. j'ai pris le petit poteau juste à gauche, je l'ai copier/collé et penché (clique droit sur le calque => transformation paramétrée)
faites le passer au dessus du toit.

mapper avec des images (photofiltre studio) 63427466

on ajoute ensuite le même poteau bout à bout jusque l'autre mur porteur.
Avec la modification de l'angle, le bout du poteau est flouté (le lissage du logiciel) et parais arrondit donc pas besoin de l'arrondir plus je pense.

une fois la poutre finie, gommez ce qui dépasse sur le toit

mapper avec des images (photofiltre studio) 52210266

utilisez l'outil polygone (le même que celui pour faire les triangles) et faites le tour du futur treillis

mapper avec des images (photofiltre studio) 68199441

créez une nouvelle image, blanche assez grosse (640*480 si possible)
et faites un quadrillage noir (filtre => divers => quadrillage)
paramétrez le comme il vous plaira. (gardez la couleur noire)

puis copier le, retournez sur l'image de la map, collez en tant que masque (édition => collage spécial => masque)
enfin, reprenez la sélection qui a disparue (le premier bouton à gauche du bouton de texte)

faites clique droit => inverser la sélection puis supprimez.
vous pouvez baisser l'opacité

mapper avec des images (photofiltre studio) 49542914

voila pour le treillis. je chercherai encore à l'améliorer.

deuxième idée : les reprises

vous voyez les égouts à gauche de la carte? On vas rendre ce coin un peut plus... je sais plus le mot ^^"

pour cela, on vas reprendre des éléments externes au tile actuel.
Moi, je vais même prendre des éléments de RM VX.

mapper avec des images (photofiltre studio) 12646918
mapper avec des images (photofiltre studio) 67551646

l'avantage avec les images, c'est que on peut mapper entre les carreaux. tant que le héros ne peut pas les atteindre (sinon, il passerait en dessous). Vous pouvez donc les placer comme bon vous semble...

mapper avec des images (photofiltre studio) 82640047

sur d'autres tiles...

mapper avec des images (photofiltre studio) 26928007

vous pouvez aussi donner des coups de gomme là où vous voulez...

mapper avec des images (photofiltre studio) 76199812

mapper avec des images (photofiltre studio) 64679138

j'avais créé plein d'autre images pour trois autres idées, mais c'est que des truc qu'il vaut mieux faire en tile donc bon...
Ze tuto tros bien créé
les retouches par images m'ont permise de faire beaucoup d'autres truc utiles (recolo, herbe sur les murs, tonneaux ouverts...) mais il vaut mieux ne pas les créer en image, sa pourrait causer des problème (personnage qui passe en dessous...). la version finale de ma map n'a aucun problème du genre mais vaut mieux quand même ne pas s'embêter a expliquer des truc qui marche pas à tout les coups ^^"

mapper avec des images (photofiltre studio) Ville

en bas à gauche, l'herbe n'est plus coupé nette sous le mur, en haut à droite, le stand est devenu bleu et enfin un tonneaux du centre c'est retrouvé ouvert. Tout sa en image.

Enfin pour conclure, c'est tout simplement de cette façon que j'ai obtenu cette foret:

mapper avec des images (photofiltre studio) Concours15

dont la carte, sans panorama et sans images ressemble à sa:

mapper avec des images (photofiltre studio) Limage
Revenir en haut Aller en bas
hinola
Atome
Atome
hinola


Masculin Messages : 24
Date d'inscription : 22/07/2010

Caractéristiques du membre
Evolution: Atome
Job: mapping, graphisme, scénario
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyMer 4 Aoû 2010 - 8:47

et voici la troisième partie: mapper avec un panorama

je vais maintenant vous montrer comment faire un sol en panorama de manière à obtenir une place surélevée.

pour commencer ce tutoriel, vous devrez préparer quatre images: (dans l'ordre du screen)
- le sol qui se trouvera en bas
- le sol qui se trouvera en haut
- la partie horizontale des marches
- la partie verticale des marches

ma partie verticale est la même que l'horizontale sauf que j'y ai fait un flou de mouvement de haut en bas (filtre => effet d'optique => flou de mouvement)
atténué ensuite à 50 % je crois (édition => atténuer flou de mouvement)
puis correction gamma - 2fois.

mapper avec des images (photofiltre studio) 84051103

ensuite, il nous faut une forme. La forme qu'aura les escaliers.
Créez la en noir sur une image de 480*640 de fond blanc.

mapper avec des images (photofiltre studio) 19394106

on ne vas pas faire une simple ligne...

mapper avec des images (photofiltre studio) 70512977

ne laissez pas de bords trop pointus sa fait bizarre après.

mapper avec des images (photofiltre studio) 63485421

ensuite, il faut faire les marches. (au moins une sinon c'est pas jolie)
mettez votre couleur principale blanche.
dupliquez votre image noire et blanche.
copier l'une d'elle puis collez là en tant que masque.
Déplacez le masque vers le haut. La bande noire est votre marche. Vous pouvez ainsi décider de sa taille.
fusionnez les calques.

Si vous voulez faire une nouvelle marche, copiez l'image , sélectionnez le noir en couleur principale et collez en tant que masque.
réglez en hauteur comme vous le souhaitez. le blanc entre les marche en sera leur hauteurs.
fusionnez les calques.

mapper avec des images (photofiltre studio) 94374299

Les hauteurs maintenant...
il y en a ici 3 (entre les marches + au dessus + au dessous)
dupliquez la dernière image.
copiez l'image et collez en tant que calque.
déplacez le calque vers le haut et alignez la marche du bas (du calque) avec celle du haut (du fond)
les deux doivent se superposer. (la distance de l'arc rouge du screen est donc à réduire)

NOTEZ que vous devrez utiliser cette technique aussi si vous voulez avoir plus de deux marches !

mapper avec des images (photofiltre studio) 71988139

si vous avez décidé de n'avoir qu'une marche, il faut faire la même chose mais uniquement en bas.
si vous voulez deux marches, il faut faire en haut et en bas.
si vous voulez trois marches, continuez vers le haut.

voici le rendu pour deux marches:

mapper avec des images (photofiltre studio) 13872485

fusionnez les calques.
passez maintenant en négatif (réglage => négatif)
vous pouvez maintenant voir en noir les hauteurs.

mapper avec des images (photofiltre studio) 59844310

au pinceau, peignez en blanc les grandes surfaces noires en haut et en bas.

mapper avec des images (photofiltre studio) 17929863

assemblez vos images comme il est dit plus bas.
(édition = > collage spécial => assembler le collage)

la première image noir et blanc (la forme) à gauche du sol haut
la deuxième image (les marches) à gauche du sol des marches
la troisième images (les hauteurs) à gauche de l'image des hauteurs

vous devriez avoir entre autre ces quatre images:

mapper avec des images (photofiltre studio) 191i

assemblez le tout:
(édition => collage spécial => image et masque associé)

collez de cette façon le sol haut
puis les marches
et enfin les hauteurs.

le rendu peut être final (l'étape suivante n'est pas obligatoire)

mapper avec des images (photofiltre studio) 192q

pour mieux démarquer les marches, reprenez l'image noir en blanche des hauteurs.
grâce à la baguette magique, sélectionnez le noir au centre (ce n'est pas grave si le contour n'est pas sélectionné)
puis clique droit => contour et remplissage.
contour noir, remplissage blanc, le tout en opacité 100 %

mapper avec des images (photofiltre studio) 193h

collez en tant que masque sur vos escaliers et baissez l'opacité (entre 10 et 20% suffisent)

mapper avec des images (photofiltre studio) 194

rendu très rapide in game:

mapper avec des images (photofiltre studio) 1rendu
Revenir en haut Aller en bas
Invité
Invité



mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyMer 4 Aoû 2010 - 14:29

Ouaw, sublime!! C'est vraiment magnifique!!
Revenir en haut Aller en bas
Garner
Garner


Masculin Messages : 742
Age : 31
Loisirs : RMXP forever, l'infographie et l'ecriture.
Date d'inscription : 15/09/2008

Caractéristiques du membre
Evolution: Atome
Job: Design, Scenar', Mapping, Test, Conseil, Pixel Art et Soutient.
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyMer 4 Aoû 2010 - 18:57

Enfin quelqu'un d'original, voilà enfin un membre sérieux, certes j'apprends rien, utilisant souvent Photofiltre Studio X aussi, j'ai même d'autre idée à proposer en tuto, et pourquoi pas mélanger nos idée.
Mais ça reste impressionnant de voir des gens sérieux, j'ai plus l'habitude...
Gros bravo et merci =).

Garner.
Revenir en haut Aller en bas
City Hunter
City Hunter


Grade : Lapin lvl 1
Masculin Messages : 1734
Date d'inscription : 12/07/2007

Caractéristiques du membre
Evolution: Animal
Job:
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue0/5mapper avec des images (photofiltre studio) Empty_bar_bleue  (0/5)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyJeu 5 Aoû 2010 - 16:38

Attention Garner a fait un compliment !!!! Razz

C'est que tu dois etre dans son coeur hinola !!! ^^

Je rigole Garner range cette hache... AHAHAHAHA *s'enfuit en courant*
Revenir en haut Aller en bas
http://mushroom-company.forumsactifs.net/
Isiniel
Molécule
Molécule
Isiniel


Féminin Messages : 85
Age : 30
Date d'inscription : 30/04/2010

Caractéristiques du membre
Evolution: Atome
Job: Scénario
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyJeu 5 Aoû 2010 - 20:24

Impressionnant Very Happy ! Ca à l'air si simple ainsi expliqué, que j'ai l'impression de pouvoir le faire aussi :3 ! Merci du tuto =D !
Revenir en haut Aller en bas
Afroman
Matière
Matière
Afroman


Masculin Messages : 185
Age : 30
Loisirs : S'occuper de ma coupe afro ^^
Date d'inscription : 22/11/2009

Caractéristiques du membre
Evolution: Atome
Job: Graphisme, scénario.
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyVen 20 Aoû 2010 - 8:34

J'adore l'idée de la partie trois.
On sent que tu as de l'experience et c'est génial :DD
Merci du partage!
Revenir en haut Aller en bas
https://www.facebook.com/
le6barbare
Atome
Atome
le6barbare


Messages : 5
Date d'inscription : 22/07/2010

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyVen 20 Aoû 2010 - 10:01

Technique sympa, ingénieuse !
Rendu vraiment bon !
Très bon tuto, bien expliquer... !

C'est du bon boulot, bravo et merci a toi pour ce tuto Wink
Revenir en haut Aller en bas
Jakylla
Molécule
Molécule
Jakylla


Masculin Messages : 64
Age : 30
Date d'inscription : 22/12/2008

Caractéristiques du membre
Evolution: Atome
Job:
XP:
mapper avec des images (photofiltre studio) Left_bar_bleue20/20mapper avec des images (photofiltre studio) Empty_bar_bleue  (20/20)

mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) EmptyVen 20 Aoû 2010 - 14:56

Joli, très bon tuto aussi.

Mais... (Je suis ennervant mais...) Il n'y a pas de problèmes d'apparence quand par exemple un event ou le héros se trouve sur une partie arrondie ?
Revenir en haut Aller en bas
http://jdr-naheulbeuk.forumactif.org
Contenu sponsorisé



mapper avec des images (photofiltre studio) Empty
MessageSujet: Re: mapper avec des images (photofiltre studio)   mapper avec des images (photofiltre studio) Empty

Revenir en haut Aller en bas
 

mapper avec des images (photofiltre studio)

Voir le sujet précédent Voir le sujet suivant Revenir en haut 

 Sujets similaires

-
» Créer une table avec Photofiltre studio
» Photofiltre Studio X : I Les outils
» Battler costum avec photofiltre
» Créer une Map Monde avec Photofiltre
» Comment decoupé avec Gimp et photofiltre
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Zarok RPG Maker :: 

 :: TUTORIELS :: Tutoriels de graphisme
-
Sauter vers: