11 risposte a questa discussione

[gabrix90]

Tutorial Parallax Mapping

Di Gabrix90

Benvenuti al mio primo vero e proprio intervento sul forum.
Quello che mi appresto a scrivere è un tutorial su come si realizza una mappa di parallasse basilare su RmVX.

Occorrente:

Rpg Maker VX

Programma di fotoritocco (Consiglio Photoshop, poichè nel video è utilizzato questo, nella sua versione CS2)

Tileset (Nel video ho utilizzato i tileset che potete trovare a questo indirizzohttp://rpgmkr.net/forum/topic1858.html)

Tanta Pazienza.

Prerequisiti ed introduzione:

Per affrontare questo tutorial in maniera soddisfacente, bisogna innanzitutto sapere alcune cose basilari:

- Come si utilizzano i Parallax in RMVX
- Che cosa sono i Parallax
- Come si utilizzano le funzioni di Photoshop descritte nel video.

[*:1d0a8zcc]Per utilizzare i Parallax in RMVX, basta importarli nella cartella Graphic/Parallaxes, ed impostarli nelle proprietà della mappa, stando attenti a spuntare mostra nell'editor.



L'immagine mostra quale tile bisogna utilizzare per mostrare il Parallax.

[*:1d0a8zcc]I Parallax non sono altro che immagini utilizzate per fare da sfondo alle mappe, in questo caso noi utilizzeremo gli sfondi stessi come mappa, con qualche piccolo accorgimento.

[*:1d0a8zcc]Le funzioni di photoshop che utilizzo nel video, sono: Copia/Incolla ; Selezione rettangolare ; Pennello ; Timbro Clone ; Sposta ; Opzioni di fusione ; Livelli ; Cerotto (Opzionale) ;

[*:1d0a8zcc]- Copia / Incolla: rispettivamente si utilizzano con le scorciatoie da tastiera Ctrl + C / Ctrl + V
[*:1d0a8zcc]- Selezione rettangolare: da tastiera M
[*:1d0a8zcc]- Pennello: da Tastiera B
[*:1d0a8zcc]- Timbro Clone: da Tastiera S, si utilizza impostando l'immagine da clonare con Alt + Click, facendone poi un utilizzo uguale al normale pennello.
[*:1d0a8zcc]- Sposta: Sposta gli elementi del livello selezionato (da Tastiera V)
[*:1d0a8zcc]- Opzioni di fusione: si attivano mediante click destro sul livello desiderato -> Opzioni di Fusione, servono per aggiungere effetti ed ombre agli elementi del livello selezionato.
[*:1d0a8zcc]- Livelli: Il cuore del Parallax Mapping. Servono per creare una "Stratificazione dell'immagine", facendo in modo che qualsiasi errore sia reversibile, e permettendoci di non "Sporcare" gli strati superiori e di modificare gli strati inferiori senza deformarli.
[*:1d0a8zcc]- Cerotto: Un piccolo aiuto per risolvere gli errori nel disegno.

Fatte le premesse, mi accingo a porvi il link del tutorial, sperando che sia di aiuto a molti.
Accetto critiche, commenti, ma non interventi inutili.

Tutorial Video

Qtrf56XD8lo

Link:
http://youtu.be/Qtrf56XD8lo?hd=1

Tutorial Parte Seconda

La parte numero due di questo tutorial serve a capire come fare per creare le parti della mappa che normalmente sono contrassegnate con il simbolo " * " nella passabilità di RMVX.
Normalmente basterebbe settare la passabilità, appunto, a " * " .
Naturalmente, essendo le mappe di parallax piatte per loro natura (essendo costituite da una immagine piatta), settarne la passabilità non basterà a risolvere il problema.

Esistono due tecniche principali per ovviare a questo:

1) Tecnica dell'eventing
2) Tecnica delle fog

N°1: Eventing

