Cómo se hizo:

- Parte 1: Dibujo y animación

Agregar a favoritos
Enviar a un amigo
imprimir

© Roberto Gutiérrez. www.blocdeapuntes.net - 27 de septiembre de 2005

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

- Funcionamiento simulado del cargando

 

El semáforo y la calle están dibujados con la herramienta pluma de Flash y utilizando una fotografía de un semáforo como referencia.

El dibujo de la chica y el perro con una tableta gráfica, sin fotografías de referencia y sin boceto previo a lápiz.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

En programas como Freehand, Ilustrator... o programas de retoque fotográfico como Photoshop, se suele distribuir los distintos elementos de un dibujo en capas separadas. De esta forma normalmente es más sencillo después modificarlos. Pero en Flash todo se suele dibujar en la misma capa y únicamente se añade una nueva capa si existe un motivo:

Por ejemplo, en el dibujo de la chica, la cabeza, los ojos, las sombras y la sombra de la pared las he dibujado en distintas capas, pero el resto del cuerpo está dibujado en la misma capa.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Importante:
El botón "Intercambiar..." del panel de propiedades de Flash

Existen 2 clips de película distintos de la chica. En el primero mueve la cabeza hacia su izquierda. En el segundo anda.
Con el perro ocurre lo mismo: Existen 2 clips de película distintos. En el primero está quieto y en el segundo anda.
Y con el escenario ocurre algo muy similar. Existen 2 clips de película también distintos. En el primero el semáforo está en rojo y en el segundo está en verde.
Los dos clips de película de la chica, el perro y el "escenario" están situados en tres capas diferentes, respectivamente.

 

 

 

 

 

El cargando funciona de esta manera: En el fotograma 6 (luego veremos por qué en este fotograma precisamente) pregunta si la película se ha cargado, si no se ha cargado vuelve al fotograma 1. Si sí se ha cargado va al fotograma "semaforo_en_verde" (el fotograma "semaforo_en_verde", corresponde al fotograma 10, al que le he dado el nombre "semaforo_en_verde" en el panel de propiedades, en el campo Nombre). En este fotograma la chica y el perro comienzan a andar y cruzan la calle.

En ese punto precisamente, primero en la capa de la chica, he añadido un nuevo fotograma clave (pulsando F6), he seleccionado el clip de película en el que mueve la cabeza y lo he cambiado por el nuevo en el que anda utilizando el botón "Intercambiar..." del panel "Propiedades".

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Con el perro he hecho lo mismo. Un clip (Clip 1:quieto, en la imagen) en el que está quieto y el otro (Clip 2:andando) en el que anda. En el punto en el que la chica y el perro cruzan la calle (fotograma "semaforo_en_verde"), he añadido un fotograma clave, he seleccionado el clip en el que el perro está quieto y con el botón "Intercambiar..." lo he sustituido por el clip en el que el perro anda.

Y en realidad con el escenario propiamente dicho, lo mismo. El semáforo en rojo y la calle en un clip de película en una capa por debajo de la de la chica y el perro: Fotograma clave, botón "Intercambiar..." del panel de propiedades y sustituido por un clip de película duplicado de la misma calle, pero en el que el semáforo está en verde.

 

 

 

Un ejemplo más sencillo para que se entienda más fácilmente:

 

 

 

 

Las líneas las he dibujado con la tableta gráfica y con la herramienta pincel de Flash, intentando que queden cerradas. Luego las he rellenado de color con el cubo de pintura.

(Curiosamente las 2 o 3 sombras que tiene el dibujo -la del cuello que se ve arriba, por ejemplo-, están realizadas con la herramienta pluma, no con el pincel. Creo que es un error porque se invierte un pequeño tiempo de más que no es necesesario, ...no sé decir por qué lo hago así entonces, la verdad.)

 

Imaginemos que tenemos dos clips de película. En uno se ha dibujado un círculo. En el otro un cuadrado. En la línea de tiempo en el fotograma 15 añadimos un fotograma clave. Seleccionamos el clip de película del círculo, pulsamos el botón "Intercambiar..." del panel de propiedades y seleccionamos el clip de película del cuadrado.

El resultado será el siguiente:

 

 

 

 

 

 

 

 

 

 

Desde el punto de vista del dibujo eso es básicamente todo.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

No es imprescindible cerrar completamente las líneas a la hora de rellenarlas de color, si tenemos la precaución de seleccionar la opción "Cerrar Huecos Grandes" en la herramienta "Cubo de pintura"..

La cabeza está dibujada en una capa diferente porque cambia de posición.
Los ojos, que se abren y se cierran, son un clip de película independiente.

En el dibujo del perro en cambio, todo lo he dibujado en la misma capa. Excepto las sombras. Los ojos también son un clip de película independiente.

Las puntas del pelo de la chica están ligeramente modificadas de posición para que se muevan levemente al caminar. También está escalado verticalmente (reducido) un poco su cuerpo para que al caminar se note un pequeño movimiento arriba y abajo.