Registrarse

[Gráficos] PixelOver para Sprite y Mugshots

Estado
Cerrado para nuevas respuestas.

Kurotao

Cocinando Queques.
Buenas buenas, verán, hay gente que me a pedido que haga un vídeo explicando como hago mis Sprite de Pokemon que coloco en mi Galería de Perfil y Sprite Públicos para Essentials, pero como no se hacer videos y no tengo espacio como para grabar videos de capturas, prefiero mostrar un pequeño tutorial con imágenes, No soy muy bueno explicando cosas sin estar en vivo y en directo, pero aquí va mi intento de Tutorial.

Este Tutorial usara a Photoshop como programa base.

* 1.- Para hacer los Sprite o Pixel Art a mi estilo, comienzo con una base de 160x160 pixeles (Base de Sprite Essentials).

* 2.- Busco la imagen que quiero para mi Pokemon o Fakemon, en este caso usare este (También puedes hacer algo totalmente original, pero usare esta referencia para que sea mas fácil entender).




* 3.- Al cortar la imagen la llevábamos aun nuevo lienzo de trabajo (Yo uso Photoshop) y disminuyes su tamaño usando la opción: Imagen - Tamaño de imagen (No "transformacion libre" ya que a veces sin darnos cuenta podemos dejarlo mas gordo o estirado), recuerda que la base es de 160x160, por lo general los pokemon básico pequeños suelen estar entre los 70 o 60 pixeles de altura, en este caso, es una forma final, así que usaremos pondremos de altura 150 pixeles.





* 4.- Ahora lo llevamos a la base en la que trabajaremos.



* 5.- Crea una nueva capa encima de esta

* 6.- En esta capa nueva vamos a trabajar, más que nada para no tener que borrar el fondo más tarde al terminar

* 7.- Usa la lupa en lo máximo posible ya que siendo pequeña la imagen tampoco estará muy cercano, pero suficiente para trabajar cómodamente.

* 8.- Para los bordes, Tomamos el color principal de la zona y buscamos el mismo color en la galería de colores y escogimos la forma más oscura de este sin llegar a negro, para esto usaremos la herramienta de "Cuentagotas" en la barra de herramientas, en este caso el rojo más oscuro y el amarillo más oscuro.



* 9.- Esta parte es sencilla pero se tarda, usando el lápiz con el grosor mínimo (1), comenzaremos a pixelear los bordes para que vaya quedando así.



Es recomendable tener la imagen original a mano, ya que al reducir el tamaño, hay algunos detalles que se pierden, así que al tener el original cerca podrás captarlos y decidir si volver a agregarlos o no.



Recuerden que pueden ver el progreso ocultando la Capa del dibujo original, de esta manera podemos solo ver el nuestros pixeles.



Una vez terminado debería de quedar de esta manera.



Recuerden que para ocultar una capa, apretar el Ojo en el cuadro que sale en el círculo rojo



* 10.- Ahora vamos con el coloreado, para eso utilizaremos el Cuentagotas para tomar los colores originales para los coloreados, a veces se necesitaran más de 2 paletas de colores si hay brillo, en ese caso, se necesita un tercer color que sea más Claro que el central, en este caso sería un Rojo claro, Rojo normal (Zona iluminada) y un Rojo oscuro (Sombra),



Aquí tenemos dos maneras de pintar.

A: Pintar con la Capa trasera colocada



B: Pintar a la vista



En lo personal uso ambas turnándolas, recuerden pintar las esquinas o el color se pasara a zonas donde no van, una vez ya hecho el circulo o el trazado cerrado como se muestra en la última imagen puedes usar tranquilamente el bote de pintura, si está bien cerrado, no debería de salirse de su trazado, si notas que se pasa por un pixel, siempre existe el “Control + Z”.
Si cerraste bien el trazo y usas el Bote de pintura, debería de quedar asi.



En caso de que no hayas cerrado bien las esquinas y usas el bote de pintura, quedara así:



Recomiendo un montón pintar TODAS las zonas del mismo color escogido para no tener que estar turnando una y otra vez los colores.



Hay veces contadas que habrá que escoger una cuarta paleta mas oscura que la de la sombra, estos son para pintar lugares traseros del Arte, ya sea cabello, sombreros y esas cosas detrás del frontal, pero no sucede muy seguido.

También recomiendo usar este truquillo que es muy simple, pero puede darle un muy buen toque al coloreado.



Quedando asi:



Como pueden notar le da un toque más realista a nuestro trabajo al hacer estos simples puntos, estos deben ser utilizados en lugares precisos donde el oscuro pasa a ser más claro y viceversa (Pero no abuses de este truco o se verán muy feos), luego de esto, seguimos pintando las siguientes partes, esta vez tomaremos los colores amarillos y el color Rojo violeta (No se como describir el color) de las plumas para terminar las siguientes zonas con paciencia, al terminar debería de quedar así.



* 11.- Los ojos suelen ser un poco mas complicados dependiendo de lo detalladas que sean, si son ojos simples, será fácil, pero hay otras veces que hay ojos muy detallados, en ese momento, ya depende de cómo quieres adaptar el ojo.



En este caso yo haré lo que puedo con el pequeño espacio para trabajar que me entrega estos Pixeles.



12.- Una vez ya todo pintado, puedes darles los toques de puntos para cambios de sombra como mostré anteriormente a menos que lo hayas hecho en el transcurso de coloreado que es lo recomendable. Para terminar, Borras u ocultas las capas traseras de estay dejas el fondo transparente dejando solamente el pixeleado sin tener así que borrar fondos con la goma o barita mágica, dando como resultado esto.



Como verán, no es muy difícil, solo necesita tiempo, cuando recién empiezas, te tardaras bastante, pero cuando ya domines las teclas rápidas del programa que uses, te ahorras mucho tiempo.

Esto no es solo aplicable a Pokemon, tambien puedes usarlo con otras cosas por ejemplo este que hice para intentar algo nuevo.



Este también lo hice con el tamaño base de los Trainer de Pokemon Essentials como un ¿"Y si también puedo darle mis toques a los entrenadores"?

NO recomiendo esta manera si usas los Sprite de Pokemon para GBA debido a falta de espacio de trabajo, lo intente, aunque sirve para las formas medias y finales, son muy negativas a la hora de hacer Pokemon Pequeños como los básicos.

Como hacer Mugshot con Pixelover para Essentials

Como prometí, aquí también dejare un Tutorial de como hago mis Mugshots, cada uno es libre de usarlo o no, la idea nacio de cuando estaba haciendo unos Mugsots con la bases de los Juegos de Pokemon, pero que no me terminaban de agradar, asi que se me ocurrió esto en base a que e perdido gran habilidad con el lapiz a la hora de dibujar, esto puede ser útil para muchas personas que quieren hacer Mugshots sin las bases, pero no tienen habilidad para dibujar.

* 1.- Primero que todo, esta vez usaremos la base de los Mugshots de las versiones NDS para Essentials (256x128),

* 2.- Buscamos una imagen de un personaje ya dibujado que se parezca a nuestro Trainer, en este caso usare este como ejemplo de Trainer



* 3.- Una vez encontrada la imagen, le cortaremos la zona de la cara que se usara para Mugshots y la colocaremos en nuestra base usando el metodo mencionado anteriormente.



* 4.- Una vez ya colocado, crearemos una nueva Capa para trabajar encima, y comenzaremos a hacer los bordes con el Lapiz (Yo uso el minimo de grosor, osea 1), recuerden que pueden ir ocultando la capa original para ver nuestro progreso con el pixeleo.





* 5.- Una vez ya hemos terminado de hacer los bordes, definan como sera su tipo de ojo, piénsenlo bien, ya que este deberás de utilizarlo para todos los Mugshots que harás para tu juego, para que no se vean diferentes unos de los otros, en este caso yo usare este que uso desde siempre, utilizando como base el contorno de los ojos de la original agregándole la Pupila e iris que les coloco a todos mis Mugshots sin importar que.





Una vez hecho esto, comenzamos a pintarlos, aquí los colores dependen de tu Trainer original, no es llegar y copiar el fondo, si no que lo estamos usando como base y codificarlo, como por ejemplo, los ojos de la imagen original eran Violetas, pero mi trainer los tiene café o castaño, así que de hay partes con el color.

* 5.- Una vez ya pintado agregaremos la boca y la Nariz, yo uso negro para los contornos de la piel exteriores y un cafe oscuro para la piel interior.



