lunes, 21 de julio de 2008

Diseñando un comic 2


Quienes vieron en esta página los primeros tips acerca de diseñar un comic en Fireworks, pueden ver ahora la segunda entrega del tema en mención. Esta vez abordando otros aspectos del diseño como los recursos gráficos a los que echamos mano cuando elaboramos una historieta web. Si bien no puede compararse del todo con quienes elaboran un comic tradicional, a lápiz y papel, no obstante el trabajo de ambos procedimientos puede hallar algunas similitudes durante el proceso creativo. Por ejemplo, la documentación gráfica, el coloreado son elementos comunes que cualquiera que haya elaborado alguna vez una historia gráfica seguro lo reconocerá. Así como el historietista ortodoxo alcanza una destreza técnica en la elaboración de un comic, igual quienes trabajamos el mismo arte pero dentro de los parámetros -y las limitaciones- de un programa gráfico, también podemos ejercitar nuestros conocimientos utilizando el soporte digital. Solo por curiosidad a inicios de este año, decidí tomar por un par de meses un taller sobre Comic y Caricatura en el Instituto Superior Orval, de Lima. La experiencia fue más que enriquecedora. De aquel taller surgió la iniciativa de hacer Diseñando un comic en Fireworks, en el cual utilizé mucho de los bocetos que presenté en el trabajo final durante mi paso por Orval.Diseñar un comic en Fireworks si bien tiene sus limitaciones cuando precisamente echa mano más a las técnicas del diseño gráfico, como el retoque o el montaje, creo que potencia su uso cuando apela a las técnicas tradicionales, como los bocetos a lapiz, y luego combina con las del soporte digital, logrando una propia estética.

martes, 15 de julio de 2008

Creando siluetas

Una de los necesidades más frecuentes en un diseño es el uso de plantillas, símbolos y formas. Fireworks incorpora sus formas automáticas y en su site de la web ofrece a sus usuarios versiones freeware y comerciales de sus conocidos pack de estilos, texturas, etc.Obviamente no podemos pensar que todo puede ser obtenido, sea gratuito o pagado, mediante una descarga ¿Para qué entonces somos diseñadores?. Pues, hay algunas formas de obtener plantillas y símbolos sin necesidad de hacerlo uno mismo. Una de ellas es obtener de la web la mayor cantidad posible de fuentes gratuitas ( o de pago) que contengan íconos o formas, para luego vectorizarlas haciendo uso del comando "Convertir a trazados". Y si necesitas colorearlos entonces aplicando cualquiera de las opciones de filtro puedes convertir los trazados en mapa de bits para luego agregarle el relleno con el bote de pintura. Pero si lo tuyo es partir desde cero y además eres consciente que la web también tiene sus limitaciones, entonces tienes una forma sencilla de crear siluetas que se ajusten a tus necesidades. Por ejemplo, si deseas obtener la silueta humana, entonces lo primero que deberás hacer es documentarte gráficamente de fotografías, caricaturas, bocetos digitales para empezar el diseño.Recuerdo en un trabajo me pidieron la silueta de una danzante para un background de una página femenina. Me sugirieron de la web una posición de baile como modelo.



En un lienzo que se ajuste a las medidas de la imagen que tendremos como capa base, la capa MODELO, trabajaremos en una capa superior con la la herramienta Pluma (P) para "calcar" la imagen. Lo recomendable es trabajar los vectores sin relleno, solo con línea con borde máximo de 2 para que puedas visualizar mejor la imagen y que se ajuste lo más posible a las curvas de la figura que va a siluetear. Ajustando los nodos daremos con la forma de la danzante. Una vez terminado cerramos la curva y tendremos algo como esto.



El borde negro de la capa SILUETA contornea la capa MODELO


Una vez que ya has cerrado la curva ocultas la capa MODELO y ya tienes la silueta vectorizada.


Le das color y sombra, por ejemplo.


Luego puedes redimenionar, ponerle texturas o hacer animaciones con la misma plantilla. Es sencillo, obviamente hay algunas que demandan más tiempo que otras, pero con un poco de práctica no necesitarás recurrir a las fuentes ni a los pack de formas que solucionan muchas cosas pero no enseñan nada finalmente.


lunes, 14 de julio de 2008

Uso de filtros


