Mundo Maker
¡Bienvenid@ a Mundo Maker!

¿Quieres aprender todo sobre el RPG Maker?



Regístrate y forma parte de Mundo Maker.
Conectarse

Recuperar mi contraseña

Temas importantes
----------------------------------------
Páginas con recursos RPG Maker
----------------------------------------
----------------------------------------
----------------------------------------
----------------------------------------
----------------------------------------
----------------------------------------
----------------------------------------
----------------------------------------
----------------------------------------
Afiliados
Estadísticas
Tenemos 3819 miembros registrados.
El último usuario registrado es MaikelNox.

Nuestros miembros han publicado un total de 86273 mensajes en 12298 argumentos.

[Tutorial] Haciendo un Backdrop

Ver el tema anterior Ver el tema siguiente Ir abajo

RPG Maker 2000 [Tutorial] Haciendo un Backdrop

Mensaje por Wecoc el 2014-06-17, 11:43

Voy a explicaros cómo hago los backdrops por pasos, para que lo intentéis. Aunque asusta, no es tan difícil porque no loopean ni nada de eso así que es como hacer un cuadro pequeño xD

*cabecera imaginaria*

Algunos battlebacks requieren cierta imaginación extra pero la mayoría son puramente paisajísticos y eso nos permite aplicar truquillos.
Yo guardo siempre muy a menudo, y para éste tipo de cosas hasta voy guardando por partes (como hice para éste tutorial) o bien con un formato que conserve las capas.

CONCEPTO (SKETCH)

El sketch es importante hacerlo bien porque de él depende toda nuestra obra. Además cuando más trabajemos esto que es más rápido e intuitivo en general menos nos costará luego hacer el acabado a pixelart.



El primer paso es muy sencillo, un simio relativamente adiestrado podría hacerlo. Lo que tenéis que hacer es pensar en vuestro paisaje por planos, pensar en el color principal de ése plano (más o menos) y ponerlos por proximidad. Lo que estamos fijando aquí en cierto modo es la profundidad.

En mi ejemplo de abajo hacia arriba es; tierra; hierba, matojos delante, matojos medio, matojos o árboles del fondo, montañas delante, montañas detrás y cielo con nubes (lo cual es bastante típico todo, es lo que tienen los ejemplos xD)

La profundidad también se tiene que notar con el color y el nivel de detalle de cada cosa (de momento solo con el color).



Después de esto hay que variar cada una de las líneas para que en vez de ser totalmente plana siga la forma que tenemos pensada (podemos improvisar un poco). Atención: No se hace ahí con mucho detalle, es un boceto inicial, no uso el lápiz a 1px sino a 2px o a 3px sin problemas. Parece una tontería pero así se va mucho más rápido.



Ahora ya empieza lo bueno, pero no os creáis que es muy complicado, tan solo hay que empezar a idear mucho mejor la paleta. Ahora viene el juego de luces y sombras. IMPORTANTE mantener el foco de luz siempre del mismo lado (excepto casos especiales que no vienen al caso). Puse piedras porque me pareció un buen detalle. Es muy importante que no quede vacío el battleback o no se verá profesional, pero también que no se vea sobrecargado porque luego no se distinguirían los monstruos y no habría espacio para los battlers de éstos. Por eso puse las piedras a los lados, para que el centro quede libre para los enemigos.



Dos cosas más para el siguiente paso; árboles y más luces y sombras. Las primeras luces y sombras eran para dar un poco de enfoque, éstos ya tienen más función; la hierba queda por encima de la tierra y por eso provoca sombra en ésta, le di cierta altura con esto. Solo con éstos juegos la parte de abajo ya se ve mucho mejor que antes. Para los árboles pues bueno, solo intenté no hacerles formas demasiado raras para que quedaran más realistas. Poner árboles y éste tipo de cosas ayuda a hacerse una mejor idea de las proporciones a las que estamos trabajando. Además un detalle es que el punto de fuga es al nivel del horizonte, y las copas de los árboles quedan por encima, por lo tanto cuando más atrás estén más bajos se verán en comparación (lo cual es lógico pero conviene refrescarlo xD)



Y como punto culminante del sketch (o boceto) de nuestro fabuloso battleback: Luces, sombras y contraluces en los árboles, siguiendo el mismo foco de luz que antes. Las contraluces son para destacar más los árboles del fondo y darles un toque más atractivo (es eso gris xD), y la importante copa de los árboles también con contraluz. Sabréis por los tutoriales de pixelart que habréis leído que hay mil maneras de hacer un árbol. Mientras os quede bien, y coherente con el resto, me la pela qué estilo uséis, todos van bien.

