Línea de tiempo y Animación: Interpolaciones Clásicas (Classic Tween)

Como comentaba en el tutorial sobre interpolaciones de movimiento (Motion Tween), cuando necesitamos realizar animaciones más complejas, especialmente si necesitamos controlar con precisión el suavizado o aceleración de las interpolaciones (ease) resulta más cómodo utilizar interpolaciones clásicas (Classic Tween).

Volver al Índice

En las interpolaciones clásicas el elemento a animar también debe ser o haber sido convertido a símbolo previamente, es decir, debe ser una instancia de un símbolo.

Para crear una interpolación clásica sigue los pasos que vienen a continuación:

  1. Convierte el elemento a animar a un símbolo (si no lo es todavía)
  2. Añade los fotogramas normales que consideres necesarios para ajustar la línea de tiempo del elemento a animar a la duración de la animación.
    ClassicTween01
  3. Haz click con el botón derecho del ratón sobre la sección de fotogramas en la que se encuentra la instancia de símbolo que quieres animar.
  4. Pulsa Create Classic Tween.
    ClassicTween02 La sección de fotogramas que empieza en el fotograma clave en el que se encuentra la instancia a animar se colorea de morado, y aparece una línea de puntos que la cruza.
    ClassicTween03 Esta línea de puntos indica que la interpolación está rota o incompleta (no se realizará) hasta que introduzcamos un nuevo fotograma clave que la complete.
  5. Selecciona el fotograma clave en el que quieras introducir un cambio en las propiedades de la instancia.
    ClassicTween04 Pulsa F6 para introducir un fotograma clave (O click derecho en ese fotograma y Insert Keyframe)
    ClassicTween05
    Verás que entre el fotograma clave anterior y el nuevo la línea discontinua se hace continua.
  6. Selecciona la instancia en la escena y realiza esos cambios utilizando las herramientas de selección o de transformación, o el panel de propiedades.

    Cámbiala de posición, de tamaño, aplícale un efecto de color, un filtro, etc.

    Ahora puedes ir repitiendo los pasos 5 y 6 las veces que sea necesario hasta que tengas terminada tu animación.

  7. Hay que terminar correctamente la interpolación:
    • Si al terminar te sobran fotogramas, puedes borrarlos seleccionándolos y pulsando Shift + F5, o pinchando la selección de fotogramas con el botón derecho y eligiendo Remove Frames.
    • Cuando hayas terminado, pincha con el botón derecho sobre el último fotograma clave y elige Remove Tween.

      Esto da por terminada la interpolación, y es importante no olvidar hacerlo.

      Supongamos que la interpolación terminada queda así en la línea de tiempo:
      ClassicTween06 Notarás que el último fotograma clave y la sección de fotogramas que le siguen son de color gris. Esto indica que la interpolación termina en ese fotograma clave y que, a partir de él, la instancia permanece estática y sin ningún cambio hasta el final de la sección.

  • Ten cuidado de no dejar nunca una interpolación rota o sin terminar (con una línea discontinua al final). Esto puede crear problemas después, consume recursos y puede hacer que las animaciones no sean fluidas.
  • La interpolación clásica no muestra la trayectoria como hace la interpolación de movimiento
  • Cuidado porque Flash nos deja aplicar la interpolación a secciones de fotogramas que no contienen símbolos. El programa creará símbolos automáticamente, pero les dará un nombres automáticos en la biblioteca (Tween1, Tween2, Tween3,…). Esto es una catástrofe cuando tenemos un gran número de símbolos, porque será muy difícil encontrar cualquiera de ellos para realizar ajustes o modificaciones.

Diferencias entre interpolación de movimiento y clásica

Aunque se pueden utilizar indistintamente muchas veces, hay algunas acciones que sólo se pueden realizar si estamos utilizando el tipo de interpolación adecuada.

Acciones que sólo se pueden realizar sobre las interpolaciones clásicas:

  • Aplicar diferentes efectos de color (Color Effects) en diferentes secciones entre fotogramas clave
  • Aplicar diferentes aceleraciones (ease) en diferentes secciones entre fotogramas clave
  • Aplicar curvas de aceleración
  • Intercambiar símbolos en algunos fotogramas clave de la animación
  • Exportar animaciones a HTML5

Acciones que sólo se pueden realizar sobre las interpolaciones de movimiento:

  • Ampliar o reducir la duración de la interpolación (de forma que todos los fotogramas clave se recoloquen proporcionalmente a la nueva animación) arrastrando el borde derecho del bloque de interpolación en la línea de tiempo.
  • Aplicar rotaciones de más de una vuelta más un ángulo de cierto número de grados.
  • Animar objetos 3D
  • Aplicar interpolaciones predefinidas (Motion presets)
  • Animar texto sin convertirlo a símbolo

Como regla general os recomiendo que utilicéis interpolaciones de movimiento Motion Tween sólo cuando la trayectoria a animar sea muy compleja o siga una curva y no necesiteis aplicar diferentes aceleraciones en cada parte del movimiento.

En el resto de los casos la interpolación clásica (CLassic Tween) suele ser más potente y cómoda.

Volver al Índice

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *