Interpolación de forma

  1. Guía del usuario de Adobe Animate
  2. Introducción a Animate
    1. Novedades de Animate
    2. Glosario visual
    3. Requisitos del sistema para Animate
    4. Métodos abreviados de teclado de Animate
    5. Trabajar con varios tipos de archivo en Animate
  3. Animación
    1. Aspectos básicos de animaciones en Animate
    2. Cómo utilizar los fotogramas y fotogramas clave en Animate
    3. Animación fotograma a fotograma en Animate
    4. Uso de la animación de interpolación clásica en Animate
    5. Herramienta Pincel
    6. Guía de movimiento
    7. Interpolación de movimiento y ActionScript 3.0
    8. Acerca de la animación de interpolación de movimiento
    9. Animaciones de interpolación de movimiento
    10. Creación de una animación de interpolación de movimiento
    11. Uso de fotogramas clave de propiedad
    12. Animación de la posición con una interpolación
    13. Edición de interpolaciones de movimiento con el editor de movimiento
    14. Edición del trazado de movimiento de una animación de interpolación
    15. Manipulación de las interpolaciones de movimiento
    16. Adición de aceleraciones personalizadas
    17. Creación y aplicación de ajustes preestablecidos de movimiento
    18. Configuración de grupos de interpolación de animación
    19. Uso de interpolaciones de movimiento guardadas como archivos XML
    20. Interpolaciones de movimiento e interpolaciones clásicas
    21. Interpolación de forma
    22. Uso de la animación de la herramienta Hueso en Animate
    23. Trabajar con el rigging de personajes en Animate
    24. Uso de las capas de máscara en Adobe Animate
    25. Uso de escenas en Animate
  4. Interactividad
    1. Creación de botones en Animate
    2. Conversión de proyectos de Animate a otros formatos de documento
    3. Creación y publicación de documentos de HTML5 Canvas en Animate
    4. Adición de interactividad con fragmentos de código en Animate
    5. Creación de componentes HTML5 personalizados
    6. Uso de componentes en HTML5 Canvas
    7. Creación de componentes personalizados: Ejemplos
    8. Fragmentos de código para componentes personalizados
    9. Prácticas recomendadas - Publicidad con Animate
    10. Autoría y publicación de realidad virtual
  5. Espacio de trabajo y flujo de trabajo
    1. Creación y administración de pinceles
    2. Uso de Google Fonts en documentos HTML5 Canvas
    3. Utilización de las Bibliotecas Creative Cloud y Adobe Animate
    4. Utilización del Escenario y el panel Herramientas en Animate
    5. Flujo de trabajo y espacio de trabajo de Animate
    6. Uso de las fuentes web en documentos de HTML5 Canvas
    7. Líneas de tiempo y ActionScript
    8. Trabajo con varias líneas de tiempo
    9. Configuración de preferencias
    10. Utilización de los paneles de edición de Animate
    11. Creación de capas de la línea de tiempo en Animate
    12. Exportación de animaciones para aplicaciones móviles y motores de juegos
    13. Desplazamiento y copia de objetos
    14. Plantillas
    15. Buscar y reemplazar en Animate
    16. Deshacer y rehacer en el panel Historial
    17. Métodos abreviados de teclado
    18. Uso de la Cronología en Animate
    19. Creación de extensiones HTML
    20. Opciones de optimización para Imágenes y archivos GIF animados
    21. Configuración de exportación de imágenes y archivos GIF
    22. Panel de Recursos en Animate
  6. Multimedia y vídeo
    1. Transformación y combinación de objetos gráficos en Animate
    2. Crear y trabajar con instancias de símbolo en Animate
    3. Calco de imagen
    4. Cómo utilizar el sonido en Adobe Animate
    5. Exportación de archivos SVG
    6. Creación de archivos de vídeo para su uso en Animate
    7. Cómo añadir un vídeo a Animate
    8. Trabajo con puntos de referencia de vídeo
    9. Dibujo y creación de objetos en Animate
    10. Remodelado de líneas y formas
    11. Trazos, rellenos y degradados en Animate CC
    12. Uso de Adobe Premiere Pro y After Effects
    13. Paneles de color en Animate CC
    14. Apertura de archivos de Flash CS6 con Animate
    15. Uso de texto clásico en Animate
    16. Colocación de ilustraciones en Animate
    17. Mapas de bits importados en Animate
    18. Gráficos 3D
    19. Trabajo con símbolos en Animate
    20. Dibujo de líneas y formas en Adobe Animate
    21. Uso de bibliotecas en Animate
    22. Exportación de sonidos
    23. Selección de objetos en Animate CC
    24. Trabajo con archivos AI de Illustrator en Animate
    25. Aplicación de patrones con el pincel rociador
    26. Aplicación de modos de mezcla
    27. Organización de objetos
    28. Automatización de tareas con el menú Comandos
    29. Texto en varios idiomas
    30. Utilización de la cámara en Animate
    31. Uso de Animate con Adobe Scout
    32. Trabajo con archivos de Fireworks
    33. Filtros de gráficos
    34. Sonido y ActionScript
    35. Preferencias de dibujo
    36. Dibujo con la herramienta Pluma
  7. Plataformas
    1. Conversión de proyectos de Animate a otros formatos de documento
    2. Compatibilidad con plataformas personalizadas
    3. Creación y publicación de documentos de HTML5 Canvas en Animate
    4. Creación y publicación de un documento de WebGL
    5. Empaquetado de aplicaciones para AIR para iOS
    6. Publicación de aplicaciones de AIR for Android
    7. Publicación para Adobe AIR para escritorio
    8. Configuración de publicaciones de ActionScript
    9. Prácticas recomendadas - Organización de ActionScript en una aplicación
    10. Uso de ActionScript con Animate
    11. Prácticas recomendadas - Directrices de accesibilidad
    12. Accesibilidad en el espacio de trabajo de Animate
    13. Cómo escribir y gestionar scripts
    14. Activación de la compatibilidad con plataformas personalizadas
    15. Información general sobre compatibilidad con plataformas personalizadas
    16. Creación de contenido accesible
    17. Uso de plugins de compatibilidad con plataformas personalizadas
    18. Depuración de ActionScript 3.0
    19. Activación de la compatibilidad con plataformas personalizadas
  8. Exportación y publicación
    1. Exportación de archivos de Animate CC
    2. Publicación de OAM
    3. Exportación de archivos SVG
    4. Exportación de gráficos y vídeos con Animate
    5. Publicar documentos de AS3
    6. Exportación de animaciones para aplicaciones móviles y motores de juegos
    7. Exportación de sonidos
    8. Exportación de archivos de vídeo QuickTime
    9. Control de reproducción de vídeo externo con ActionScript
    10. Prácticas recomendadas - Sugerencias para crear contenido para dispositivos móviles
    11. Prácticas recomendadas - Convenciones de vídeo
    12. Prácticas recomendadas - Directrices de edición de aplicaciones SWF
    13. Prácticas recomendadas - Estructuración de archivos FLA
    14. Prácticas recomendadas de optimización de archivos FLA para Animate
    15. Configuración de publicaciones de ActionScript
    16. Especificación de configuración de publicación para Animate
    17. Exportación de archivos de proyector
    18. Exportar imágenes y archivos GIF animados
    19. Plantillas de publicación HTML
    20. Uso de Adobe Premiere Pro y After Effects
    21. Compartir y publicar animaciones rápidamente