TÉCNICA (PIXELART)

El pixelart es la parte en la que más tiempo tendréis que dedicar. Es bueno ir por partes; hacer completamente un árbol, luego otro, luego... Porque si intentas hacerlo todo a la vez un poquito aquí un poquito allí acabas lerdo. Como veréis a continuación empecé con los árboles y posteriormente con las rocas, y pulí el suelo y las montañas.



Así me quedó. No me quedó perfecto, y a vosotros las primeras veces tampoco os quedará perfecto (a no ser que seáis Orochii) pero siempre se puede pulir más adelante, especialmente si lo guardáis a trozos o por capas. Hasta el momento no era muy importante trabajar con capas pero ahora con el pixelart es altamente recomendable.



Finalmente añadí detalles como las flores y acabé de perfilar la hierba (la dejé para el final porque reconozco que me asustaba un poco pero no es tan difícil de hacer como parece)

Como ultimísimo punto se puede hacer reducción de la paleta a mano aunque es totalmente opcional. Para ello hay que indexar la paleta a 256 colores (normalmente tendréis muchos menos, en mi caso hay solo 37) y luego vais cambiando los que sean muy parecidos (a no ser que sean imprescindibles separadamente para el detalle) o se pueden buscar los colores que se hayan usado solo en muy pocos píxeles substituyendo momentáneamente cada uno de éstos por negro o blanco y mirando qué cambia.

Resultado Final:



Y ahora a liarla. Y puede que algún día haga otro ejemplo si me da por ahí.
avatar
Wecoc
Administrador
Administrador



Créditos 12104

Gracias : 522

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por xX Kyubey el 2014-06-17, 12:52

Wow, que buen tutorial, si es así de fácil entonces he cometido un par de errores en mi proceso ( ¿¡qué proceso!? Boceto cutre, borrar, boceto extra-cutre, outline, colores random, sombras cutres, borrar todo, repetir), pero en fin, gracias por compartir tu conocimiento.
avatar
xX Kyubey
Principiante
Principiante

0/3

Créditos 266

Gracias : 54

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Kibuy el 2014-06-17, 12:56

Que no queda perfecto dice...
¡Pues a mi el ejemplo como resultado final me parece buenísimo!

No me preguntes porque pero me ha venido una nostalgia del juego de Loom de LucasArts....

La verdad es que al principio si me parecía fácil, pero cuando se ha empezado con las luces y los focos me he asustado.
La asignatura de dibujo la tengo suspensa desde hace tiempo xDD

No obstante, reconozco que ha sido un tutorial bastante bueno :)
avatar
Kibuy
Iniciado
Iniciado

0/3

Créditos 30

Gracias : 5

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Ledai el 2014-06-17, 18:40

Me inspiró tu tutorial y esto es lo que salio; está sin terminar, ya no sé cómo seguirlo.



Úsalo si te sirve para lo de ese proyecto Easy si no pues algún día lo acabaré yo...
avatar
Ledai
Aventurero
Aventurero

0/3

Créditos 3985

Gracias : 181

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Wecoc el 2014-06-18, 18:44