La tecnica dell'eventing, consiste nel piazzare un evento per ogni singola parte della mappa che rimarrà sopra la testa dell'eroe ( ad esempio se si passa dietro ad un albero, questo oscurerà in parte o totalmente l'eroe ).
Facciamo un esempio pratico:


Vogliamo aggiungere due alberi a questa mappa.

Possiamo fare in due modi: tramite eventi e tramite tileset.
Nel primo caso possiamo aggiungere alberi di qualsiasi dimensione, che devono però essere compresi in un character sheet, esempio:


Nel secondo caso, utilizzeremo i normali tilesets per avere degli alberi semplici ed efficaci:

N°2: MultiFog

Il secondo metodo, è quello che preferisco, ma anche il più lungo e difficile.

Quando siete pronti a bruciare un pò di neuroni, a me gli occhi :D

Se avete visto il video, cosa indispensabile per seguire la seconda parte, vi ricorderete di quando vi ho detto " Mi raccomando, salvate due file, uno in PNG ed uno in PSD, in modo da poterlo riutilizzare successivamente ".

ed infatti adesso andremo ad aprire proprio il nostro file PSD.


Ci ritroviamo davanti la nostra bella mappa, con tutti i suoi bellissimi livelli.



Se osserviamo bene, ci saranno degli elementi che vogliamo passino sopra la testa del giocatore, nel caso dello screen, i pali della luce, la luce, le ombre davanti al palazzo.

Bene.

Iniziamo a guardare a quali livelli appartengono le cose che abbiamo citato prima.
Se osservate attentamente, vicino ad ogni livello c'è l'immagine di un occhio che basterà premere per nascondere o mostrare un livello.
Nascondiamo, dapprima tutti i livelli delle cose che abbiamo citato.



Il risultato, come si può vedere, è la mappa senza le cose che abbiamo detto.
Salviamo la mappa senza questi livelli in formato png, nella cartella parallaxes del nostro gioco, ed impostiamola come parallax della nostra mappa.

Adesso abbiamo una bella mappa spoglia di tutto.

Ciò che andremo a fare ora, è riattivare i livelli degli oggetti che prima avevamo tolto, e disattivare tutto il resto, in questo modo:



Adesso non ci resta che salvare anche questa immagine come PNG nella cartella parallaxes, chiamandola con un nome semplice per poi utilizzarla facilmente nello script.

Esattamente, quello di cui avete bisogno è uno script, esattamente lo script "Simple Fog" creato da Miget Man 12 di Rpgmakervx.net, che posterò qui di seguito:

Spoiler

#==============================================================================
# Miget man12's Relatively Simple Fogs V 1.5
#
#  This script takes a different approach to fogs. Instead of having you enter
# a script call to make a fog appear, it will draw a different fog every time
# you transfer. In other words, each map has it's own fog that is automatically
# drawn. Version 1.5 allows you to have multiple fogs!
#-----------------------------------------------------------------------------
#Methods you can use::
# To pause a Fog, put a script command:
#  $game_map.fog_frozen[id] = true
#
# To change the Opacity of fog while in a map, put:
#  $game_map.fog[id].opacity = (0~255)
#
# To change the Blend of fog while in a map, put:
#  $game_map.fog[id].blend_type = 0, 1, or 2 (normal, additive, or subtractive)
#
# To change the X movement speed of fog while in a map, put:
#  $game_map.fog[id].sx = number (e.g.: 0.02, 348, 20.7 :P)
#
# To change the Y movement speed of fog while in a map, put:
#  $game_map.fog[id].sy = number (e.g.: 0.4, 4731, 48.29)
#
# To change the Zoom of fog while in a map, put:
#  $game_map.fog_zoom[id] = number (e.g.: 0.1, 674, 381.594)
#
# To change the Filename of a fog while in a map, put:
#  $game_map.fog_filename[id] = "filename" (in quotes!)
#
# To create a Fog in a map that does not have a preset fog or change the fog, 
# put:
#  $game_map.setup_fog(See Fog Data Setup)
# Example::
#  $game_map.setup_fog(["BlueSky",95,2,1.5,4,2])
#==============================================================================
module Mm12
  #Customization::
  MAP_FOGS = {} # DO NOT DELETE OR CHANGE THIS! #
#Instructions::
# To set up, put
# MAP_FOGS[map ID]=["fog filename",fog opacity(0~255),
# blend type(0:norm,1:add,2:sub),zoom level(1 is normal), 
# move speed on X Axis(1/8 pixel/frame),move speed on Y Axis(1/8 pixel / frame)]
# Example:
#  MAP_FOGS[1] = ["BlueSky",125,0,2,0,0]
#   Explanation:
#    MAP001 will have a fog with the BlueSky parallax with 125 opacity that has
#   normal blend. It will be twice as big as the real file, and no movement.
#  MAP_FOGS[2] = ["BlueSky",95,2,1.5,4,2]
#   Explanation:
#    MAP002 will have a fog with the BlueSky parallax with 95 opacity that has
#   Sub. blend. It will be 1 1/2 times as big as the real file. It will move 1/2
#   a pixel right every frame, and 1/4 a pixel down every frame.
#(V1.5)
# To have more than one fog per map, just put 2 fogs in brackets, seperated by 
# commas:
#  MAP_FOGS[3] = [["CloudySky",45,0,1.3,2,0],["BlueSky",45,2,1.5,3,5]]
################
# Actual Setup::
  MAP_FOGS[1] = ["BlueSky",165,0,2,0,0]
  MAP_FOGS[2] = ["BlueSky",145,2,1.5,4,2]
  MAP_FOGS[3] = [["CloudySky",75,0,1.3,2,0],["BlueSky",65,2,1.5,3,5]]
# Folder where fogs reside
  FOGS_FOLDER = "Parallaxes"
end
module Cache
  #--------------------------------------------------------------------------
  # * Get System Graphic
  #     filename : Filename
  #--------------------------------------------------------------------------
  def self.fog(filename)
    load_bitmap("Graphics/#{Mm12::FOGS_FOLDER}/", filename) rescue Bitmap.new(200,200)
  end
end
class Game_Map
  attr_accessor :fog, :fog_frozen, :fog_hidden, :fog_opacity, :fog_ox, :fog_oy,
      :fog_zoom, :fog_filename
  alias mm12_fog_gm_mp_setup setup
  alias mm12_fog_gm_mp_update update
  alias mm12_fog_gm_mp_init initialize
  def initialize
    mm12_fog_gm_mp_init
    @fogox = Array.new(9999,0)
    @fogoy = Array.new(9999,0)
    @fog_ox = []
    @fog_oy = []
    @fog = []
    @filename = []
    @fog_filename = []
    @fog_zoom = []
    @fog_hidden = []
    @fog_frozen = Array.new(9999,false)
  end
  def setup(map_id)
    mm12_fog_gm_mp_setup(map_id)
    setup_fog
  end
  def setup_fog(fog_data=nil)
    for i in 0..(@fog.size-1)
      if @fog_hidden[i]
        @fog[i].opacity = @fog_opacity
        @fog_hidden[i] = false
        return
      end
      @fog[i].dispose unless @fog[i] == nil
      @fog[i] = nil
    end
    @fog = []
    if fog_data == nil
      fog_data = Mm12::MAP_FOGS[@map_id]
      if fog_data.nil?
        @fog_used = false
        return
      end
      if !fog_data[0].is_a?(Array)
        fog_data = [fog_data]
      end
      i = 0
      for data in fog_data
        @fog[i] = Plane.new
        @fog[i].ox=0
        @fog[i].oy=0
        @fog[i].ox = @fog_ox[i] unless @fog_ox[i].nil?
        @fog[i].oy = @fog_oy[i] unless @fog_oy[i].nil?
        @fog_ox[i] = nil
        @fog_oy[i] = nil
        @fog[i].bitmap = Cache.fog(data[0])
        @fog[i].z = 30
        @fog[i].opacity = data[1]
        @fog[i].blend_type = data[2]
        @fog[i].zoom_x = data[3]
        @fog[i].zoom_y = data[3]
        @fog_zoom[i] = data[3]
        @fog[i].sx = data[4]#.to_f
        @fog[i].sy = data[5]#.to_f
        @filename[i] = data[0]
        @fog_filename[i] = data[0]
        i += 1
      end
    else
      if !fog_data[0].is_a?(Array)
        fog_data = [fog_data]
      end
      i = 0
      for data in fog_data
        @fog_used = true
        @fog[i] = Plane.new
        @fog[i].bitmap = Cache.fog(data[0])
        @fog[i].opacity = data[1]
        @fog[i].blend_type = data[2]
        @fog[i].zoom_x = data[3]
        @fog[i].zoom_y = data[3]
        @fog_zoom[i] = data[3]
        @fog[i].sx = data[4]
        @fog[i].sy = data[5]
        @filename[i] = data[0]
        @fog_filename[i] = data[0]
        i += 1
      end
    end
  end
  def update
    mm12_fog_gm_mp_update
    for i in 0..(@fog.size-1)
      return if @fog[i].nil?
      @fog[i].zoom_x = @fog[i].zoom_y = @fog_zoom[i] if @fog[i].zoom_x != @fog_zoom[i]
      if @fog_filename[i] != @filename[i]
        @filename[i] = @fog_filename[i]
        @fog[i].bitmap = Cache.fog(@filename)
      end
      if @fog_frozen[i]
        @fog[i].ox = ($game_map.display_x/8.0)+@fogox[i] unless @fog[i].nil?# or @fog_frozen or @fog.ox == ($game_map.display_y/8.0)+(@fog.sx/8.0)
      else
        @fogox[i] -= @fog[i].sx/8.0 unless @fogox[i].nil?
        @fog[i].ox = ($game_map.display_x/8.0)+@fogox[i] unless @fog[i].nil?# or @fog_frozen or @fog.ox == ($game_map.display_y/8.0)+(@fog.sx/8.0)
      end
      if @fog_frozen[i]
        @fog[i].oy = ($game_map.display_y/8.0)+@fogoy[i] unless @fog[i].nil?# or @fog_frozen or @fog.oy == ($game_map.display_y/8.0)+(@fog.sy/8.0)
      else
        @fogoy[i] -= @fog[i].sy/8.0 unless @fogoy[i].nil?
        @fog[i].oy = ($game_map.display_y/8.0)+@fogoy[i] unless @fog[i].nil?# or @fog_frozen or @fog.oy == ($game_map.display_y/8.0)+(@fog.sy/8.0)
      end
    end
  end
end
class Scene_Map
  alias mm12_fog_scn_mp_terminate terminate
  alias mm12_fog_scn_mp_start start
  def start
    mm12_fog_scn_mp_start
    $game_map.setup_fog
  end
  def terminate
    mm12_fog_scn_mp_terminate
    for i in 0..9999
      next if $game_map.fog[i].nil?
      $game_map.fog_ox[i] = $game_map.fog[i].ox
      $game_map.fog_oy[i] = $game_map.fog[i].oy
      $game_map.fog[i].dispose unless $game_map.fog[i].nil?
      $game_map.fog[i] = nil
    end
  end
end
class Plane
  attr_accessor :sx, :sy
end

Copiate lo script, entrate nello script editor di RMVX, create uno nuovo script, chiamatelo Multi_Fog, e copiateci dentro ciò che c'è nello spoiler.

Fatto questo, sempre dallo script editor, vedrete queste linee:

 
MAP_FOGS[2] = ["tetto casa",255,0,1.0,0,0]
MAP_FOGS[4] = [["al1",255,0,1.0,0,0],["al2",255,0,1.0,0,0],["al3",255,0,1.0,0,0],["al4",255,0,1.0,0,0],["al5",255,0,1.0,0,0,],["BlueSky",35,0,1.0,2,1]] # Folder where fogs reside 
FOGS_FOLDER = "Parallaxes"

dove vedete scritto MAP_FOGS[numero] , inserite il numero di ID della vostra mappa che potete trovare nel menù "Proprietà della Mappa", poi dove vedete = ["nomeimmagine",255,0,1.0,0,0] dove al posto di "nomeimmagine" dovrete inserire il nome della vostra immagine, quella con le ombre, i pali della luce ecc..., lasciando i valori invariati.

MAP_FOGS[numero] = ["nomeimmagine",255,0,1.0,0,0]

Se avete un solo livello da ggiungere come fog, altrimenti, dovete mettere la doppia parentesi quadra dopo l'uguale, esempio:

MAP_FOGS[numero] = [["nomeimmagine1",255,0,1.0,0,0],["nomeimmagine2",255,0,1.0,0,0]]

Se avete due immagini o più.

Se avrete eseguito tutto correttamente, vi ritroverete all'interno della vostra mappa, con le ombre, le luci, i pali ecc.... che passano sopra la testa del vostro personaggio, dando un effetto molto più realistico al vostro game.

Spero di essere stato chiaro, naturalmente sono disponibile per eventuali chiarimenti, e sono curioso di vedere cosa siete in grado di fare grazie al tutorial, per cui chi ne ha voglia può postare lo screen delle mappe create con questo metodo sotto al post.

Grazie a tutti dei "Grazie" ricevuti, buon making,

A presto,

Gabrix90

[Ally]

Ho aggiustato un pò i tag del post

Un grazie è il minimo per un tutorial davvero utile e che fa gola a molti ^^
Se riesci a inserire il video su Youtube, potremmo inserirlo direttamente nel post :)

Grazie del contributo!

[Juunanagou]

Sento l'audio ma non vedo il video °>°

[gabrix90]

@Ally: Grazie dei tag, sono un pò nabbo di forum e html. Potrei dividerlo in due parti per postarlo su youtube.
@Juunanagou: Al più presto lo metterò su youtube, magari li riuscirai a vederlo.

EDIT: Ho controllato il mio account you tube e mi hanno dato la possibilità di caricare video di qualsiasi durata, quindi appena finisco l'upload posto l'Embed nel primo post.

[Ally]

Quando inserisci il video puoi usare il bbcode youtube ;)

[gabrix90]

Tutorial aggiornato con la seconda parte, ENJOY ^^

[herupty]

complimenti davvero, il tutorial è interessante (sto anche provando) e devo dire che l'effetto è davvero bello
grazie x l'aiuto k dai a tutti

[Ally]

Primo tutorial completo (che vedo e sono felice che sia qui) e chiaro su questa tecnica, con possibilità di visualizzarne pure il video..Bravo :)

[Liold]

Allora innanzitutto complimenti per la guida, davvero ottima e ben fatta.
Ma ora passiamo alla mia niubbaggine
In pratica avrei un piccolo e stupido problema xD Alla fine del video-tutorial, spieghi come fare per cancellare i primi due quadratini del tileE così da poter settare dove il pg può passare e dove no.
Ora il mio problema è questo: seguendo il percorso (C:\Program Files\Common Files\Enterbrain ecc.) trovo una sola cartella, ovvero quella dell'RGSS di rpg xp... ma a me serve quella del vx! XD insomma, in poche parole non trovo la cartella rgss2, e la cosa mi sembra parecchio strana @_@ apparentemente è un problema stupidissimo, ma io ci sto perdendo la testa, e non so proprio dove cercarla (ho già messo nel tasto cerca: 'RGSS2', ma non trova un tubo).

Grazie anticipatamente per eventuali risposte :D

[gabrix90]

Hai gli RTP del VX installati? se non li hai non ti dovrebbe funzionare VX, se invece li hai ma non li trovi, eccoti un bellissimo tile E gia modificato da scaricare:



Mettilo nella cartella System del tuo progetto, lasciandogli Tile E come nome ^^.

[Liold]

Sìsì rpg maker vx funziona, il problema è che non trovo la cartella nel percorso da te indicato (strano però è così).
Comunque grazie, con il tuo aiuto ho risolto rapidamente ^^ (poco prima che rispondevi, stavo optando per esportare il tileE dal menager delle risorse, modificarlo e poi metterlo nella cartella system xD lo scrivo in caso serva a qualcuno, ma immagino che solo io posso avere sti problemi nabbeschi )
Grazie mille ancora :)

[Ally]

Quando si installa RPG Maker (Xp o VX), prima si installano le RTP e poi il programma.
Quando installi il programma ti chiede il percorso di installazione, che normalmente in automatico è la cartella programmi.
Per le RTP invece ti crea automaticamente il percorso common file.
Se non li hai in quella cartella, controlla nel percorso di installazione ^^