En la interpolación de forma, se dibuja una forma vectorial en un fotograma concreto de la línea de tiempo y se modifica o se dibuja otra forma en otro fotograma específico. Seguidamente, Animate interpola las formas intermedias de los fotogramas intermedios y crea la animación de una forma cambiante.

Animate permite añadir interpolaciones de forma a trazos sólidos uniformes y a trazos sofisticados no uniformes. También puede añadir interpolaciones de forma a trazos mejorados con la herramienta Anchura variable. Experimente con las formas que desee utilizar para determinar los resultados. Puede utilizar los consejos de forma para indicar a Animate qué puntos de la forma de inicio deben corresponder a los puntos específicos de la forma final.

También puede interpolar la posición y el color de las formas de una interpolación de forma.

Para aplicar la interpolación de forma a grupos, instancias o imágenes de mapas de bits, separe estos elementos. Para aplicar la interpolación de forma a texto, separe el texto dos veces para convertirlo en objetos. Consulte Separar una instancia de símbolo.

Creación de una interpolación de forma

Los siguientes pasos indican cómo crear una interpolación de forma desde el fotograma 1 hasta el fotograma 30 de la línea de tiempo. No obstante, puede crear interpolaciones en cualquier parte de la línea de tiempo que elija.

  1. En el fotograma 1, dibuje un cuadrado con la herramienta Rectángulo.
  2. Seleccione el fotograma 30 de la misma capa y añada un fotograma clave vacío seleccionando Insertar > Línea de tiempo > Fotograma clave en blanco, o bien, presione F7.

  3. En el escenario, dibuje un círculo con la herramienta Óvalo en el fotograma 30.

    En este momento debe haber un fotograma clave en el fotograma 1 con un cuadrado y un fotograma clave en el fotograma 30 con un círculo.

  4. En la línea de tiempo, seleccione uno de los fotogramas entre los dos fotogramas clave en la capa que contiene las dos formas.

  5. Elija Insertar > Interpolación de forma.

    Animate interpola las formas en todos los fotogramas entre los dos fotogramas clave.

  6. Para obtener una vista previa de la interpolación, arrastre la cabeza lectora por los fotogramas de la línea de tiempo o presione la tecla Intro.

  7. Para interpolar movimiento además de forma, traslade la forma en el fotograma 30 a una posición distinta a la del fotograma 1.

    Previsualice la animación presionando la tecla Intro.

  8. Para interpolar el color de la forma, aplique a la forma del fotograma 1 un color diferente de la forma del fotograma 30.
  9. Para añadir aceleración a la interpolación, seleccione uno de los fotogramas e introduzca un valor en el campo Aceleración del inspector de propiedades.

    Para acelerar el comienzo de la interpolación, introduzca un valor negativo. Para acelerar el final de la interpolación, introduzca un valor positivo.

