En este tutorial usaremos las nuevas características de la herramienta Deco de Flash CS5 para crear un fondo animado de dibujos animados.
Adobe Flash en Creative Suite 5 ha sido equipado con algunas grandes actualizaciones y mejoras. Adobe Flash CS5 incluye nuevas características para diseñadores y desarrolladores, como el nuevo panel Fragmento de código, la integración con Flash Builder y la nueva herramienta Spring for Bones.
Una de las nuevas características de Flash CS5 es la herramienta de dibujo Deco (aunque, en realidad, la herramienta Deco no es una característica nueva, ya que se agregó por primera vez a Flash CS4). Le permite crear dibujos y animaciones basadas en formas y colores dinámicos. . Es una de las herramientas inteligentes que puede ahorrar tiempo y esfuerzo al crear objetos de dibujo y animación utilizando símbolos y objetos listos, o cargar símbolos personalizados de la biblioteca..
En Adobe Flash CS5, la herramienta Deco se ha mejorado para incluir nuevas formas y funciones como veremos en este documento. El ejemplo que cubriremos debe proporcionar una comprensión profunda de la herramienta Deco mediante la creación de un fondo animado de dibujos animados con las herramientas Deco. Casi todo el trabajo en este ejemplo se realiza utilizando la herramienta Deco y sus funciones. Sin embargo, el objetivo de este ejemplo es mostrar cómo usar la herramienta Deco y comprender sus funciones mediante la creación de fondos animados con Flash u otros diseños y el uso de objetos que tomará de la lista de objetos Deco.
Esta guía demostrará cuánto tiempo y esfuerzo puede ahorrarse utilizando la herramienta Deco. Si bien el ejemplo de fondo de dibujos animados que se muestra a continuación requiere horas para crearlo utilizando las herramientas de dibujo en Flash junto con algunas habilidades de dibujo, podemos crear este ejemplo en menos de una hora con la herramienta Deco, y no necesitamos ninguna habilidad de dibujo..
Necesitas tener conocimientos básicos de herramientas Flash, ya que voy a profundizar directamente en la herramienta Deco, que muestra cómo personalizarlo para crear el fondo y la animación. Sin embargo, vamos a empezar con el paso 1 ...
Echemos un vistazo al resultado final en el que trabajaremos:
Comenzaremos creando el documento de Flash, preparándolo antes de comenzar a agregar los objetos de la herramienta Deco.
Cree un nuevo documento de Flash con las dimensiones 600 px x 450 px. Agregue un rectángulo con las mismas dimensiones que el documento y rellene el rectángulo con un relleno lineal (como en la siguiente figura) para crear el efecto de cielo oscuro.
Ahora crearemos el fondo de la carretera, usando la herramienta Línea, crearemos la forma del contorno de la carretera y la rellenaremos con colores grises para simular un asfalto real. Luego cree nubes usando la herramienta Oval y el resultado final debe verse como sigue:
Ahora, comenzaremos a utilizar la herramienta Deco para crear los edificios para ir por la acera de la carretera que creamos anteriormente. Puede establecer el tipo de rascacielos que le gusta usar o usar edificios aleatorios. Además, puede configurar el tamaño de los edificios..
Seleccione la herramienta Deco o presione la tecla U en el teclado. En el panel Propiedades, seleccione "Pincel de construcción" en la lista desplegable Efecto de dibujo. Luego, ve a las Opciones avanzadas, elige "Construcción aleatoria" y establece el tamaño en 2.
Haga clic en la carretera, luego arrastre hacia la parte superior y suelte el mouse para crear el primer edificio. Repita el paso anterior para crear otros edificios en la carretera como se ve en la siguiente figura
En los siguientes pasos, usaremos el pincel para árboles para crear árboles en la acera y usaremos el pincel para flores para crear ramas con flores sobre algunos edificios. Con este pincel, puede establecer el tamaño del árbol y sus colores de rama, hoja y flor / fruta.
Crear una nueva capa sobre la capa de edificios. Seleccione la herramienta Deco. En el panel de propiedades, elija Pincel de árbol en el menú desplegable y en la opción Avanzada, seleccione "Árbol de álamo temblón".
Haga clic en la acera entre los edificios para crear los árboles. Asegúrate de arrastrar unos pocos píxeles para crear árboles pequeños. Cuanto más arrastre, mayor será el tamaño del árbol. El efecto final después de agregar los árboles, debe ser el siguiente:
Ahora, seleccione el Pincel de flores, luego de la opción Avanzada elija "Flor de Pascua". Establezca el tamaño de la flor y la hoja en 50% y asegúrese de que la casilla de verificación Rama esté marcada
Arrastra hacia arriba la pantalla para crear ramas de flores. Deben ser altos para mostrarlos como una rama. Si la rama resultante es demasiado grande, puede seleccionarla y reducir su tamaño. Luego coloque la rama de flor redimensionada en los edificios como se ve en la siguiente figura:
Los siguientes pasos explican cómo crear barriles de fuego animados. También usaremos el pincel Animación de Fuego que le permite crear fuego animado de vectores. Puede establecer el tamaño del incendio, la velocidad y la duración del cuadro. Además, puedes configurar el color de la llama y la chispa..
Cree un nuevo símbolo yendo a Insertar> Nuevo símbolo o use el acceso directo Ctrl + F8 (Comando + F8 en Mac) y configúrelo como clip de película.
En la capa activa, cree un círculo para representar la parte superior del barril y otro para hacer la parte inferior del barril. Arrastre dos líneas entre ellas y complete el relleno del barril con líneas intermedias para que se vea como el siguiente ejemplo:
Crear una nueva capa para mantener la animación de fuego. Seleccione la herramienta Deco o presione U en el teclado, elija Animación de Fuego de la lista desplegable en el panel de Propiedades y configure la animación de fuego a 50 cuadros.
Ahora cambiaremos el tamaño y la posición del fuego para que parezca que las llamas están saliendo del barril:
Vuelva al escenario principal y agregue el clip de película del barril de fuego en el escenario al lado de los edificios, como se ve en la siguiente figura. Puede probar la película presionando Ctrl + Intro (Comando + Intro en Mac)
Si bien la herramienta Deco no proporciona todos los pinceles o formas posibles, puede personalizarla según sus necesidades utilizando los símbolos o los colores que desea mostrar. Ahora, usaremos el Sistema de partículas que le permite crear animaciones fluidas, como la caída de nieve, fuegos artificiales y otros efectos que dependen de la explosión de partículas pequeñas de una fuente..
Este pincel se basa en dos partículas que pueden ser símbolos predeterminados o puede usar símbolos de la biblioteca. Además, puede configurar otras opciones, como la duración de la animación, la velocidad por fotograma y otras opciones, como veremos a continuación:
Cree un nuevo símbolo usando Insertar> Nuevo símbolo o use el acceso directo Ctrl + F8 (Comando + F8 en Mac) y configúrelo como un clip de película. Regrese al escenario y arrastre el símbolo vacío recién creado de la biblioteca al escenario, luego haga doble clic en el símbolo para ingresar al modo de edición
Seleccione la herramienta Deco o haga clic en la tecla U en el teclado y elija Sistema de partículas en la lista desplegable Efecto de dibujo en el panel Propiedades. Seleccione tanto la Partícula 1 como la Partícula 2, establezca su color a blanco para simular la caída de nieve y use la forma predeterminada. Establecer los otros valores de la siguiente manera:
Ahora, haga clic en la parte superior del escenario para que el sistema de partículas caiga desde la parte superior del escenario hasta la parte inferior. Notará que se genera la animación de partículas y se crean los cuadros..
La animación de nieve comienza pequeña y aumenta hasta el final de la animación. Esto (como con el fuego) creará un corte no deseado en la animación en bucle. Para resolver esto, podemos eliminar de nuevo los marcos de inicio para las partículas de nieve de inicio. Seleccione el cuadro hasta el punto donde la nieve cubre todo el escenario. En este ejemplo, seleccionaremos los primeros 40 cuadros. Haga clic con el botón derecho y elija Eliminar fotogramas o presione Mayús + F5.
Si observa que la animación se está moviendo rápido, puede agregar un fotograma adicional después de cada fotograma clave seleccionando el fotograma clave y presionando F5.
Añadamos algunos efectos de rayos usando el Pincel de rayos. Este rayo debe animar y aparecer al azar. Puede establecer un montón de opciones con este pincel, como el color de la iluminación, su escala, ancho de haz y complejidad. Además, puedes elegir si debe o no estar animado..
Cree un nuevo símbolo de clip de película y agréguelo al escenario detrás de la capa de edificios. En el símbolo de clip de película, presione F7 para crear un cuadro vacío al principio del clip de película e ir al cuadro 20.
Seleccione la herramienta Deco y en el panel Propiedades elija Brocha de iluminación. Mantenga la configuración igual, solo cambie el color a blanco y marque la casilla de verificación Animación.
Apunte el cursor del mouse hacia la parte superior izquierda del escenario, haga clic y mantenga presionado el mouse hasta que el rayo alcance la complejidad deseada, luego suelte el mouse. Presione F7 después de la animación para agregar un marco en blanco después de ella.
Vaya al cuadro 70, repita los pasos anteriores para crear más rayos en la mano derecha del escenario con diferente complejidad y presione F7 después de la animación para eliminar los rayos del escenario..
Puede probar la película haciendo clic en Ctrl + Intro (Comando + Entrar en Mac) o seleccione Archivo> Publicar para exportar la película como archivos SWF y HTML.
En general, los archivos que utilizan la herramienta Deco generan SWF de gran tamaño porque la herramienta Deco genera los pinceles y la animación como formas desagrupadas y animaciones cuadro por cuadro. Estos dos métodos aumentan el tamaño total del archivo. Sin embargo, es una buena práctica optimizar el archivo después de alcanzar los resultados requeridos. Hay algunos consejos para disminuir el tamaño del archivo de la siguiente manera:
En el ejemplo anterior, aprendimos cómo usar la herramienta Deco para crear un fondo animado de dibujos animados. Esto ahorra tiempo y no requiere habilidades especiales de dibujo o caricatura. Puede descubrir el resto de pinceles disponibles en las herramientas de dibujo de Deco, ver cómo usarlos y las diferentes opciones asociadas con cada uno..
Espero que te haya gustado este tutorial, gracias por leerlo.!