Guía para la realización de cortos de animación 1 INTRODUCCIÓN AL FLASH PARTE 1: Introducción a Macromedia Flash PARTE 2: Herramientas de Dibujo.

Presentación del tema: "Guía para la realización de cortos de animación 1 INTRODUCCIÓN AL FLASH PARTE 1: Introducción a Macromedia Flash PARTE 2: Herramientas de Dibujo."— Transcripción de la presentación:

1 Guía para la realización de cortos de animación 1 INTRODUCCIÓN AL FLASH PARTE 1: Introducción a Macromedia Flash PARTE 2: Herramientas de Dibujo

2 Guía para la realización de cortos de animación 2 Parte 1: Introducción a FLASH

3 Guía para la realización de cortos de animación 3 Conceptos básicos Las películas de Flash son imágenes y animaciones para los sitios Web. Aunque están compuestas principalmente por imágenes vectoriales, tambiénpueden incluir imágenes de mapa de bits y sonidos importados. La películas Flash pueden incorporar interacción para permitir la introducción de datos de los espectadores, creando películas no lineales que pueden interactuar con otras aplicaciones. Los diseñadores Web utilizan Flash para crear controles de navegación, logotipos animados, animaciones de gran formato con sonido sincronizado e incluso sitios Web con capacidad sensorial. El trabajo en Flash para la creación de una película incluye el dibujo o la importación de una ilustración, su organización en el Escenario y su animación con la Línea de tiempo. La película puede hacerse interactiva utilizando acciones que hagan que la película responda a determinados eventos de cierta manera.

4 Guía para la realización de cortos de animación 4 Las películas FLASH (.swf) ‏ Las películas de Flash pueden reproducirse de varias formas: En navegadores Internet, tales como Netscape Navigator y Microsoft Internet Explorer, que estén equipados con Flash Player. Con el control ActiveX de Flash en Microsoft Office, Microsoft InternetExplorer para Windows y otros entornos anfitrión de ActiveX. En Flash Player, una aplicación independiente de manejo similar al complemento Flash Player. Como un proyector independiente, un archivo de película que se puedereproducir sin disponer de Flash Player.

5 Guía para la realización de cortos de animación 5 Gráficos en Flash Los gráficos vectoriales representan imágenes mediante líneas y curvas, denominadas vectores, que también incluyen propiedades de color y posición. Al editar un gráfico vectorial, se modifican las propiedades de las líneas y curvas que definen su forma. La posición, el tamaño, la forma y el color de los gráficos vectoriales puede cambiarse sin que por ello pierdan calidad. Los gráficos vectoriales no dependen de la resolución. Las imágenes de mapa de bits están compuestas de puntos de color, denominados píxeles y que están organizados en una cuadrícula. Al editar una imagen de mapa de bits, se modifican los píxeles y no las líneas o curvas. Las imágenes de mapa de bits dependen de la resolución.

6 Guía para la realización de cortos de animación 6 Entorno de trabajo Entorno de trabajo de Flash se divide en: El Escenario, área rectangular en la que se reproduce la película. La Línea de tiempo, donde se animan los gráficos respecto al tiempo. Los símbolos, componentes de los medios reutilizables de la película. La ventana Biblioteca, donde se organizan los símbolos. El Explorador de películas, que ofrece una descripción general de una película y su estructura. Paneles acoplables y flotantes, que permiten modificar los distintos elementos de la película y configurar el entorno de creación de Flash para adaptarlo a sus necesidades concretas.

7 Guía para la realización de cortos de animación 7 Interfaz general de Flash 5

8 Guía para la realización de cortos de animación 8 Interfaz general de Flash 2008

9 Guía para la realización de cortos de animación 9 Propiedades de la película

10 Guía para la realización de cortos de animación 10 Línea de tiempo En la Línea de tiempo se coordina el tiempo de la animación y se ensambla la ilustración en distintas capas. La Línea de tiempo muestra todos los fotogramas de la película.