En Adobe Fireworks los filtros funcionan de manera similar que en Adobe Photoshop. La única diferencia es que en Fireworks los cambios no son permanentes cuando se manejan desde Efectos, del Inspector de Propiedades. Por eso antes de aplicar un efecto debemos estar seguro que los cambios serán definitivos, por lo tanto, no podrán revertirse ya que Fireworks convierte los trazados vectoriales a mapa de bits.Los filtros incorporados se diferencian de los "extras" porque pueden revertirse, se agregan tanto en el Menú Filtros como en el Inspector de Propiedades, en Efectos, como los filtros de Alien Skin, pero los filtros desarrollados por otras empresas generalmente se incorporan en el Menú Filtros, debajo de los incorporados, aunque algunos como los de Metacreations, la serie Kpt 6 y Kpt Effects, también se agregan a los Efectos del Inspector de Propiedades, lo cual es una ventaja frente a otros, como VanderLee, cuyos efectos son muy buenos, pero solo pueden aplicarse desde el Menú Filtros.


INSTALANDO FILTROS EN PHOTOSHOP
Cuando uno instala los filtros, por ejemplo, en Photoshop, a veces hay que leer primeramente los ficheros adjuntos descomprimidos conjuntamente con los instaladores, ya que algunos no funcionan con solo agregar a la carpeta Plugins de Photoshop. Así no es. Por lo general un recién iniciado o poco curioso cometerá el error de "instalar" mecánicamente en la carpeta Plugins solamente y luego se romperá el coco tratando de hallar el filtro instalado en algún menú de su Photoshop.
En Photoshop algunos filtros gratuitos como Cybia, Richard Rosseman, previamente debes leer el fichero Readme para seguir ciertos pasos de instalación de sus creadores ya que de otro modo no podrás verlos en el Menú Filtros cuando abras Photoshop. En la mayoría de los filtros gratuitos, la instalación es sencilla, es decir, funcionan solo agregando los archivos descomprimidos (extensión 8BF) a la carpeta plugins o creando sub-carpetas con determinados nombres a los que luego se copiarán los filtros.

INSTALANDO FILTROS EN FIREWORKS

En Fireworks los filtros se incorporan con solo agregarlos a la carpeta Plugins o si requieren un setup de instalación la ruta de instalación es la misma, en la carpeta Plugins de dicho programa.Pero la cosa no queda ahí, sí creíste que siguiendo los pasos y leyendo los ficheros es suficiente, te equivocaste, ya que a lo mejor te habrás preguntado ¿pero, si hice lo correcto, por qué no puedo verlos o porque no funcionan?. Simplemente algunos filtros no funcionan en Fireworks, mas sí en Photoshop. Por ejemplo, el filtro Vivid Details instala muy bien en Fireworks y puedes visualizar su panel con sus aplicaciones, pero a la hora de hacer ok, no aplica los cambios deseados, pero en Photoshop no sucede tal cosa. Cosa de programadores. O también se da el caso que está hecho para versiones de Photoshop superiores al 7, por lo tanto si tu Photoshop o Fireworks son versiones anteriores, sencillamente no funcionará así se agregen correctamente al menú Filtros. En algunos casos, como en el Impressionist no funciona en Photoshop 6, a pesar de haberlo instalado correcatemente, porque está hecho para versiones superiores, pero en Fireworks MX 2004 sí instala y funcionan bien. ¿Por qué?. Porque son versiones equivalentes. Fireworks MX 2004 es la versión 7 de Macromedia, similar al 7 de Adobe Photoshop. Hoy ambas empresas son una sola porque pertenecen a Adobe. Planteando la misma casuística, los filtros plugin de AutoFX, los Dreamsuite solo funcionan con Photoshop, pero consumen mucha memoria RAM, por lo que es necesario ciertos requerimientos técnicos que debes leer en sus instrucciones antes de instalarlos, porque de lo contrario se hará muy pesado a la hora de aplicarlos y perderás más tiempo en reiniciar tu programa que en aplicar sus efectos. Es bueno saber para qué software o qué hardware está concebido cada producto a fin de no invertir tiempo y dinero en una aplicación gráfica determinada.


Creando logos

Fireworks no solo es un editor gráfico web sino también un excelente creador de diseños vectoriales, el cual nos permite crear logos sencillos y muy creativos. Haciendo uso de todas las herramientas posibles es posible crear logos que nada envidiarían a Corel Draw, el programa gráfico más empleado para este tipo de ilustraciones. Aquí hay unos ejemplos de lo que es capaz de hacer Fireworks.

Este otro logo pertenece a una organización estatal de adultos mayores, llamado C.A.M de la Molina, en Lima, Perú. Fue el logo más votado por el público aunque el logo ganador fue otro que hice en Corel para un concurso de un logo institucional el 2004. A sus socios les gustó mucho este diseño que finalmente decidieron quedarse con él. Dicen que la voz del pueblo es la voz de Dios. Igual no me sentí mal porque los dos logos eran míos. Quién sí se enojó fue el crítico de arte que no aprobaba tal decisión. Obviamente como jurado lo estaban desautorizando. Hoy ese logo lo veo en polos, monederos, banderolas, etc. logo CAM

