Favio Vido, genio de la ilustración digital

Residente en Sao Paulo (Brasil), Favio Vido es un diseñador grafico e ilustrador digital con una enorme trayectoria que abarca una enorme cantidad de trabajos desde el año 1999. Esta especializado en diseño editorial, Ilustración 3D y arte digital. Ha formado parte de varias agencias de publicidad, como ALMAP BBDO, Camilo Pastore, Euro RSCG, entre otros. Disfrutemos de algunos de sus trabajos.

Estampado en remera con Photoshop

En esta oportunidad veremos el modo de colocar un estampado a una remera usando la herramienta Photoshop. 
Es un procedimiento simple con un resultado estupendo. Veamos como hacerlo!!

Lo primero que haremos sera elegir nuestra imagen. Por ejemplo esta de aquí abajo.

Lo siguiente que haremos sera cambiar en modo de la imagen a escala de grises para crear un filtro, el cual usaremos posteriormente. Para ello iremos a Imagen / modo / escala de grises. Le daremos "descartar" al cuadro de dialogo y la imagen quedar nos quedará así.

Ahora vamos a Filtro / desenfocar / desenfoque guassiano y le damos un valor de 2,5 como se ve en la foto.

Una vez hecho esto, guardaremos la imagen asegurándonos que el formato de archivo este en .PSD (formato Photoshop). Le daremos el nombre de "filtro 1". Luego de esto Presionaremos las teclas atajo "Ctrl +Alt + Z" con lo cual nuestra imagen volverá a su estado original. Ahora elegiremos la imagen para el estampado. Por ejemplo esta. 

Si elegimos una imagen en formato .PNG sin fondo o con fondo blanco nos evitaremos tener que quitar el fondo de la imagen. Caso contrario pégate una vuelta por el tutorial de quitar el fondo a una imagen con Photoshop. 

Una vez que tengamos la imagen abierta le daremos a las teclas "Ctrl + A" y la imagen quedara seleccionada. Luego presionamos "Ctrl + C" y la copiamos. Luego de esto vamos a la imagen de la señorita y le damos "Ctrl + V" con lo cual la imagen quedará pegada sobre la otra. Para ajustar la imagen del estampado sobre la remera presionaremos "Ctrl + T" para acceder a la transformación libre. Una vez ajustada a nuestro gusto le daremos "Enter" y la moveremos con la herramienta "mover" del menú izquierdo para ubicarla donde nos guste.

Luego iremos a Filtro / Distorsionar / desplazar y le daremos valores de 13 a ambos casilleros. Luego vamos a la pestaña "capas", elegiremos el modo de capa "multiplicar" y le daremos saturación y relleno de 80% aproximadamente. 

Y eso es todo!!! Nuestra remera ha quedado estampada. Ten en cuenta que algunos valores en los filtros pueden variar dependiendo del tamaño de la foto y del logo. Ahora solo te falta practicar. No olvides comentarnos como te ha ido con tu proyecto. Saludos y nos vemos pronto!!!

Cambiando el color a una imagen

En esta oportunidad veremos una forma de cambiar el color a una fotografía utilizando la herramienta Photoshop. Veras que es un proceso muy sencillo y divertido de realizar. Vamos allá!!!

En primer lugar elegiremos una fotografía a la cual queramos cambiar el color. Nosotros utilizaremos como ejemplo la foto de nuestro famoso amigo verde.

El siguiente paso será crear una nueva capa presionando las teclas atajo Shif + Ctrl + L. Una vez creada la capa la pintaremos con la herramienta pincel cubriendo al gigante verde por completo. En este caso usaremos un tono rojo. Una vez hecho esto nuestra imagen quedará de esta forma.

Ahora iremos a la pestaña "Capas" en el menú de la derecha

y en la sección "estilo de capa" seleccionaremos la de "Luz suave". La imagen pasara a verse de este modo.

El paso siguiente será disminuir la opacidad de nuestra capa. Junto a la pestaña de estilo de capa presionaremos en la pestaña "Opacidad" y le daremos un valor de 65. Luego seleccionaremos la pestaña "Relleno" y le daremos el mismo valor.

Luego con la herramienta "Goma de borrar" eliminaremos la zona de los ojos y la boca. 

Finalmente podemos repetir el proceso con la sección del fondo para despegarlo del rojo de frente. Con este simple procedimiento cambiamos el color de nuestro amigo verde a rojo. 

Y eso es todo. Si te gusto el tutorial por favor cuéntanos!!! esperamos que te haya servido!!! Hasta la próxima!!!

Reemplazando el fondo de una imagen

En  esta oportunidad veremos como reemplazar el fondo de una fotografía con un método bastante simple. 

Para ello utilizaremos la herramienta Photoshop. Comencemos con el tutorial!!!

Eligiendo nuestra imagen.

Elegiremos cualquier fotografía que nos guste. Ten en cuenta que este proceso resulta útil para imágenes con fondos que posean varios colores, pues para las imágenes con fondos simples existen otros métodos que ya hemos visto antes. Tomaremos como ejemplo esta fotografía de aquí abajo.

Convertimos nuestra imagen en "capa".

Lo siguiente será convertir el fondo de la fotografía en una capa común. Para esto haremos doble clic sobre el fondo o "Background", el cual  pasará a llamarse "Capa 1".

El "Lazo magnético".

Ahora seleccionaremos la herramienta "Lazo magnético" ubicada en la parte superior del menú de la derecha como se ve en la imagen.

Iremos marcando el contorno de la figura principal de la imagen con el lazo magnético hasta llegar al mismo punto donde comenzamos. Al llegar a dicho punto aparecerá un pequeño círculo indicándonos que los extremos del lazo se unen allí, con lo cual la imagen quedará seleccionada.

Seleccionamos el fondo de la imagen.

Como nuestro objetivo es eliminar el fondo, deberemos invertir el área seleccionada. Para ello utilizaremos las teclas atajo Shift + Crtl + i o iremos al menú de la parte superior "Selección" y elegiremos la opción "invertir". Con esto la parte seleccionada será el fondo de la imagen en lugar de nuestro amigo. Finalmente utilizaremos la tecla "delete" o "suprimir" con lo cual el fondo de la imagen desaparecerá como se ve en la foto de abajo.

Cambiando el fondo por el nuevo.

Ahora solo resta elegir qué fondo queremos para reemplazar el original borrado. Para esto seleccionaremos cualquier foto, por ejemplo esta.

Pulsando las teclas "Ctrl + i" seleccionaremos la imagen completa y luego presionaremos las teclas "Ctrl + c" para copiarla. Luego volveremos a la imagen con el fondo borrado y le daremos "Ctrl + v" con lo cual la imagen quedará pegada sobre la del sujeto que come fruta. 

Finalmente haremos clic manteniendo sobre la capa de las sandías y la ubicaremos debajo de la imagen del muchacho.

Guardando la imagen como "JPG".

Para terminar iremos al menú "archivo" y pincharemos en "Guardar como..." asegurándonos que el formato de la imagen se encuentre en "jpg". Ahora nuestra fotografía quedara con el nuevo fondo que elegimos.

Y eso es todo!!! espero que este post te haya sido útil y no olvides comentar como te fue en tu proyecto. Saludos!!!

Cómo hacer una viñeta de cómic con una fotografia común

Una técnica bastante utilizada en la actualidad por muchos artistas es el collage digital, ya sea para ilustrar, realizar viñetas de cómics o fusionar con otros estilos combinando la técnica clásica con la ilustración digital. 

En esta oportunidad tomaremos como ejemplo el diseño de viñetas para una pagina de cómic a partir de una fotografía común y corriente. Es importante tener en cuenta que las imágenes que puedes encontrar en la web suelen representar la propiedad intelectual de alguien mas, por lo cual si pretendes apuntar tu proyecto hacia lo comercial te sugiero utilizar tus propias fotografías o bien emplear alguna otra técnica. Si no es el caso y buscas realizar esta técnica como un hobby descubrirás una alternativa bastante interesante respecto a la ilustración digital. 

          Una pagina de cómic realizada en su totalidad con la técnica de collage digital.