11 Guía para la realización de cortos de animación 11 Capas Las capas actúan como una serie de hojas de acetato transparente superpuestas, manteniendo las diferentes ilustraciones por separado, de forma que puedan combinarse distintos elementos en una imagen visual cohesionada.

12 Guía para la realización de cortos de animación 12 Símbolos y Biblioteca. Instancias Los símbolos son elementos reutilizables que se usan en una película. Los símbolos pueden ser gráficos, botones, clips de película, archivos de sonido o fuentes. Al crear un símbolo, éste se almacena en la Biblioteca. Al colocar un símbolo en el Escenario, se está creando una instancia del símbolo. Los símbolos reducen el tamaño de los archivos, ya que Flash, independientemente del número de instancias creadas, sólo guarda una copia en el archivo. Puede modificarlas propiedades de una instancia sin alterar el símbolo maestro, así como editar éste para realizar un cambio en todas las instancias.

13 Guía para la realización de cortos de animación 13 Paneles flotantes Los paneles flotantes, que contienen los comandos y las opciones relacionados con cada tipo de elemento, permiten ver, organizar y modificar los elementos de una película de Flash. Utilizando estos paneles es posible modificar símbolos, instancias, colores, tipo, fotogramas y otros elementos.

14 Guía para la realización de cortos de animación 14 Uso de la paleta de herramientas Las herramientas de la paleta de herramientas le permiten dibujar, pintar, seleccionar y modificar las ilustraciones, así como cambiar la visualización del Escenario. La paleta de herramientas se divide en cuatro secciones: La sección Herramientas contiene las herramientas de dibujo, pintura y selección. La sección Ver contiene herramientas para ampliar y reducir, así como para realizar recorridos de la ventana de la aplicación. La sección Colores contiene modificadores de los colores de trazo y relleno. La sección Opciones muestra los modificadores de la herramienta seleccionada, los cuales afectan a las operaciones de pintura o edición de dicha herramienta.

15 Guía para la realización de cortos de animación 15 Paleta de herramientas

16 Guía para la realización de cortos de animación 16 Parte 2: Herramientas de Dibujo en FLASH

17 Guía para la realización de cortos de animación 17 Selección de objetos Para modificar un objeto, primero debe seleccionarlo. Flash proporciona diferentes métodos de selección, incluyendo la herramienta Flecha, la herramienta Lazo y comandos de teclado.

18 Guía para la realización de cortos de animación 18 Herramienta Flecha Para seleccionar objetos enteros con la herramienta Flecha, haga clic en un objeto o arrastre para encerrar el objeto dentro de un recuadro de delimitación rectangular.

19 Guía para la realización de cortos de animación 19 Herramienta Lazo Puede utilizar la herramienta Lazo y el Modificador modo polígono para seleccionar objetos dibujando un área de selección de mano alzada o de bordes rectos. Cuando se utiliza la herramienta Lazo se puede cambiar del modo de selección de estilo libre al modo de selección de bordes rectos. Propiedades de la varita mágica

20 Guía para la realización de cortos de animación 20 Herramientas de dibujo Las herramientas de dibujo de Flash permiten crear y modificar formas para las ilustraciones de las películas.

21 Guía para la realización de cortos de animación 21 Solapamiento de formas en Flash Al utilizar las herramientas Lápiz, Línea, Óvalo, Rectángulo o Pincel para dibujar una línea sobre otra línea o forma pintada, las líneas que se solapan se dividen en segmentos en los puntos de intersección. Puede utilizar la herramienta Flecha para seleccionar, mover y remodelar cada segmento independientemente.

22 Guía para la realización de cortos de animación 22 Dibujo con la herramienta Lápiz Para dibujar líneas y formas, se utiliza la herramienta Lápiz, de manera muy similar a cómo se emplea un lápiz real para realizar un dibujo. Para aplicar un suavizado o un enderezamiento a las líneas y las formas según se va dibujando, basta con seleccionar un modo de dibujo para la herramienta Lápiz.