Una vez ya hecho esto, agregaremos las cejas y pestañas





* 6.- ESTA PARTE ES IMPORTANTE, cuando vayas a pintar la piel, debes de tener ciertas paletas de colores definidas que usaras siempre para las pieles, debes de tener claro las paletas que usaras para las Pieles Palidas, Pieles comun, Pieles tostadas y Pieles Oscuras, en este caso, usaremos la paleta que uso para las personas de piel común, suelen ser 3 paletas de cada una, Iluminada, normal, y sombreada, esta vez solo usaremos la normal y la sombreada.



Cuida mucho los detalles de la sombra ya que dan profundidad.

*7.- Para terminar, vamos con el cabello, como habrán notado, el cabello fue modificado de una cola de caballo a un moño elevado, ya que nuestro Trainer tiene ese peinado y no el original de la imagen que usamos como base, esto es importante, ya que queremos que se parezca lo mas posible a nuestro trainer, también, la imagen base tenia el cabello Violeta, pero el trainer que estamos usando tiene el cabello rubio, en ese caso, cambiaremos los colores del cabello también asemejándose a la de nuestro Trainer, en este caso, Rubio oscuro.



*8.- Y para terminar, le damos nuestros toques personales a nuestro Mugshots, ya sean cicatrices, accesorios, unas cuantas sombras con la técnica de cambio de sombras con los puntillos, revisar que todo este en un lugar, al terminar debería de quedar algo así.



Y listo, tenemos nuestro Mugshots listo ;D

Esto también puede servir para los que utilizan los Mugshots de la sexta generación en adelante que son de cuerpos mas grande, pero llevan mas tiempo y son mas trabajados porque también deberás de modificar el traje.

No cualquier imagen sirve, ya que muchas veces puede quedar mas grande de lo esperado y no se vera bien a menos que aprendas una manera de evitarlo.

Tampoco oses a copiar la imagen 100% igual a menos que sea un Trainer parodia o un personaje de la saga Pokemon, ya que lo que estamos haciendo es tomar un dibujo de otro artista como base para crear el nuestro.

Espero que les haya servido esto para la gente como yo que quiere algo especial pero que con sus limitadas habilidades de dibujo le prohíben hacer algo.

Espero que se haya entendido, esta es la primera vez en mi vida que hago un Tutorial escrito.

Espero que les haya sido útil, para mañana lo actualizare mostrando como hago mis Smugshots, si les incomoda ver las imágenes así, puedo dejarlas en una pestaña de "Spoiler" para que no les sea tan incomodo.

De ante mano me disculpo si la calidad de las capturas es mala, pero era eso o se vería muy grande.

Sin mas, me despido ;D
 
Última edición:

Lenny~

Señor de las Tostadoras
Respuesta: Tutorial para Pixel Art de 160x160 (Essentials)

Buen tutorial. Siempre es bueno que hayan de este tipo. Si no me equivoco, este tutorial también sirve para hacer versiones HD de sprites originales de Pokémon.
 

Kurotao

Cocinando Queques.
Respuesta: Tutorial para Pixel Art de 160x160 (Essentials)

Buen tutorial. Siempre es bueno que hayan de este tipo. Si no me equivoco, este tutorial también sirve para hacer versiones HD de sprites originales de Pokémon.
Sip, mas que nada por eso puse en el titulo "Essentials" ya que con el RPG MAKER XP, no tiene limites de colores como los GBA, esto puede servir de mucho a los que quieres hacer cosas propias, Primeros solo se aprende calcando, con el tiempo ya uno aprende a hacer cosas nuevas por si mismo, yo tengo unos dando vueltas por allí.
 

kanda

Creador de Pokémon HighSchool
Respuesta: Tutorial para Pixel Art de 160x160 (Essentials)

¡Está perfecto Kurotao! ¡Gracias por compartir! Si me animo a hacer algo ya te lo enseñaré :)
 

Cheve

MoonLover~
Miembro de honor
Respuesta: Tutorial para Pixel Art de 160x160 (Essentials)

El nombre técnico de esto es "PixelOver" recuerde siempre revisar las outlines. Puede usar la transparencia de la capa de fondo para ir pintando más facil.
 
Respuesta: Tutorial para Pixel Art de 160x160 (Essentials)