En esta ocasión nos enfocaremos directamente en la creación de la viñeta. Un dato importante a tener en cuenta es que si decidimos utilizar fotografías para nuestro collage nos resultará un poco mas complicado seguir literalmente la estructura pensada en el boceto, pues sería difícil encontrar una fotografía que coincida totalmente con nuestra idea original. Aun así, el boceto nos permitirá tener una idea inicial que luego adaptaremos a lo que nuestros recursos nos permitan. A veces, encontrar "esa" fotografía que buscamos para nuestra viñeta puede resultar un desafío y llevarnos bastante tiempo, pero si disfrutas de la realización de tu proyecto veras que este trabajo resulta menos tedioso de lo que imaginas. 

Pero sin mas vueltas, comencemos a diseñar nuestras viñetas en collage digital.

Photoshop: La herramienta por definición

Aunque existen alternativas de lo mas variadas a la hora de elegir con qué herramienta vamos a llevar adelante nuestro proyecto, la que vamos a emplear en esta oportunidad es sin duda una de las mas usadas por los ilustradores digitales: el Photoshop. Si aún no tienes experiencia en el manejo de esta herramienta te sugiero consultar algunos tutoriales respecto de su funcionamiento, los cuales puedes encontrar por la web muy fácilmente.

Primer paso: Elegir nuestra fotografía.

Daremos por sentado que ya tenemos nuestra página diagramada y lista para trabajar. veamos el boceto de la primer viñeta de dicha página, el cual podría ser  el que vemos bajo el texto a la derecha. Lo que haremos ahora será buscar una imagen similar a la que hemos maqueteado previamente. Por ejemplo puede ser esta que vemos junto al boceto aquí abajo.

Segundo paso: "Duplica y triunfarás"

Una vez seleccionada nuestra imagen, lo que haremos a continuación es "convertirla" en nuestra viñeta. Lo primero que haremos será duplicar nuestra capa. Para ello iremos al menú de la derecha sobre la pestaña capas (layers) y  haremos clic sobre la capa denominada "fondo" o "background" para seleccionarla y utilizaremos las teclas atajo "Ctrl + J"para duplicarla. También podemos ir a la pestaña "capas" ("layers") en el menú de la derecha, hacer clic derecho sobre la capa "Background" y elegir la opción "duplicar capa", con lo cual tendremos una nueva capa que debería llamarse por defecto "capa 1". Finalmente, volveremos "invisible" la capa Background o fondo haciendo clic sobre el pequeño icono en forma de ojo que se ve a la izquierda de la capa. 

 Una vez hecho esto podremos modificar la imagen sin tener que preocuparnos por alterar la fotografía original durante el proceso.

Paso 3: Quitando el fondo de la imagen.

El siguiente paso será eliminar el fondo de la imagen. Esto nos permitirá posteriormente colocar el fondo que deseemos a la viñeta. Para esto utilizaremos la herramienta "varita mágica" la cual se encuentra en el menú de la izquierda. pincharemos sobre la copia de la capa original que por defecto debería llamarse "capa 1"  y con la varita mágica haremos clic sobre el fondo, con lo cual quedará seleccionada. Para ello debemos darle a la herramienta una tolerancia lo bastante importante para que capture todo el color del fondo sin discriminar las diferencias cromáticas mínimas. En este caso le daremos una tolerancia de 7 o superior. La tolerancia la cambiaremos en el menú de la parte superior, debajo de las pestañas. En los próximos post explicaremos el modo de quitar el fondo de una imagen que contenga mas de un color. Una vez eliminado el fondo de la imagen, esta debería verse como esta de aquí abajo.

Paso 4: Los filtros artísticos. 

luego de esto, haremos dos copias de nuestra "capa 1", es decir las capa a la que le borramos el fondo. Para esto pinchamos sobre dicha capa y presionamos "Ctrl + J" dos veces, con lo cual tendremos listas las dos copias que necesitamos. Luego pincharemos en el icono del ojo en la capa de arriba ( capa 1 copia 2) para volverla "invisible" mientras trabajamos con la copia de debajo. 
Una vez hecho esto vamos a trabajar con los filtros artísticos. 
Seleccionaremos la capa denominada "capa 1 copia" y luego pincharemos en el menú  que esta arriba sobre la pestaña "Filtros" (Filters). Ahí aparecerá un menú desplegable donde pincharemos la opción "galería de filtros..." (filter gallery...) y seleccionaremos en la pestaña de filtros artísticos la opción "dividir" (cutout). podremos jugar con los parámetros de la derecha para darle a la imagen el estilo que busquemos. Ten en cuenta que según el tamaño de la imagen y la gama de colores de esta el resultado puede variar. en este caso utilizaremos los siguientes parámetros.

  

Luego de seleccionar los parámetros elegidos, daremos clic en aceptar y nuestra imagen nos quedara de la siguiente manera.

 Luego seleccionaremos la copia que habías vuelto "invisible" la cual debería llamarse por defecto "capa 1 copia 2" y la volveremos visible otra vez haciendo clic sobre el icono del ojo que esta a la izquierda. Luego pincharemos en el menú "Filtros" y seleccionaremos una vez mas "galería de filtros". esta vez seleccionaremos la opción "posterizar bordes" o "poster edges" y le daremos los siguientes parámetros.

.
La siguiente capa se vera como esto.

Paso 5: Estilos de capa.

Perfecto! Ahora comenzaremos con los últimos pasos. 
Ya tenemos nuestras capas listas para interactuar entre sí. Para ellos deberemos trabajar con el estilo de capa.
En la pestaña capas pincharemos en estilos de capa y seleccionaremos la opción "trama" o "screen". con lo cual nuestra imagen quedara de la siguiente manera.

Luego de esto haremos clic derecho sobre la capa seleccionada y elegiremos la opción "fusionar visibles". con lo cual nuestras capas que estén visibles se convertirán en una sola. Luego duplicaremos la capa resultante presionando "Crtl + J" y le cambiaremos el estilo de capa a "subexposición lineal" con lo cual obtendremos algo similar a esto. 

Paso 6: Fondo y globos de diálogos.

Finalmente, nos queda elegir el fondo que vamos a ponerle a nuestra viñeta. el proceso que deberás emplear para diseñar el fondo es el mismo que aquí explicamos.Eh aquí el resultado de nuestra viñeta.

Con un poco de practica, veras lo simple que resulta esta técnica. Espero que este post les hay resultado útil y divertido.  No olviden comentar como les fue en su proyecto!!!

Cómo hacer nuestro propio cómic

Con frecuencia, a la hora de iniciar por primera vez un proyecto, suele ser regla común hacernos preguntas tales como “¿De qué modo debo empezar?” o “¿Será esta la forma correcta de hacerlo?”. El mundo de los artistas digitales no es la excepción a esta regla, y aunque es cierto que el arte no conoce de parámetros, también debemos reconocer que seguir ciertos pasos durante el proceso de creación de un proyecto nos puede ayudar a optimizar el tiempo y la calidad de nuestro trabajo, ya sea haciendo cómics, ilustrando o realizando cualquier otra actividad en la que decidamos involucrarnos. 

En este caso en particular, vamos a explicar los pasos que suelen emplearse para la realización de un cómic. Aunque el contenido de este blog está principalmente orientado a  la realización de proyectos en formato digital, la mayoría de los artistas convencionales suelen seguir varios de estos pasos a la hora de realizar sus proyectos, por lo cual si crees que quizá lo tuyo va más por el lado del lápiz y el papel en lugar de lo digital seguramente podrás de todos modos sacarle alguna utilidad a estos párrafos. Pero ya sin más rodeos, veamos cuales son los pasos a seguir para iniciar tu propio cómic.