23 Guía para la realización de cortos de animación 23 Dibujo de líneas rectas, óvalos y rectángulos Para dibujar trazados precisos como líneas rectas o bien como suaves curvas fluidas, puede utilizar la herramienta Pluma. Puede crear segmentos de líneas rectas o curvas, y ajustar el ángulo y la longitud de los segmentos rectos, así como la pendiente de los segmentos curvos. Herramienta Pluma

24 Guía para la realización de cortos de animación 24 Herramienta Pincel La herramienta Pincel dibuja trazos similares a los de un pincel. Permite crear efectos especiales, incluidos efectos caligráficos. Puede cambiar el grosor del trazo de pincel aumentando o disminuyendo la presión sobre la pluma. Pintar selección. Esta opción es como seleccionar un área rellena y aplicar un nuevo relleno. Rellenos de pintura pinta rellenos y áreas vacías y no afecta a las líneas.

25 Guía para la realización de cortos de animación 25 Enderezamiento y suavizado de líneas El enderezamiento hace los pequeños ajustes necesarios a las líneas y las curvas ya dibujadas. No tiene ningún efecto sobre los segmentos rectos. Rotar o escalar

26 Guía para la realización de cortos de animación 26 Optimizar curvas Esto refina las líneas curvas y los contornos de relleno reduciendo el número de curvas utilizadas para definirlos. También reduce el tamaño de las películas Flash y de las películas de Flash Player exportada. Al igual que con los modificadores Suavizar o Enderezar, puede aplicar la optimización varias veces al mismo elemento. Modificar > Optimizar.

27 Guía para la realización de cortos de animación 27 Borrar La herramienta Borrador permite eliminar trazos y rellenos. Puede borrar todo el Escenario con rapidez, borrar los diferentes segmentos de trazos o áreas rellenas, o borrar por arrastre. Modos avanzados de borrado

28 Guía para la realización de cortos de animación 28 Herramienta Cubo de pintura La herramienta Cubo de pintura rellena con color áreas cerradas: Puede tanto rellenar áreas vacías como cambiar el color de áreas ya pintadas. Puede utilizar colores sólidos, rellenos de degradados o de mapa de bits. Puede utilizar la herramienta Cubo de pintura para rellenar áreas que no están cerradas por completo, así como especificar que Flash cierre los huecos de los contornos de las formas al utilizar esta herramienta.

29 Guía para la realización de cortos de animación 29 Herramienta Bote de tinta La herramienta Bote de tinta permite especificar el color, la anchura de línea y el estilo de los trazos de las líneas o contornos de formas. Puede aplicar únicamente colores sólidos, pero no degradados ni mapas de bits, a las líneas y contornos de formas. Utilizar la herramienta Bote de pintura en lugar de seleccionar cada una de las líneas, facilita modificar los atributos de trazo de varios objetos de una sola vez.

30 Guía para la realización de cortos de animación 30 Color

31 Guía para la realización de cortos de animación 31 Panel Mezclador de colores Panel Muestras Para crear y editar colores sólidos, puede utilizar el panel Mezclador. Si se selecciona un objeto en el Escenario, las modificaciones de color realizadas en el panel Mezclador se aplican a la selección.

32 Guía para la realización de cortos de animación 32 Especificación de color, estilo y peso del trazo en el panel Trazo El panel Trazo permite cambiar el color, estilo y peso de línea del trazo de un determinado objeto. Para el estilo de trazo, puede elegir entre los estilos predefinidos que incluye Flash o bien crear un estilo personalizado.

33 Guía para la realización de cortos de animación 33 Panel de Rellenos especiales

34 Guía para la realización de cortos de animación 34 Utilidades y trucos en FLASH

35 Guía para la realización de cortos de animación 35 Utilidades y trucos en FLASH

36 Guía para la realización de cortos de animación 36 Utilidades y trucos en FLASH

37 Guía para la realización de cortos de animación 37 Animación en FLASH