Este tutorial me va a dar la vida porque llevo como unos 80 fakemons hechos..MUCHAS GRACIAS!
 

Kurotao

Cocinando Queques.
Respuesta: Tutorial para PixelOver para Sprite y Mugshots (Essentials)

Añadido el Mini tutorial De Mugshots con Pixelover ;D

Lo podrán encontrar en la parte profunda del Post.
 

KanaCn

由紀カクタス
Me encanto como lo hicistes :)
Sigue así, que tus Tutoriales de gráficos sirven pa' todo el mundillo.
¡Suerte!

-Yuki!
 

Kurotao

Cocinando Queques.
Respuesta: Re: Tutorial para PixelOver para Sprite y Mugshots (Essentials)

Yuki❄;393157 dijo:
Me encanto como lo hicistes :)
Sigue así, que tus Tutoriales de gráficos sirven pa' todo el mundillo.
¡Suerte!

-Yuki!
Muchas gracias por el apoyo, estuve ocupado toda la mañana entre hacer el almuerzo y el tutorial de los Mugshots XD
 

Luna

Goody Two Shoes
Respuesta: Tutorial para PixelOver para Sprite y Mugshots (Essentials)

Varias cosas:

- Lo que haces se llama tracing y si bien funciona para aprender o apoyarte si la figura es compleja, me parece pertinente usarlo cada vez menos, pues el método presenta inconvenientes ya bien en la perdida de información al cambiar tamaño, bien en un sentido de dependencia en futuros proyectos, aconsejo intentar tomar cosas desde cero sin nada detrás para ir desenvolviendote.

-Hay problemas enormes el las outlines, primero, existe algo llamado antialias, son una serie de píxeles que se usan deliberadamente en pos de suavizar el efecto y transiciones de las líneas, y dos, están todas negras, eso es un big no, debería haber un color oscuro que este dentro del mismo tono del color abyacente, eso me lleva a la siguiente...

-La paleta, hay cosas que funcionan en el dibujo, más no en el pixel art, y una de ellas es, en efecto, la paleta, a lo mucho, toma el color del medio, no el más brillante, mucho menos el más oscuro, y empieza a construir el sombreado y los brillos para el sprite desde ahí.

- Creo los mugshots, nunca, jamás van de cuerpo completo, siempre son un área enfocada al rededor del rostro y pecho, nunca se le ven las piernas, pues en pantalla se vería raro, finalmente el tamaño, me parece muy grande, quizás sean cosas mías...

Overall no está mal el tutorial para lo que ocupa, solo trabaja en las cositas y mejora, que vas muy bien!


-Luna.

-Luna la de Wah.

-Antes Mantequilla.

-Pero ahora es Luna.

-Esa misma Luna.

- Maddalena en Discord

- Pero aquí es Luna.

-Aqui en Wah that is..

-Luna
 

Volk

Antiguamente SouL o SoulOfBandit
Respuesta: Tutorial para PixelOver para Sprite y Mugshots (Essentials)

eso en mi barrio se llama trampa (?
bueno, se agradece el tutorial, pero en serio, no te acostumbres a spritear asi, trata de hacer las cosas desde 0 viendo los diseños, porque con este metodo no mejoraras mucho como spriter :)
Pero para PixelOver es un muy buen metodo.
 

Kurotao

Cocinando Queques.
Respuesta: Tutorial para PixelOver para Sprite y Mugshots (Essentials)

♣SOUL♣;393171 dijo:
eso en mi barrio se llama trampa (?
bueno, se agradece el tutorial, pero en serio, no te acostumbres a spritear asi, trata de hacer las cosas desde 0 viendo los diseños, porque con este metodo no mejoraras mucho como spriter :)
Pero para PixelOver es un muy buen metodo.
Este tutorial sirve para los primerisos que aun no saben mucho sobre esto, y si, es trampa, pero para gente que no tiene mucha experiencia en esto, es bastante util, ya con el tiempo uno se va acostumbrando y puede optar por crear cosas nuevas como menciono al principio de post.

Pongamoslo como ejemplo cuando eramos pequeños y dibujábamos sobrecolocando una hoja encima del original, y con el tiempo aprendimos a dibujar sin ese calcado ;D
 
Estado
Cerrado para nuevas respuestas.
Arriba