imagen porcentaje

25% DTO / matrícula

imagen promoción

+ Fitbit Charge 2 GRATIS

imagen promoción

10% DTO / Formación ONLINE

Tutorial: Flash Video en Adobe After Effects

El formato de compresión Flash Video, originalmente de Macromedia y ahora bajo el apellido de Adobe Systems, se ha convertido en pocos años en un formato ampliamente extendido en Internet.

flashvideop1_portada

Está claro que el mejor currículum de todo artista de animación, bien sea 2D o 3D, es su propio trabajo: un vídeo donde demuestre su talento y conocimientos técnicos y/o artísticos. ¿Y qué mejor formar para darse a conocer que publicarlo en Internet?. Pero ahora asalta la duda: ¿qué formato/códec es el más adecuado?.

Tradicionalmente los formatos de vídeo MPEG-1 y Quicktime Sorenson 3 han sido los más empleados, siguiéndoles la estela otros tan conocidos como Windows Media Video, MPEG-4 o el también sobradamente conocido DiVX (en .avi).

Publicar un vídeo en Internet debe cumplir dos premisas: máxima compatibilidad y la mejor relación calidad/tamaño/compresión. Cualquiera de los anteriores formatos cumple en mayor o menor medida estas características pero, puestos a elegir uno: optaremos en este caso por Flash Video. Las razones principales son:

1. Flash Video, basado en el estándar Flash de Adobe. ¿Quién no tiene o ha necesitado instalar el reproductor Flash Player en alguna ocasión?. Hoy en día, es uno de sus plug-ins imprescindibles, gratuitos y más extendidos sin ninguna duda.

2. En su versión 8, emplea el códec On2, muy superior al anterior Sorenson Spark. Superior en cuanto a la relación calidad / tamaño del fichero final. Su principal handicap, es su novedad… no viene preinstalado de serie y será necesaria su instalación para una correcta reproducción. Por lo que es recomendable incluir algún enlace directo o script para su instalación.

3. Nos ayudará a profundizar en el uso de Adobe After Effects, aunque también incluiré el mismo ejemplo o proceso con Quicktime o el Video Encoder de Adobe, incluido junto a la instalación de Adobe Flash. Los pasos son los mismos.

Primera Cuestión: ¿Qué vídeo vamos a utilizar?.

Para este ejemplo he seleccionado el trailer de “Ratatouille“, la próxima producción del equipo de Pixar Animation Studios, en una resolución original HD 480p y que reduciremos desde After Effects para optimizar su tamaño web (y facilitar su “carga”).

Segunda Cuestión: ¿Hay un límite de resolución web?.

No. Ninguna. Aunque es obvio que para ahorrar ancho de banda en nuestro servidor y facilitar su descarga lo más rápida posible, no conviene alejarse de los estándares web, esto es generalmente: 320×240, 400×300 o incluso 480×360.

Tamaños más que suficientes en la gran mayoría de los casos.

Tercera Cuestión: ¿A que ratio de FPS/compresión lo exportamos?.

Si nos ceñimos al estándar de vídeo PAL, el original partirá de 25 cuadros de imagen por segundo (fps) para lograr la sensación de movimiento. En web, lo normal son unos 15 fps, aunque dependerá de la acción interna del vídeo (movimiento). En cuanto a la compresión, para estas resoluciones, 400 kbps suelen bastar (calidad media).

Cuarta Cuestión: ¿En qué software hacemos la compresión?.

Programas de codificación de Flash Video hay muchos, pero nos centraremos en After Effects, Quicktime Pro y Flash 8 Video Encoder.

Los dos últimos, Apple Quicktime Pro y Adobe Flash 8 Video Encoder, permiten importar casi cualquier tipo de formato para su posterior exportación a Flash Video. La diferencia es simple, uno viene incluido junto a Adobe Flash 8; y el otro es la versión de pago del popular reproductor de contenidos multimedia de Apple.

La parte de “setup” y exportación a Flash Video (FLV), es prácticamente la misma en todas las aplicaciones, donde tan solo apreciamos unas pequeñas “carencias” en comparación con Adobe Flash 8 Video Encoder, pero que se complementan con otras opciones incluidas en Quicktime Pro o After Effects (ver capturas a continuación).