Una buena idea

Al igual que en los casos de por ejemplo una película o un libro, la finalidad del cómic es contar una historia. Si esta es original y entretenida te resultara mucho mas fácil conseguir que más lectores se interesen por tu material. La temática de un cómic puede variar de forma casi infinita. Existen cómics para todo tipo de publico, niños, niñas, adultos, publico en general, y la lista sigue. Y aunque quizá podría pensarse que el argumento es un elemento secundario en un medio gráfico como la historieta, es sorprendente como una buena (o mala) historia puede hacer la diferencia respecto al producto final.  Muchas veces ocurre que una  calidad gráfica mediocre se compensa con una extraordinaria calidad narrativa. Sea cual sea el caso de tu proyecto, debes tener en cuenta que una narrativa dinámica y fresca  hará que tu proyecto sea mas interesante. Ten en cuenta que a nadie le gustan las historias aburridas, sin importar de que se traten. Seguramente, alguna vez te ha ocurrido que has dejado un libro a la mitad porque se te hacía imposible continuar leyendo sin dormirte, o te has levantado del sofá a mitad de una película aburrida. Con los cómics puede ocurrir lo mismo si tu idea carece de esa dinámica que empuje al lector a querer continuar leyendo. Algunas características que pueden hacer más fresca la narrativa de un cómic pueden ser por ejemplo generar suspenso, o incorporar escenas de acción. Las escenas demasiado largas pueden cansar al lector, así como los diálogos innecesarios o fuera de lugar pueden distraer o aburrir. Recuerda que los diálogos largos no siempre enriquecen la narrativa de una historia.

El guion: La columna vertebral de nuestro proyecto

El guion es sin duda una parte esencial para el desarrollo de nuestro proyecto. Sin un guion como estructura sería casi imposible llevar adelante el hilo que conduce la historia en general.  Normalmente, un guion se divide en dos partes fundamentales: la parte narrativa y la parte visual. La parte narrativa nos servirá de referencia a la hora de hacer “hablar” a nuestros personajes, es decir, cuando pongamos textos o diálogos a nuestro proyecto. La segunda nos ayudara a determinar el desarrollo de la acción visual del mismo, es decir lo que nuestros personajes “hacen” dentro de la viñeta. Otros factores como los planos, escenarios, horarios, clima, etc. son parte del segmento visual de nuestro guion. En definitiva, todo lo que nosotros decidamos que queremos mostrar en las viñetas de nuestro cómic. La forma propiamente dicha de la estructura de un guion para cómic suele ser muy personal y puede variar según el autor. Próximamente dedicaremos una nota más extensa exclusivamente sobre esta importante tarea como es escribir la columna vertebral de nuestro cómic.

                                                           Un ejemplo de guion de cómic.

El boceto: el esqueleto de un cómic.

Muchos artistas digitales suelen obviar esta parte, puesto que al trabajar con elementos digitales el margen de error suele simplificarse en ciertos aspectos, como ser borrado o cambio de colores, entre otros. Sin embargo, el boceto puede ser muy útil para diagramar lo que será el paso definitivo a la estructura visual del cómic. El boceto suele ser sencillo, con trazos simples que nos permitan de una manera ágil diagramar los puntos más significativos con respecto a las páginas de un cómic. En el boceto podremos coordinar la cantidad de viñetas por página, los planos de las mismas, donde colocar los globos para los diálogos, etc. Aunque tu proyecto sea 100% digital, es recomendable realizar algún tipo de boceto previo de tus páginas, pues esto te evitará tener que retocar el producto final una y otra vez. Si se te da bien dibujar a mano alzada existen algunos elementos como las tabletas digitalizadoras, que te permitirán desarrollar tu boceto directamente en el ordenador sin necesidad de utilizar lápiz y papel. otra alternativa en lugar de dibujar es utilizar imágenes, o algún software de diseño 3d como los que veremos mas adelante. en definitiva existen varias opciones a la hora de realizar el diagrama previo de tu trabajo, solo debes buscar la alternativa que consideres mas adecuada para ti probando algunas opciones.

                                        El proceso de la idea original al final de nuestro proyecto