Ya saben, con Fireworks también es posible ganar algún dinerillo sin salir de casa, solo basta tener ingenio y mucha paciencia para realizar diseños que también nos den una retribución económica.
Este logo por ejemplo, pertenece a una organización educativa infantil llamada Talento. Está diseñada enteramente en Fireworks. Lo único difícil del diseño fue dar con la idea del logo, pero los diseños muchas veces van de la mano con la inspiración. logo talento.

martes, 8 de julio de 2008

Creando Lp de vinilo


Quiénes han visto el tutorial en el enlace de una pagina de comics personal pueden ver otras en este blog dedicado a Fireworks.

A veces queremos evocar símbolos del pasado en nuestros diseños y los discos de vinilo son una magnífica referencia.

Recuerdo que en mis clases de diseño me enseñaban a hacer unas elipses monguísimas y ahí nació la idea de hacer un LP. Así que tomé como modelo uno que tenía en mi armario y empecé. Cuando lo terminé alguien me dijo si no lo había escaneado.

Claro, lo más fácil es escanearlo, pero no podrías recrearlo a tu manera. Cuando digo "recrear" es que tú puedas trabajar tus propios "pistas" (los textos), tu propia "disquera" (logo) y otras cosas más. Se trata de copiar el diseño, el contenido es tuyo. Es sencillo, solo aplicar lo que te enseñaron en clases.

lunes, 7 de julio de 2008

Creando puzzles

A menudo vemos diseños que juegan con el efecto de rompecabezas. Es simpático ver como una foto o un diseño de pronto adquiere otra vida con la forma de un puzzle.
Hay muy buenos ejemplos que pueden servirnos de referencia a la hora de animarnos a hacerlos. Hay desde los más simples y esquemáticos hasta los más complejos y verdaderamente artísticos.
Navegando en internet conocemos los softwares gráficos que realizan este efecto, los conocidos filtros plugin como Dreamsuite 2 o Puzzle Pro que trabajan básicamente con editores gráficos como Photoshop. Lo que hacen dichos filtros es el puzzle de una imagen, confeccionado el número de piezas, la textura y la rotación de cada una, entre otras opciones.
Esto filtros son muy buenos, pero a veces carecen de creatividad ya que se basan en patrones pre-establecidos. Por ejemplo el Dremasuite es muy bueno y ofrece casi todo los detalles mencionados en el párrafo anterior, pero falla a la hora de abordar la imagen, ya que por defecto su software recorta los pixeles de la parte superior de la foto, dejándote con la sensación de un puzzle con tu imagen "cortada". No es un inconveniente imposible de solucionar, ya que podríamos añadir intencionalmente más cielo a un paisaje con la intención de que al ser cortado por el software no parezca como mochado en demasía, pero mientras hacemos perderemos tiempo.
Personalmente soy de la idea que no hay mejor filtro o efecto mejor que el creado por uno mismo. De hecho, en la red existen tutoriales que te enseñan a hacerlo paso a paso. Hace unos años había uno propuesto por el Sitio el Club del Corel Draw y otro para la versión 5 de Jasc Paint Shop Pro. Ambos eran bastante ilustrativos y te facilitaban con las plantillas para realizar el ejercicio. Ignoro si hasta la fecha existen dichos tutoriales.Las plantillas para Corel tenían demasiadas piezas, así que pensé en hacer una para Fireworks, pero con menos piezas. Lo primero que me vino a la mente fue tomar como modelo una imagen de una plantilla de puzzle sin imagen, con 12 o quince piezas.


La capa con la plantilla la llamaremos PLANTILLA. En una capa distinta "calcaremos" las piezas usando la herramienta pluma.Elegiremos una pieza de la figura con borde recto para iniciar la plantilla. Luego dibujamos una figura cuadrada que cubra todo el área de la pieza seleccionada.




Hay que desagrupar el trazado (Crtl+Shift+G) para ajustar los nodos y hacer la primera pieza, capa a la que llamaremos PIEZA_UNO. No lleva relleno, solo un borde (2) de color azul para diferenciarlo de la imagen de mapa de bits que es nuestra capa base PLANTILLA .



Para hacer la segunda pieza, primeramente hacemos una copia de la primera pieza , cambiándole solo el color del borde azul por un rojo, a esta capa la llamaremos COPIA PIEZA_UNO. Luego dibujaremos un trazado rectangular con borde 2, también de color rojo, Con el rectángulo cubres una pequeña parte de la primera pieza y el total de la segunda (la copia) como en la figura mostrada . El color rojo es solo para diferenciar una pieza de otra y notar los cambios para los próximos pasos a seguir. Es importante.



Ahora seleccionamos con el puntero COPIA PIEZA_UNO y RECTANGULO, ambas pulsando Shift.