38 Guía para la realización de cortos de animación 38 La animación se crea mediante el cambio del contenido de fotogramas sucesivos

39 Guía para la realización de cortos de animación 39 Tipos de animación Flash ofrece distintas maneras de crear secuencias de animación: fotograma a fotograma: la animación se crea fotograma a fotograma y por interpolación: se crean los fotogramas inicial y final, y Flash crea los fotogramas intermedios. Flash varía el tamaño, la rotación, el color y otros atributos del objeto de forma distribuida entre los fotogramas inicial y final para crear la sensación de movimiento. A su vez se distinguen: –interpolación de movimiento, se definen propiedades como la posición, el tamaño y la rotación de una instancia, un grupo o un bloque de texto en un punto en el tiempo, y estas propiedades se cambian en otro punto. –interpolación de forma, se dibuja una forma en un punto del tiempo y se cambia o se dibuja una nueva en otro punto. Flash interpola los valores o formas de los fotogramas intermedios para crear la animación.

40 Guía para la realización de cortos de animación 40 Características La animación interpolada es una forma eficaz de crear movimiento y cambios a lo largo del tiempo y de reducir al mínimo el tamaño del archivo. En esta animación, Flash sólo guarda los valores de los cambios producidos en los fotogramas de clave. En la animación de fotograma a fotograma, Flash guarda los valores de los fotogramas completos.

41 Guía para la realización de cortos de animación 41 Creación de fotogramas clave Un fotograma clave es un fotograma en el que se definen cambios en la animación. En la animación fotograma a fotograma, cada fotograma es clave. En la interpolada, se definen fotogramas clave en puntos importantes y Flash crea el contenido de los intermedios. Flash muestra los fotogramas interpolados en verde o azul claro con una flecha entre los fotogramas clave. Flash vuelve a dibujar las formas en cada fotograma. Sólo debe crear los fotogramas clave en aquellos puntos del gráfico en que se modifique algo.

42 Guía para la realización de cortos de animación 42 Representación de animaciones

43 Guía para la realización de cortos de animación 43 Animación por interpolación Puede crear una interpolación de movimiento utilizando uno de los dos métodos siguientes: Cree los fotogramas de inicio y final para la animación y utilice la opción Interpolación de movimiento en el panel Propiedades de fotograma. Cree el primer fotograma clave para la animación y luego elija Insertar > Crear interpolación de movimiento y mueva el objeto a la nueva ubicación del Escenario. Flash crea el fotograma final automáticamente.

44 Guía para la realización de cortos de animación 44 Animación interpolada con guía de movimiento Cree una secuencia de animación interpolada de movimiento Seleccione la capa que contiene la animación y elija Insertar > Guía de movimiento.

45 Guía para la realización de cortos de animación 45 Interpolación de forma Al interpolar formas se crea un efecto similar al de transformación y las formas parecen cambiar en el transcurso del tiempo. Flash también puede interpolar la ubicación, el tamaño y el color de las formas. Flash no puede interpolar la forma de grupos, símbolos, bloques de texto ni imágenes de mapas de bits. Use Modificar > Separar para aplicar la interpolación de forma a estos elementos Para controlar los cambios de forma más complejos o improbables, use los consejos de forma que controlan la manera en que partes de la forma original se desplazan a la nueva forma.

46 Guía para la realización de cortos de animación 46 Interpolación de forma:ejemplo (inicio) (final)‏

47 Guía para la realización de cortos de animación 47 Interpolación de forma Uso de consejos de forma: Los consejos de forma identifican puntos que deben corresponder en las formas inicial y final. Por ejemplo, si está interpolando el dibujo de una cara mientras cambia de expresión, puede marcar cada ojo con un consejo de forma. A continuación, en lugar de convertir la cara en una figura amorfa durante el cambio, los ojos siguen siendo reconocibles y cambian de manera independiente durante el proceso.

48 Guía para la realización de cortos de animación 48 Interpolación de forma Uso de consejos de forma: Ejemplo Sin consejos de forma Usando consejos de forma