Creación de ajustes preestablecidos de aceleración o aceleraciones personalizadas

Los ajustes preestablecidos de aceleración son aceleraciones preconfiguradas que se pueden aplicar a un objeto del escenario.

Hay disponible un conjunto de ajustes preestablecidos de aceleración de uso común para la interpolación de forma. Podrá seleccionar el que desee en una lista de ajustes preestablecidos de aceleración y aplicarlo a la propiedad seleccionada. También puede aplicar una aceleración personalizada a una interpolación de forma.

  1. Haga clic en la capa que contenga una interpolación de forma en la línea de tiempo de Animate.

  2. Para abrir las propiedades de Interpolación, haga clic en la categoría Interpolación en el panel de propiedades.

    Propiedades de interpolación
    Propiedades de interpolación

  3. Seleccione el ajuste preestablecido que prefiera en el cuadro de diálogo emergente de tipos de aceleración. Haga doble clic en el tipo de ajuste preestablecido que desee aplicar. 

    Si decide aplicar la aceleración clásica, también puede aumentar o disminuir la intensidad de la aceleración moviendo el regulador. 

    Ajustes preestablecidos de tipos de aceleración
    Ajustes preestablecidos de tipos de aceleración

  4. Haga clic en el icono Editar situado junto a Aceleración para aplicar una aceleración personalizada. 

    En el cuadro de diálogo Aceleración personalizada se muestra un gráfico que representa el grado de movimiento en cada momento. El eje horizontal representa fotogramas y el eje vertical representa el porcentaje de cambio. El primer fotograma clave se representa como 0% y el último como 100%.

    La pendiente de la curva en el gráfico representa la velocidad de cambio del objeto. Cuando la curva es horizontal (sin pendiente), la velocidad de cambio es cero; cuando es vertical, el cambio se produce de forma instantánea.

    Gráfico de aceleración personalizada que muestra una velocidad constante
    Gráfico de aceleración personalizada que muestra una velocidad constante. Para abrir este diálogo, seleccione un fotograma en una interpolación de forma y haga clic en el botón Editar de la sección Aceleración del inspector de propiedades.

    Puede guardar una aceleración personalizada y volver a utilizarla seleccionándola en la lista Personalizada. Haga clic en el botón Guardar y aplicar en el modo de edición después de realizar los cambios. En la siguiente captura de pantalla puede ver el ajuste preestablecido personalizado de aceleración llamado MyEase1

    Ajuste preestablecido de la aceleración personalizado
    Ajuste preestablecido de la aceleración personalizado

    Puede utilizar las aceleraciones preestablecidas en diversos fragmentos en la línea de tiempo, para ello seleccione los grupos correspondientes y aplicar la aceleración.

    Ajustes preestablecidos de aceleración en varios intervalos
    Aplicación de ajustes preestablecidos de aceleración en varios intervalos