After Effects es specialmente indicado si nuestra animación ha sido realizada con él, o no contamos con ninguno de los anteriores programas. Eso, y que en After Effects tendremos opciones de edición más avanzadas que en Quicktime Pro y el más básico, en este sentido, Adobe Flash 8 Video Encoder.

El Proceso en Adobe Flash 8 Video Encoder

Pantalla principal de la aplicación, donde podremos añadir y eliminar los ficheros a comprimir; así como el acceso al Panel de Exportación de Flash Video 8 (común al incluido en After Effects y Quicktime Pro).

flashvideo_ve_01

Como podréis apreciar por las distintas capturas, el Panel de Exportación a Flash Vídeo 8 es ligeramente diferente entre ellas, el más completo, como es natural por otra parte… el de la aplicación Adobe Flash 8 Video Encoder (tanto Quicktime Pro, como Adobe After Effects, cuentan con sus propias herramientas).

En dicho Panel de Exportación encontraremos (de arriba a abajo) desde “presets” de codificación, a una casilla para la selección del nombre del fichero (exclusivo del Flash 8 Video Encoder), un editor visual para los puntos de entrada (del cual carece After Effects) y 3 pestañas con diferentes parámetros de configuración.

En la pestaña de “Encoding” encontraremos las distintas opciones y parámetros de codificación de vídeo y audio (calidad de vídeo, audio, resolución, …). En un segundo plano de importancia, encontraremos las pestañas de “Cue Points” y “Crop and Trim”, para el ajuste más avanzado de la selección de vídeo a exportar.

flashvideo_ve_02b

El Proceso en Adobe After Effects

En After Effects, una vez importado el vídeo y crearle una nueva composición (simplemente “arrojando” el fichero de vídeo “encima” del botón de “New Composition”, enmarcado en rojo en la captura), haremos uso de una nueva función incorporada en After Effects 7.

flashvideo_ae_01

Por medio del menú de “Composition” o mediante el atajo de teclado “Comando/Control + K”, accederemos al Panel de Configuración de la Composición y reajustaremos su resolución a 480×360, entre otros.

flashvideo_ae_02

Aquí tenemos el Panel de Configuración de nuestra Composición.

flashvideo_ae_03

Dando el siguiente resultado (la composición es más pequeña que el vídeo original, por lo que se nos “desborda” de la composición, algo que ajustaremos automáticamente con la nueva opción de AE 7).

flashvideo_ae_04

Seleccionamos el vídeo en el Timeline, sacamos el menú contextual, y buscamos la opción “Transform”, donde a las habituales opciones básicas de escala y rotación, encontraremos 3 nuevas opciones de ajuste: adaptar al ancho, al alto, y a la composición.

flashvideo_ae_05

Una manera muy rápida de ajustar la escala de un recurso a la composición. En este caso, un vídeo de mayor resolución a la anchura de la composición, sin perder su proporción original. Listo, ya tenemos el vídeo ajustado automáticamente al milímetro.

flashvideo_ae_06b.jpg

Ahora nos queda acceder al submenú “Export”, dentro del menú principal “File”, y seleccionar la opción de exportación a Flash Video.

flashvideo_ae_07

Aquí tenemos el Panel Común en las distintas aplicaciones, donde configuraremos las opciones de exportación de vídeo y audio en el formato Flash Video 8 (donde también se incluye, por supuesto, el anterior códec basado en Sorenson Spark).

flashvideo_ae_08

El Proceso en Quicktime Pro

No hay mucho que decir. Abrir el clip de vídeo en Quicktime Player.

flashvideo_qt_01

Antes de continuar, en el Panel de Configuración de la película …

flashvideo_qt_02

También podremos acceder gracias a Quicktime Pro, a otras opciones avanzadas de edición de la película, como añadir o eliminar pistas de vídeo o audio, resoluciones, filtros, … opciones de enorme utilidad que a buen seguro, muchos desconocerán (me consta).