Kyubey: A todos nos ha pasado eso alguna vez :(
Kibuy: Todo es intentarlo y practicar un poco.

(Voy a confundir vuestros nicks más de una vez, seguro xD)

Leda: Esas montañas y el cielo estan espectaculares :D Creo que deberías acabarlo tú (al fin y al cabo tú también puedes subirlo al Easy xD). Los árboles se ven un poco raros, como cortados; tienen que verse más individualizados los de más adelante al menos. Y luego pues para el suelo y el agua, sorpréndeme (?)

Aún así como en el mío no había agua daré algún consejo para hacer el agua xD
El agua para los backgrouns yo creo que va bien mirarla como tres capas superpuestas; la del fondo que es puro pixelart normal, la de las olas superficiales que tendrán una forma casi geométrica por encima y la de los reflejos. En éste caso se podría reflejar perfectamente la montaña ahí. El problema de éste último es que si se refleja algo queda mal que el enemigo no se refleje, y aún peor que lo de detrás se refleje por debajo del sprite, así que esa tercera capa yo recomiendo no ponerla o hacerla MUY sutil (solo reflejar lo más cercano al borde).



- Empezamos por el fondo, dibujando las líneas como en el primer punto del tutorial, aunque en éste caso lo puse curvo para dar un efecto pez, al dibujar agua suele ser efectivo ésto.

- Luego pixelamos los bordes de cada línea, cada uno lo haga como quiera yo hice un efecto como de ola así ( y creo que es lo que mejor queda en éste caso, pero tampoco soy quién para decirlo xD

- Luego en otra capa hacemos las olas. No tiene ningún secreto, es ir dibujando algo parecido a redondas de distintos tamaños, se puede repetir cada cierto tiempo si se quiere porque aunque no requiere mucho conocimiento sí requiere esfuerzo (se te acaba cansando el brazo xDD)

- Superponemos las dos cosas.

- Yo lo que hago es seguir el color del fondo en las olas de modo que sobresalten con al menos un color más claro que el del fondo en ese punto pero sin sobresaltar tanto como en el punto anterior. Es un cambio de color por zonas, con la herramiento de Remplazar color se hace en un periquete.

- Pero hacer eso rompe un poco el efecto de ola así que hay que recuperar en las partes más gruesas el color más claro. También añadí una línea de borde de agua. ¡Y TACHÁN! ¡Listo!


Obviamente hay otras maneras de hacer esa agua xD

Puedes continuar desde aquí o intentarlo tú, como quieras.

Hay battlebacks que te rompen los esquemas totalmente.
Haré otro ejemplo con uno de éstos más adelante.
avatar
Wecoc
Administrador
Administrador



Créditos 12104

Gracias : 522

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Trequiell el 2014-06-18, 19:04

Muy bueno el tutorial Wecoc. Y tengo que decir que las montañas del último ejemplo me han cautivado.
Una pasada!!.
avatar
Trequiell
Soñador
Soñador

0/3

Créditos 138

Gracias : 21

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Ledai el 2014-06-18, 20:03

Ya tengo los arboles:
Intenté hacerlo como decías, y ahora han quedado mucho mejor

Por lo del agua... HUFF... me da miedo ponerme a hacerla; parece super-complicada XDD
Mejor me quedo con la que hiciste... Hummm... o no sé, puede que lo intente, otro día.... lejano

Por ahora dejo los arboles, están hechos con dos colores nada más por ahora en tonos, solo que no sé si la paleta que usé es la adecuada.



Ya intentaré hacer el agua a mi entender ^_^

Ah! y Muchas GRACIAS Wecoc por tus halagos, me animan mucho viniendo de alguien con tu talento

Pd: Donde estaba el tema del Easy???

Edit:
Qué tal quedó??
avatar
Ledai
Aventurero
Aventurero

0/3

Créditos 3985

Gracias : 181

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Wecoc el 2014-06-18, 23:20

El link al post de Easy RPG: Battlers y Battlebacks para Easy RPG

Ya veo, ese suelo se te resiste. El dithering es la clave. Ah y me gustaban más a dos colores los árboles xD



Si alguien quiere probarlo también, le daré consejos.

Por cierto, me gusta mucho la paleta que usaste xDD Yo no habría usado esa ni de lejos, y pues eso, que me gusta cómo queda xD

Spoiler:
Yo habría usado algo más así, si me permites un recolor:

avatar
Wecoc
Administrador
Administrador



Créditos 12104

Gracias : 522

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Ledai el 2014-06-18, 23:48

No sé hacer eso (dithering)... pónme un ejercicio de ensayo sencillito para que aprenda XDDD (Como aquel de las esferas de distintas texturas)

En realidad los arboles también me gustan más con solo dos colores; lo hice por probar, pero están mejor así.

Está quedando de Lujo >.< ¡¡¡VIVA!!!

Por cierto, ¿A qué te refieres con que no hubieras usado esa paleta, tiene algo raro? Tal vez no pegan los verdes con la montaña o algo de eso... Bueno, por lo menos me alegra que te guste.
Respondido por MP

Lo subiré al Tema del Easy cuando le des el visto bueno XDD.

PD: Dejo la referencia que usé para hacerlo.
http://www.forodefotos.com/attachments/fotos-de-montanas/18587d1300678568-fondo-de-pantalla-de-montana-fondos-de-pantalla-montanas-nevado.jpg


Última edición por Leda el 2014-06-19, 19:27, editado 1 vez
avatar
Ledai
Aventurero
Aventurero

0/3

Créditos 3985

Gracias : 181

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por orochii el 2014-06-19, 04:37

Yo supongo que se refiere a que no la hubiera usado nada más, no que no le guste. A mí también me gusta, porque me encanta ese juego de azules con colores amarillos. El cielo se ve genial, como de un tipo verano, o... ¿otoño...? No sé, aquí no hay ninguno xD.
avatar
orochii
Reportero

0/3

Créditos 7470

Gracias : 369

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Wecoc el 2014-07-06, 22:31

Sí, lo que dijo Orochii.

-----

Quería hacer otro ejemplo, el del caso en el que todo lo explicado se "tuerce", pero el dithering me mató y no podré terminarlo. El dithering siempre me sale bastante mal, por eso prefiero no usarlo, pero en algunos casos (como éste) es inevitable hacerlo. Puede parecer una parte sencilla dentro de lo que es el pixelart pero a grande escala es lo más tedioso de hacer.

Y es que algunos battlebacks os haran la vida imposible y nada de lo que expliqué en éste tutorial os servirá, pero hay que tener objetividad.

Si el battleback no es un paisaje con un horizonte definido, lo de empezar con esas líneas paralelas ya no podréis hacerlo, tendrés que hacer líneas que se adapten a las partes de backdrop que se tiene en mente.

En mi caso hice ésto



y justo después ésto casi como mismo paso



Después de eso, como dije en el tutorial, aplicamos luz, pero en algunos casos como en el de éste nuevo ejemplo hasta eso puede ser complicado. La lava no es como el agua, es mucho más espesa, menos líquida y menos uniforme, y a veces incluso hace burbujas (hay muchos tipos, claro), no hace reflejos ni permite ver el fondo. Pero sus diferencias principales son que, por un lado, por sí sola genera luz y eso provocará que toda roca cercana se verá influenciada por ese foco de luz (lo cual complica mucho las cosas a la hora de pixelar) y nos da ésta situación de "halos" no uniformes según su separación con los bordes:



...y por otro lado, que sus corrientes son mucho más visibles, en la zona dónde circula más rápido se verá esa corriente de lava mientras que en la zona dónde no tiene movimiento se verá muy distinto.



(Y hasta aquí llegué con el huevo frito)

El problema principal de éste tipo de backdrops como ya dije, es el dithering (o pixelado por puntos). La luz de las rocas más cercanas pide a gritos dithering como empecé a hacer. Pero toda la corriente de lava también pide a gritos un buen dithering, e incluso las partes más oscuras seguramente también. De hecho ese backdrop sería 110% dithering.

El dithering es como el tramado del manga, depende de cómo pueden verse puntos más grandes no deseados y cosas por el estilo si no se vigila así que hay que trabajarlo sobre algo muy límpio.
Pero a parte de eso, tiene una série de cosas que conviene comentar.

Sobre el dithering o pixelado por puntos tened muy en cuenta ésto:

1) Hecho de forma no manual no queda nunca bien, para nada, excepto algunas excepciones de pago (tools) muy aisladas y específicas para el caso.

2) Requiere un control del píxel y un nivel de precisión muy alto por lo que es muy lento de hacer.

3) En general solo queda bien entre colores bastante cercanos, así que a veces habrá que hacerlo por partida doble usando un color intermedio (o más) afectando además nuestra paleta.

4) No se pueden aplicar dos dithering muy juntos entre ellos (sobreponerlos), no queda bien; el espacio del dithering debe ser ocupado solo por el mismo y no debe ser muy estrecho ni tampoco muy ancho y regular (o luego se parecería un dithering artificial)

5) Usar mucho dithering usualmente impide hacer otras cosas típicas del pixelart como el antialias y la corrección del banding.

6) Excepto para los que realmente saben aplicarlo como Dios manda se ve mucho mejor sin zoom, a la que aumentas el zoom enseguida se ve mal aplicado.
avatar
Wecoc
Administrador
Administrador



Créditos 12104

Gracias : 522

Volver arriba Ir abajo

RPG Maker 2000 Re: [Tutorial] Haciendo un Backdrop

Mensaje por Contenido patrocinado


Contenido patrocinado


Volver arriba Ir abajo

Ver el tema anterior Ver el tema siguiente Volver arriba


Permisos de este foro:
No puedes responder a temas en este foro.