Luego vamos al Menú Modificar, usando el comando Combinar trazados, con la opción Perforar daremos con la forma que ves en la figura siguiente.




Lo único que tienes que hacer después es ajustar los nodos y acabar la segunda pieza.






Siguendo la misma operación harás las piezas faltantes hasta dar con la plantilla completa de 15 piezas, cada una de un color distinto para diferenciarlas, pero una vez terminada deberás uniformizar el color y también agruparlas, pero no será necesario ya que en una para realizar los pasos siguientes es mejor que estén desagrupadas.




Ahora elegiremos la imagen a "dividir". Puede ser una foto o un paisaje. Tienes que situarlo debajo de la capa PLANTILLA, de modo que puedas visualizar la imagen a través de las piezas.




Luego crea varias copias de la imagen debajo de la primera.




Una vez ordenadas las capas comenzamos a "partir" la imagen. Puedes elegir cualquiera de las piezas. En este ejemplo iniciaremos con la primera. Seleccionamos la imagen (Ctrl+A) y con la herramienta Recuadro (M) de la Barra de herramientas, tomamos el área necesaria que cubra la pieza.




Pulsamos Ctrl+X , recortando una pequeña parte de la foto




Luego seleccionamos la pieza uno con el puntero, vamos al menú Edición y con la opción "Pegar dentro" o simplemente con el comando Ctrl+Shift+V pegamos el área recortada dentro de la pieza.



Ya tenemos la primera pieza. Aparecerá en modo de máscara. La otra pieza del puzzle también se hizo repitiendo los mismos pasos anteriores. El resto corre por tu cuenta. Si al recortar las áreas de la primera foto, quedan "huecas" varios sectores, ocúltalas o bórralas y emplea las copias para repetir el corte y pegado. Es sencillo.




Aquí tenemos una muestra del arte final


Los puzzles podemos utilizarlo de muchas formas, por ejemplo, para la ilustración de organigramas o usos didácticos. Descarga el fichero de este puzzle aquí:



También podemos crear otras formas de puzzle. Solo es cuestión de imaginación.





E incluso combinando con otros efectos, como el conocido efecto agua daremos vida a otro diseño.




Los puzzles pueden sacarnos de apuro en fechas tan especiales, para esos momentos de aturdimiento mental, pero lo que vale es la intención.



Pero podemos sacarle provecho y aplicarlo, por ejemplo, a la construcción de una historieta. Está tomado de la historieta Un rompecabezas llamado amor, de mi autoría.

Eso es todo. Como ven es cuestión de ponerse a practicar. Es sencillo.

lunes, 23 de junio de 2008

Diseñando un comic en Fireworks

Las historietas y tiras cómicas que todos conocemos hasta el día de hoy requieren de la habilidad de un buen dibujante, cuyos bocetos a lápiz sobre papel "arman" una trama, una historia gráfica acompañada de un relato coherente, entre otros conceptos que no voy a detallar más.Con la aparición de los programas de diseño gráfico es común que muchos historietistas opten por colorear sus historietas con el Adobe Photoshop. Manuales y tutoriales al respecto hay de sobra en la red. Es cierto que Photoshop es el editor gráfico estándar en la actualidad, pero existen otras alternativas como el Corel Photo Paint o el Paint Shop Pro, que ofrecen similares resultados.Todo depende también el tipo de resolución gráfica que tendrá tu "arte final". Si es en papel no hay duda que Photoshop es la primera opción , pero si lo tuyo es el mundo online entonces puedes mirar hacia otros editores gráficos, cuyo soporte grafico es la web.He aquí el motivo de este post, porque como es sabido, Adode Fireworks (antes Macromedia) es el "corel draw" de la web, pues posee herramientas muy útiles para la creación de ilustraciones vectoriales, además de un excelente retocador de imágenes, herramientas suficientes para diagramar un cómic a partir de un boceto original en lápiz, o lo que es más desafiante aún: "partir de cero", es decir, elaborar una historia gráfica en base a ilustraciones creadas desde Fireworks.Es un trabajo artesanal arduo y requiere de extrema paciencia y dedicación, pero a la vez gratificante cuando ves tu "arte final" en el correo de un amigo o un familiar que luego te pregunta ¿y cómo lo hiciste, eh?. Elaborar un comic en Fireworks implica también un saludable examen a tus conocimientos sobre este editor gráfico web, ya que pondrás en práctica todo (y más) de lo que aprendiste en clase.Cuando pensé en este post pensaba en enumerar algunos tips o consejos y acompañar un pequeño "boceto" electrónico, pero luego no se me ocurrió mejor idea que describir aquello mediante una historieta, de modo que sea un ejemplo doblemente ilustrativo.Lo que se trata es de crear tus propios cómics con tus propios diseños y no copiar meramente estilos ajenos.