Control de cambios de formas con consejos

Para controlar cambios de forma más complejos o improbables, utilice los consejos de forma. Los consejos de forma identifican puntos que se corresponden 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 que la cara se convierta en una figura amorfa durante el cambio, los ojos siguen siendo reconocibles y cambian de manera independiente durante el proceso.

Consejos de forma como letras
Consejos de forma como letras

Los consejos de forma incluyen letras (de la a a la z) para identificar los puntos que se corresponden en las formas inicial y final. Puede utilizar hasta 26.

Los consejos de forma aparecen de color amarillo en los fotogramas clave iniciales, verde en los fotogramas clave finales y rojo cuando no se encuentran en una curva.

Para obtener un resultado óptimo al interpolar formas, siga las directrices que se indican a continuación:

  • En la interpolación de formas complejas, cree formas intermedias e interpólelas en lugar de definir sólo la forma inicial y final.

  • Compruebe que los consejos de forma son lógicos. Por ejemplo, si está utilizando tres consejos de forma para un triángulo, deben estar en el mismo orden en el triángulo original y en el triángulo que se va a interpolar. El orden no puede ser a,b,c en el primer fotograma clave y a,c,b en el segundo.

  • Es preferible colocar los consejos de forma en sentido contrario a las agujas del reloj a partir de la esquina superior izquierda de la forma.

Utilización de consejos de formas

  1. Seleccione el primer fotograma clave de una secuencia de forma interpolada.
  2. Seleccione Modificar > Forma > Añadir consejo de forma. El consejo de forma inicial aparece como un círculo rojo con la letra a en algún lugar de la forma.

  3. Colóquelo en un punto que desee marcar.
  4. Seleccione el último fotograma clave de la secuencia. El consejo para la forma final aparece como un círculo verde con la letra a en algún lugar de la forma.

  5. Coloque el consejo de forma en el punto de la forma final que se corresponde con el primer punto marcado.

  6. Para ver el cambio introducido con los consejos de forma, vuelva a reproducir la animación. Para afinar la interpolación, mueva los consejos de forma.
  7. Para añadir más consejos de forma, repita este proceso. Los nuevos consejos aparecen con las letras siguientes (b, c etcétera).

Visualización de todos los consejos de formas

  1. Seleccione Ver > Mostrar consejos de forma. Para poder seleccionar Mostrar consejos de forma, la capa y el fotograma clave que contienen los consejos de forma deben estar activos.

Eliminación de consejos de formas

  1. Arrástrelo fuera del escenario.