flashvideo_qt_03

Ahora ya, directamente, pasaremos al submenú de Exportar de Quicktime Pro, dentro del menú principal “Archivo” (“File”).

flashvideo_qt_04

Y en la ventana de diálogo de “Guardar Como”, seleccionaremos el formato de exportación “Flash Video FLV” en el menú desplegable inferior, y a continuación al botón de “Opciones” para su configuración.

flashvideo_qt_05

¿Os suena este Panel de Exportación de algo?. Así es, es el mismo al que también podemos acceder desde Adobe After Effects, Adobe Flash 8 Video Encoder o el caso que nos ocupa, Quicktime Pro de Apple.

flashvideo_qt_06

Quinta Cuestión: Tenemos el FLV, ¿y ahora qué?.

Una vez que estamos satisfechos con el resultado y calidad de nuestro vídeo, y que siempre podremos ajustar a nuestro gusto y necesidades puntuales, queda crear el oportuno fichero Flash (SWF) donde incluiremos nuestro reproductor Flash Video.

Aunque eso, será en la segunda y última parte de este tutorial.

Adobe After Effects
Adobe Flash Pro
Apple Quicktime Pro

18/12/2006 | , , , , | Tutoriales Animación

Miguel Gómez

Miguel Gómez

vuestroscomentarios

JTRidaura 13-02-2009

Desde AE puedes renderizar a FLV o en swf si tienes la necesidad pero tienes menos control sobre la compresion. Ademas de los foros de Domestika, puedes darte otra vuelta por Cristalab. Saludos.

miguel 20-01-2009

Hola Maggie, Lo que te recomiendo es que te pases por los foros de Domestika donde hay verdaderos expertos en temas de diseño web :) http://www.domestika.org/foros

Maggie 20-01-2009

Hola a todos! tengo la siguiente pregunta a ver si pueden ayudarme: Resulta que soy Diseñadora Web y estoy realizando una web en Flash para un cliente que hace animaciones en 3D. Ellos me proporcionaron unas animaciones hechas en After Effects y quieren que las pongamos dentro de una película de Flash, pero no con formato de video, sino que las animaciones corran naturalmente dentro del flash al hacer Roll Over, o al hacer click en un determinado botón. Yo les pedí que me pasaran un cuadro a cuadro de las imágenes pero queda muuuuy pesado para web porque son demasiadas imágenes (incluso luego de comprimirlas una por una). La pregunta es: ¿Cuál es la forma de poner una animación de after effects directamente en el flash y que interactúe con las animaciones de Flash?... (sin que pese mucho). Lo que yo quiero hacer es algo similar a lo que hay en el siguiente sitio web: http://www.3dimpactmedia.com/

JTRidaura 10-06-2008

Claro Miguel. Gracias por tu respuesta. Un saludo, JTRidaura

miguel 06-06-2008

Hola JTRidaura :) El códec H.264 de Apple es un importante avance en la codificación bajo formato Quicktime, además de ser el códec empleado en los Blu-Ray. Pero necesitas que su receptor, tenga instalado también Quicktime, y para algunos, no hay vida más allá de Windows Media Player. Por ello, mi apuesta por el FLV de Adobe Flash, porque cualquier ordenador moderno cuenta con un reproductor Flash y el códec incorporado en la versión CS2, On2, es realmente bueno. Aunque se conoce que Adobe está trabajando en incorporar el H.264 en su FLV lo que hará aumentar la relación calidad / compresión del fichero final. Si usas Quicktime, Sorenson 3 te aportará la mayor compatibilidad y una compresión media, H.264 te aportará menos compatibilidad pero una muy buena calidad, y si quieres lo mejor de ambos, yo optaría por un FLV con su correspondiente reproductor Flash (que los ahí gratuitos por Internet). ¿Te ha ayudado algo todo esto? :)

JTRidaura 06-06-2008