Y ahora, el toque final...

A partir de este punto existe una infinidad de métodos para desarrollar tu cómic, y por supuesto los iremos viendo en profundidad en los próximos post. Puedes elegir entre dibujar tus cómics, crear un collage digital, utilizar software de edición 3d, fusionar estos estilos o incluso desarrollar tu propia técnica para llevar a cabo tu proyecto visual.  esperamos que nos cuentes como te fue en tu proyecto y que nos muestres tu trabajo. ¡Solo debes decidirte y empezar!!! 

Cómo crear un globo de dialogo para cómic

En esta oportunidad veremos un tema bastante simple, pero para quien no sepa como hacerlo puede resultar muy útil. Vamos a mostrar paso a paso cómo crear un globo para diálogo de una historieta. 

Los que somos aficionados a los cómics, sabemos que la diversidad respecto a los globos que contienen los diálogos en las historietas es casi infinita, dependiendo de factores como el estilo y el contenido de dicho cómic, pero también otro tipo de factores como la acción desarrollada o la intensidad del dialogo. También puede referirse a un tono de voz determinado, expresar pensamientos y una cantidad de cosas más.

En esta oportunidad veremos como hacer un globo para cómic básico como el que vemos en el extremo inferior izquierdo en la imagen de arriba.

Para nuestro proyecto utilizaremos la herramienta Photoshop. 

Lo primero que haremos sera crear un documento nuevo,  al cual le daremos un tamaño de 500 x 500 pixeles.

Una vez abierto el nuevo documento, iremos al menú de la izquierda y haremos clic derecho sobre la herramienta "selección" y elegiremos la herramienta circulo. Luego de esto iremos al menú de la derecha y en pestaña Capas utilizaremos la opción "Nueva capa", la cual se encuentra en la parte de abajo del menú.

Seleccionamos la capa denominada "Capa 1" y con la herramienta de selección haremos un ovalo mas o menos como este que vemos aquí abajo.

Para poder visualizar mejor nuestro trabajo es recomendable volver "invisible" nuestra capa de fondo o "background". Para lograrlo deberemos hacer clic sobre el icono con forma de ojo que vemos a la derecha de la capa, con lo cual nos quedara algo así. 

Ahora iremos al menú de la izquierda y seleccionaremos la herramienta "Bote de pintura" y rellenaremos con color el ovalo seleccionado. Previamente debemos asegurarnos de tener seleccionado el color blanco como indica la imagen aquí abajo.

Una vez rellenado el ovalo se verá así

posteriormente abriremos una nueva capa siguiendo el procedimiento que empleamos en el primer paso, la cual debería llamarse por defecto "Capa 2". Luego de esto iremos a la herramienta lazo magnético y trazaremos un pequeño triángulo en la parte inferior del globo. Una vez seleccionado el triangulo lo pintaremos con el bote de pintura como hicimos en el paso previo.

Luego fusionaremos las capas. Sobre la "capa 2" haremos clic derecho y seleccionaremos "fusionar abajo", con lo cual convertiremos las dos capas en una para poder colocarle el filtro.
Para terminar iremos a la pestaña de filtros (Fx) de la parte inferior derecha y seleccionaremos el filtro "stroke" y le daremos los siguientes valores.

Luego de esto volvemos a hacer clic derecho sobre la capa elegiremos la opción "rasterizar estilo de capa" para que el borde negro deje de ser efecto y pase a ser parte del globo blanco. 

Y eso es todo!!! tenemos nuestro globo de diálogos para nuestro cómic. Luego puedes elegir hacia donde apuntarás la flecha de dialogo, o el tamaño del globo. Incluso puedes darle una forma diferente a la ovalada y hacerlo rectangular. 

Espero que este post te haya resultado útil y divertido. No olvides comentar como te ha ido con tu proyecto. Saludos!!!