Eliminación de todos los consejos de formas

  1. Seleccione Modificar > Forma > Quitar todos los consejos.

Adición de interpolaciones de forma en trazos con anchura variable

Animate permite añadir interpolaciones de forma en trazos con anchura variable. Anteriormente, Animate solo admitía la creación de interpolaciones de forma para formas y trazos uniformes y sólidos. Por este motivo, los diseñadores no podían crear interpolaciones de forma para los trazos no uniformes, como trazos mejorados con la herramienta Anchura variable. La interpolación de trazos con anchura variable amplía enormemente las posibilidades de diseño de Animate

La adición de interpolaciones de forma a trazos sofisticados es similar a la adición de interpolaciones a una forma o a un trazo uniforme sólido. El flujo de trabajo requiere que defina la forma inicial y final de la interpolación. Animate creará los fotogramas de transición de la interpolación.

Acerca de la herramienta Anchura variable

La herramienta Anchura variable permite mejorar trazos sólidos uniformes para crear trazos sofisticados y atractivos. Para obtener información sobre cómo mejorar los trazos con la herramienta Anchura variable, consulte Mejora de trazos y formas con la herramienta Anchura variable.

Adición de interpolaciones de forma a trazos de anchura variable

  1. En Animate CC, dibuje una línea con la herramienta Línea.

    Trazo de línea con el valor de trazo definido en 2 px
    Trazo de línea dibujado con la herramienta Línea en el escenario con el valor de trazo definido en 2 px.

  2. Utilice la herramienta Anchura variable para añadir anchura en medio del trazo (consulte la figura siguiente). Para obtener información sobre el uso de la herramienta Anchura variable, consulte Mejora de trazos con la herramienta Anchura variable.

    Trazo de anchura variable con valor de 68,0 px
    Trazo de anchura variable creado con la herramienta Anchura variable con el valor de trazo definido en 68,0 px.

  3. Seleccione otro fotograma de la línea de tiempo, por ejemplo el fotograma 30, y cree la forma final del trazo para la interpolación.

    Forma final añadida al último fotograma clave de la interpolación de forma
    Forma final añadida al último fotograma clave de la interpolación de forma

  4. Haga clic en cualquier fotograma entre 1 y 30 y seleccione Crear interpolación de forma.

Adición de interpolaciones de forma a perfiles de anchura variable

Animate también le permite añadir interpolaciones de forma a trazos sofisticados guardados como perfiles de anchura variable. Puede aplicar perfiles de anchura a las formas iniciales y finales de una interpolación, y permitir que Animate cree una interpolación de forma suave.

Los perfiles de anchura son trazos sofisticados creados y guardados con la herramienta Anchura variable para facilitar su reutilización. Para obtener más información sobre los perfiles de anchura, consulte Almacenamiento de perfiles de anchura.

Para añadir interpolaciones de forma a perfiles de anchura variable, haga lo siguiente:

  1. En Animate, dibuje una línea en el escenario con la herramienta Línea.

    Trazo de línea con el valor de 2 px
    Trazo de línea dibujado con la herramienta Línea en el escenario con el valor de trazo definido en 2 px.

  2. En el inspector de propiedades, seleccione y aplique un perfil de anchura de la lista desplegable Anchura.

    Trazo de anchura variable con el valor de trazo de 68,0 px
    Trazo de anchura variable creado con la herramienta Anchura variable con el valor de trazo definido en 68,0 px.

  3. Seleccione otro fotograma de la línea de tiempo, por ejemplo el fotograma 30, y seleccione el perfil de anchura deseado de la lista desplegable Anchura en el inspector de propiedades.

  4. Para añadir la interpolación de forma a los perfiles de anchura seleccionados, haga clic con el botón derecho en cualquier fotograma entre 1 y 30, y seleccione Crear interpolación de forma.

Logotipo de Adobe

Inicia sesión en tu cuenta