Hola Miguel, una vez más acudo a tu blog, para bichear y me encuentro con este artículo que me va de perlas para mi próximo proyecto, aunque el post es de hace bastante. Actualmente han salido otros códecs como pudieran ser los de QT H.264, etc. Recuerdo que hace un par de años, vi unos vídeos en Flash con una resolucion altísima para ser vía web, con una calidad acojonante. El tema es que tengo que hacer unos vídeos para Internet con AEFX, y me preguntaba si habría algún códec que diera una calidad óptima para este fin, ya que mi experiencia con el Flash encoder es buena pero no logro sacar resultados óptimos. Un saludo, JTridaura.

miguel 07-05-2007

Hola Vicstat No hay comparación posible en Premiere Pro y After Effects, son 2 programas con una finalidad muy diferente, Premiere Pro para edición de vídeo no lineal, y After Effects para animación y composición de vídeo. Desde After Effects puedes exportar a pequeñas resoluciones para web y vídeo Flash (FLV), aunque lo ideal es exportar a formato PAL/NTSC o a su máxima calidad y después, abrir ese vídeo en Quicktime Pro o similar y optimizarlo para web. Si puedes, aprende a manejar ambos programas!.

vicstat 06-05-2007

Hola, me estoy introduciendo al mundo del vídeo digital, vengo de la gráfica y la animación para web y me han sido muy útiles sus comentarios sobre las diferentes opciones de programas sobre edición/composición de video, según el tipo de trabajo que quiera uno realizar. Ahora bien, mis futuros proyectos en vídeo estarán básicamente orientados a la web, es por eso que quisiera saber si me conviene comenzar explorando las bondades de After Effects o bien adentrarme más en Premiere?. Hace tiempo que manejo algo de Premiere pero estoy leyendo tanto sobre After Effects que me entró la duda si iré bien orientado o estoy más perdido que mormón en concierto de AC-DC. Gracias!.

miguel 13-03-2007

Hola Mario, Puede ser debido a que hayas exportado en formato Flash Vídeo con el códec On2, y para reproducirlo necesitarás instalar en el equipo el reproductor de Adobe Flash Player 8 o superior (y que posiblemente ya tengas en Windows).

Mario 12-03-2007

Pasé unos vídeos de Quicktime a formato Flash Vídeo (FLV), sin embargo, al publicarlos se ven bien en equipos PC/Windows pero en equipos Mac no. Quisiera saber si necesito añadir algún código o instalar algún programa adicional. Gracias.

cesar 01-03-2007

Hola Miguel Gracias por contestar. Finalmente, y convencido de que Flash Encoder solo codifica y nunca desentrelaza, he optado por desentrelazar previamente (con procoder). El resultado es muy bueno. Ah, la compresión la he hecho a 12.5fps.

miguel 21-02-2007

Hola Cesar Efectivamente, Adobe Flash Video Encoder no dispone de opción de desentralazar, porque se trata de un "simple" programa de compresión, pocas opciones más te permite modificar fuera de los aspectos "básicos". Si tienes After Effects, hazlo directamente con él. En la ventana del proyecto, seleccionas el vídeo en cuestión, le das a Interpretar Footage (Comando+I), y en el apartado correspondiente, lo desentrelazas!. Otra opción podría ser emplear los filtros de Quicktime Pro y exportar con él. Eso, o probar con alguna suite de Compresión tipo Sorenson o Cleaner.

cesar 21-02-2007

Hola, tras un problemilla exportando con el Adobe Flash Video Encoder, estoy leyendo este y otros artículos y no encuentro respuesta al problema: El vídeo fuente que uso suele estar entrelazado, y por lo que veo el Adobe Flash Video Encoder no tiene la opción desentrelazar, de forma que los vídeos entran y salen entrelazados. Al principio pensé que como no venía esa opción, lo haría por defecto (dado que el 99% de los vídeos se ven en un monitor de PC/Mac, ¡y ahí es básico que el vídeo esté desentrelazado!. Pues parece ser que no, que la fuente tiene que estar previamente desentrelazada... ¿?. Me parece un poco absurdo y, o bien yo no he encontrado dicha opción, o bien tengo que probar con otros codificadores (miraré con After Effects). :-)

miguel 20-12-2006

Muy buenas CyberMODE, me alegra leerte por aquí! Opciones en el mercado para exportar a Flash Video hay varias (como dejo indicado justo en la 4ª cuestión acerca del software), el propósito de este artículo era destacar las que están expuestas: After Effects, Quicktime Pro y el módulo de exportación de Flash Video Encoder. Básicamente porque son las 3 que tengo instaladas ;) Una forma de ver que la misma operación, tiene diferentes caminos. En cualquier caso, gracias por el aporte :P

CyberMODE 20-12-2006

Hola! Te has olvidado de los dos softwares más importantes de compresión! El Cleaner de Discreet (antes terrain, media100,.... ) EL Sorenson Squeeze (http://www.sorensonmedia.com/) Ambos tienen muchiiiiiisimos más controles que el Flash 8 Video Exporter y se pueden conseguir mejores resultados calidad/tamaño Un saludo PD: Cuando instalas el Flash 8 Profesional, te instala el codec para exportar a Flash, sino nada y es exactamente lo mismo que el Flash 8 Video Encoder, las mismas opciones, al ser un codec cualquier aplicación de video que use QT podrá exportar a FLV sin necesidad de tener el QT PRO comprado

miguel 19-12-2006

Hola Antonio, antes de nada, gracias por tus comentarios... :P Lo primero es diferenciar entre un programa de edición de vídeo, uno de compresión, y los de animación/postproducción de vídeo. After Effects y Combustion pertenecen a esta última categoría, y ambos aunque en un principio hacen tareas similares, a mi modo de ver están dirigidos a mercados diferentes: animación gráfica y postproducción, respectivamente. En cuanto a programas de edición de vídeo propiamente dichos, tenemos a Apple Final Cut Pro, Adobe Premiere Pro y Avid en sus distintas gamas. ¿El programa perfecto?. Pues dependerá de tus preferencias y necesidades, pero cada uno tiene sus puntos buenos y malos, unos más que otros, pero eso es inevitable. Cada usuario tiene su favorito :) Ahora bien, ¿a qué te refieres con prohibito?. ¿Hablamos de precio?. Para terminar y como digo en el artículo de arriba, en mi humilde opinión, Flash Video es una de las mejores opciones actuales para la compresión de vídeo para web, y ahora con VideoLAN los podemos reproducir directamente sin necesidad de insertarlo en un fichero Flash SWF.

Antonio 18-12-2006

Excelente :). Aunque tengo que decir... ¿No hay un programa no prohibito de edicion de video decente?. Serán malas experiencias, pero en el trabajo hemos utilizado After Effects, Combustion y alguno más y todos nos toman el pelo con alguna cosa que otra. Ahora, con relación a las compresiones, me quedo con Flash Video, hoy por hoy, máxima compatibilidad, fácil y muy muy bonito cuando se trata bien. Un saludo (¿he dicho que me encanta este blog? :P)

Escribe tu
Comentario

Si quieres personalizar tu avatar, click aquí.
Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *
Recuerda que los comentarios deben ser revisados por un administrador.

Mándanos tu consulta

Puedes llamarnos al 91 401 07 02 (Centro Maldonado) o al 91 435 58 43 (Centro Povedilla).

Si lo prefieres, déjanos tus datos y nosotros te llamamos.

*Selecciona una titulación

Te llamamos sin compromiso

Puedes llamarnos al 91 401 07 02 (Centro Maldonado) o al 91 435 58 43 (Centro Povedilla).

Si lo prefieres, déjanos tus datos y nosotros te llamamos.

Tutorial: Flash Video en Adobe After Effects
SOLICITAR UNA CLASE DE PRUEBA GRATUITA
Tutorial: Flash Video en Adobe After Effects

Horario atención al cliente

  • Lunes a viernes

    • De 9 a 14 horas
    • De 16 a 21 horas
  • Sábados

    • De 9 a 14 horas

Teléfono de contacto: 91 435 58 43

Solicita información sobre
Envíanos tu opinión sobre CICE
Nosotros te asesoramos

¿No te decides?

Nosotros te ayudamos. Utiliza nuestro buscador avanzado para encontrar el curso que quieres.