Creación de capas de la cronología en Animate

  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

Creación y organización de capas

Las capas permiten organizar las ilustraciones en los documentos. Los objetos de una capa pueden dibujarse y editarse sin que afecten a objetos de otras capas. En las zonas del escenario en las que no hay nada en una capa, pueden verse a través de ella las capas situadas debajo.

Para dibujar, pintar o modificar una capa o una carpeta, primero se debe seleccionar en la línea de tiempo para activarla. Un icono con forma de lápiz junto a una capa o carpeta de la línea de tiempo indica que la capa o carpeta está activa. Solo puede haber una capa activa en cada momento (aunque se pueda seleccionar más de una capa a la vez).

Cuando se crea un documento de Animate, este contiene una sola capa. Para organizar las ilustraciones, animaciones y los demás elementos del documento, añada más capas. Asimismo, es posible ocultar, bloquear o reordenar capas. El número de capas que pueden crearse solo está limitado por la memoria del equipo. Las capas no aumentan el tamaño del archivo SWF publicado. Solo los objetos que se ubican en las capas aumentan el tamaño del archivo.

Para organizar y gestionar las capas, cree carpetas y coloque en ellas las capas. Las carpetas de capas se pueden expandir o contraer en la línea de tiempo sin que ello afecte a lo que se muestra en el escenario. Utilice capas o carpetas distintas para los archivos de sonido, ActionScript, etiquetas de fotogramas y comentarios de fotogramas. El hecho de usar distintas capas ayuda a encontrar estos elementos con mayor facilidad cuando tenga que editarlos.

Si desea crear efectos sofisticados, utilice capas de guía especiales para que dibujar y editar sea más fácil, así como para crear capas de máscara.

Existen cinco tipos de capas que se pueden utilizar en Animate:

  • Las capas normales contienen la mayor parte de las ilustraciones en un archivo FLA.

  • Las capas de máscara incluyen objetos utilizados como máscaras para ocultar partes seleccionadas de capas bajo las mismas. Para obtener más información, consulte Uso de capas de máscara.

  • Las capas enmascaradas son las que se encuentran bajo una capa de máscara que se asocia a la capa de máscara. Solo está visible la parte de la capa de máscara revelada por la máscara. Para obtener más información, consulte Uso de capas de máscara.

  • Las capas de guía contienen trazos que se pueden utilizar para guiar la disposición de los objetos en las demás capas. Asimismo, se pueden utilizar para guiar el movimiento de las animaciones de interpolación clásica en otras capas. Para obtener más información, consulte Capas de guía y Creación de interpolación clásica de movimiento a lo largo de un trazado.

  • Las capas de guía se asocian a una capa de guía. Los objetos de la capa guiada se pueden organizar o animar a lo largo de trazos en la capa de guía. Las capas guiadas pueden incluir ilustraciones estáticas e interpolaciones clásicas, pero no interpolaciones de movimiento.

  • Las capas de interpolación de movimiento contienen objetos animados con interpolaciones de movimiento. Para obtener más información, consulte Animación interpolada.

  • Las capas de esqueleto contienen objetos con huesos de cinemática inversa asociados. Para obtener más información, consulte Uso de la herramienta Hueso para la animación de cinemática inversa.

Las capas de guía, enmascaradas, de máscara y normales pueden contener interpolaciones de movimiento o huesos de cinemática inversa. Si estos elementos se encuentran en una de estas capas, existen limitaciones de los tipos de contenido que se pueden añadir a la capa. Para obtener más información, consulte Interpolaciones de movimiento y Uso de la herramienta Hueso para la animación de cinemática inversa.

Creación de capas

Cuando se crea una capa, esta aparece sobre la capa seleccionada. La capa recién creada se convierte en la capa activa.

  1. Realice una de las acciones siguientes:
    • Haga clic en el botón de la nueva capa, situado en la parte inferior de la línea de tiempo.

    • Seleccione Insertar > Línea de tiempo > Capa.

    • Haga clic con el botón derecho del ratón (Windows) o con la tecla Control presionada (Macintosh) en el nombre de una capa de la línea de tiempo y elija Insertar capa en el menú contextual.

Creación de carpetas de capas

  1. Realice uno de los siguientes pasos:
    • Seleccione una capa o una carpeta en la línea de tiempo y seleccione Insertar > Línea de tiempo > Carpeta de capas.

    • Haga clic con el botón derecho del ratón (Windows) o con la tecla Control presionada (Macintosh) en el nombre de una capa de la línea de tiempo y elija Insertar carpeta en el menú contextual. La nueva carpeta aparece encima de la capa o la carpeta seleccionada.

    • Haga clic en el icono Nueva carpeta  situado en la parte inferior de la línea de tiempo. La nueva carpeta aparece encima de la capa o la carpeta seleccionada.

Organización de capas y carpetas de capas

Para organizar un documento, cambie el orden de las capas y carpetas en la línea de tiempo.

Las carpetas de capas sirven para organizar el flujo de trabajo, ya que permiten colocar las capas en una estructura de árbol. Para ver las capas que contiene una carpeta sin modificar las que están visibles en el escenario, expanda o contraiga la carpeta. Las carpetas pueden contener capas y otras carpetas, lo que permite organizar las capas de una manera muy parecida a como se organizan los archivos del equipo.

Los controles de capa de la línea de tiempo afectan a todas las capas de una carpeta. Por ejemplo, al bloquear la carpeta de una capa, se bloquean todas las capas de dicha carpeta.

  • Para situar una capa o una carpeta de capas en otra carpeta, arrastre el nombre de la capa o la carpeta hasta el nombre de la carpeta de capas de destino.
  • Para cambiar el orden de las capas o carpetas, arrastre hasta la posición adecuada una o varias capas o carpetas en la línea de tiempo.
  • Para expandir o contraer una carpeta, haga clic en el triángulo situado a la izquierda de su nombre.
  • Para expandir o contraer todas las carpetas, haga clic con el botón derecho (Windows) o mantenga la tecla Control (Macintosh) presionada y seleccione Expandir todas las carpetas o Contraer todas las carpetas.

Cambio de nombre de una capa o una carpeta

De forma predeterminada, Animate asigna nombres a las capas nuevas según el orden en el que se han creado: Capa 1, Capa 2, etcétera. Para expresar mejor su contenido, cambie el nombre de las capas.

  1. Realice uno de los siguientes pasos:
    • Haga doble clic en el nombre de la capa o carpeta de la línea de tiempo e introduzca un nombre nuevo.

    • Haga clic con el botón derecho del ratón (Windows) o con la tecla Control presionada (Macintosh) en el nombre de la capa o carpeta y elija Propiedades en el menú contextual. Escriba el nombre nuevo en el cuadro Nombre y haga clic en Aceptar.

    • Seleccione la capa o la carpeta en la línea de tiempo y elija Modificar > Línea de tiempo > Propiedades de capa. Escriba el nombre nuevo en el cuadro Nombre y haga clic en Aceptar.

Selección de una capa o una carpeta

  1. Realice una de las acciones siguientes:
    • Haga clic en el nombre de una capa o carpeta en la línea de tiempo.

    • Haga clic en cualquier fotograma en la línea de tiempo de la capa para seleccionarla.

    • En el escenario, seleccione un objeto ubicado en la capa para seleccionarla.

    • Para seleccionar capas o carpetas contiguas, con la tecla Mayús presionada, haga clic en los nombres correspondientes en la línea de tiempo.

    • Para seleccionar capas o carpetas no contiguas, con la tecla Ctrl (Windows) o Comando (Macintosh) presionada, haga clic en los nombres correspondientes en la línea de tiempo.

Copia de fotogramas a partir de una sola capa

  1. Selección de un intervalo de fotogramas en una capa. Para seleccionar la capa completa, haga clic en el nombre de la capa en la línea de tiempo.
  2. Seleccione Edición > Línea de tiempo > Copiar fotogramas.

  3. Haga clic en el fotograma en el que quiera empezar a pegar y seleccione Edición > Línea de tiempo > Pegar fotogramas. Para sustituir el número exacto de fotogramas copiados en la línea de tiempo de destino, utilice la función Pegar y sobrescribir fotogramas.

    Flujo de trabajo de pegar y sobrescribir fotogramas

    A. Seleccione fotogramas y cópielos. B. Haga clic con el botón derecho en el fotograma en el que desee pegar y seleccione Pegar y sobrescribir fotogramas. C. Los fotogramas pegados sobrescriben el número exacto de fotogramas en la línea de tiempo. 

Copia de fotogramas a partir de una carpeta de capas

  1. Para seleccionar la carpeta completa, contráigala (haga clic en el triángulo situado a la izquierda de su nombre en la línea de tiempo) y haga clic en el nombre. 

  2. Seleccione Edición > Línea de tiempo > Copiar fotogramas.

  3. Para crear una carpeta, seleccione Insertar > Línea de tiempo > Carpeta de capas.

  4. Haga clic en la nueva carpeta y seleccione Edición > Línea de tiempo > Pegar fotogramas.

Eliminación de una capa o una carpeta

  1. Para seleccionar la capa o carpeta, haga clic en su nombre en la línea de tiempo o en cualquier fotograma de la capa.
  2. Realice una de las acciones siguientes:
    • Haga clic en el botón Eliminar capa de la línea de tiempo.

    • Arrastre la capa o la carpeta hasta el botón Eliminar capa.

    • Haga clic con el botón derecho del ratón (Windows) o con la tecla Control presionada (Macintosh) en el nombre de una capa o carpeta y elija Eliminar capas en el menú contextual.

    Nota:

    Al eliminar una carpeta de capas, también se eliminan todas las capas ubicadas en ella y el contenido correspondiente.

Bloqueo o desbloqueo de una o varias capas o carpetas

  • Para bloquear una capa o carpeta, haga clic en la columna Bloquear situada a la derecha del nombre. Para desbloquear la capa o carpeta, haga clic de nuevo en la columna Bloquear.

  • Para bloquear todas las capas y carpetas, haga clic en el icono del candado. Para desbloquear todas las capas y carpetas, vuelva a hacer clic.

  • Para bloquear o desbloquear varias capas o carpetas, arrastre el puntero por la columna Bloquear.

  • Para bloquear todas las demás capas o carpetas, con la tecla Alt (Windows) u Opción (Macintosh) presionada, haga clic en la columna Bloquear. Para desbloquear todas las capas o carpetas, haga clic de nuevo en la columna Bloquear con la tecla Alt u Opción (Macintosh) presionada.

Copiar y pegar capas (solo CS5.5)

Puede copiar todas las capas y carpetas de capas de la línea de tiempo y pegarlas en la misma línea de tiempo o en otras. Es posible copiar cualquier tipo de capa.

Cuando se copian y pegan capas, la estructura de carpetas de capas de las capas copiadas no varía.

  1. Seleccione una o varias capas en la línea de tiempo haciendo clic en el nombre de capa. Haga clic en capas contiguas con la tecla Mayús presionada. Presione la tecla Control (Windows) o Comando (Macintosh) y haga clic para seleccionar capas no contiguas.

  2. Elija Edición > Línea de tiempo > Copiar capas o Cortar capas. También puede hacer clic con el botón derecho del ratón en las capas y elegir Copiar capas o Cortar capas en el menú contextual.

  3. En la línea de tiempo en la que quiera pegar, seleccione la capa inmediatamente inferior a la que quiere usar para insertar las capas pegadas.

  4. Seleccione Edición > Línea de tiempo > Pegar capas.

Las capas aparecerán en la línea de tiempo por encima de la capa seleccionada. Si ha seleccionado una carpeta de capas, las capas pegadas aparecerán dentro de la carpeta.

Para colocar una capa en una capa de máscara o una capa de guía, primero debe seleccionar una capa debajo de la máscara o la guía y, después, pegarla. No se pueden pegar capas de máscara, guía ni carpeta debajo de una capa de máscara o de guía.

También puede duplicar capas seleccionando una capa y eligiendo Edición > Línea de tiempo > Duplicar capas. Las nuevas capas incorporan la palabra “copia” en el nombre de capa.

Configuración de propiedades en varias capas

  1. En Animate, cree un archivo FLA o abra un archivo existente.

  2. Seleccione las capas cuyas propiedades quiera modificar, haga clic con el botón derecho del ratón y seleccione Propiedades.

  3. En el cuadro de diálogo Propiedades, modifique las propiedades que desee.

  4. Haga clic en Aceptar.

Visualización u ocultación de capas o carpetas

Una X de color rojo junto al nombre de la capa o de la carpeta en la línea de tiempo indica que está oculta. En la configuración de publicación, puede elegir si se incluirán capas ocultas al publicar un archivo SWF.

  • Para ocultar una capa o carpeta, haga clic en la columna Ojo a la derecha del nombre de la capa o carpeta en la línea de tiempo. Para mostrar la capa o carpeta, haga clic de nuevo.

  • Para ocultar todas las capas y carpetas en la línea de tiempo, haga clic en el icono Ojo. Para mostrar todas las capas y carpetas, vuelva a hacer clic en el icono.

  • Para mostrar u ocultar varias capas o carpetas, arrastre el puntero por la columna Ojo.

  • Para ocultar todas las capas y carpetas salvo la capa o la carpeta actual, con la tecla Alt (Windows) u Opción (Macintosh) presionada, haga clic en la columna del icono del ojo. Para mostrar todas las capas y carpetas, vuelva a hacer clic en ella con la tecla Alt u Opción presionada.

Visualización del contenido de una capa como contornos

Para distinguir a qué capa pertenece un objeto, puede mostrar todos los objetos de una capa con contornos coloreados.

  • Para mostrar todos los objetos de una capa como contornos, haga clic en la columna de contorno correspondiente, a la derecha del nombre de capa. Para desactivar la visualización de los contornos, vuelva a hacer clic en dicha columna.

  • Para mostrar los objetos de las capas como contornos, haga clic en el icono del contorno. Para desactivar la visualización de contornos en todas las capas, haga clic de nuevo.

  • Para mostrar como contornos los objetos de todas las capas menos los de la actual, haga clic en la columna Contorno presionando la tecla Alt (Windows) u Opción (Macintosh). Para desactivar la visualización de contornos para todas las capas, haga clic de nuevo mientras presiona Alt + Clic u Opción.

Nota:

Los trazados de movimiento de la capa también utilizan el color del contorno de la capa.

Cambio del color de contorno de una capa

  1. Realice una de las acciones siguientes:
    • Haga doble clic en el icono de la capa (el icono a la izquierda del nombre de la capa) en la cronología.

    • Haga clic con el botón derecho del ratón (Windows) o con la tecla Control presionada (Macintosh) en el nombre de la capa y elija Propiedades en el menú contextual.

    • Seleccione la capa en la línea de tiempo y seleccione Modificar > Línea de tiempo > Propiedades de capa.

  2. En el cuadro de diálogo Propiedades de capa, haga clic en el cuadro Color de contorno, seleccione un nuevo color y haga clic en Aceptar.

Visualización de capas y carpetas de capas

Visualización u ocultación de capas o carpetas

Una X de color rojo junto al nombre de la capa o de la carpeta en la línea de tiempo indica que está oculta. En la configuración de publicación, puede elegir si se incluirán capas ocultas al publicar un archivo SWF.

  • Para ocultar una capa o carpeta, haga clic en la columna Ojo a la derecha del nombre de la capa o carpeta en la línea de tiempo. Para mostrar la capa o carpeta, haga clic de nuevo.

  • Para ocultar todas las capas y carpetas en la línea de tiempo, haga clic en el icono Ojo. Para mostrar todas las capas y carpetas, vuelva a hacer clic en el icono.

  • Para mostrar u ocultar varias capas o carpetas, arrastre el puntero por la columna Ojo.

  • Para ocultar todas las capas y carpetas salvo la capa o carpeta actual, con la tecla Alt (Windows) u Opción (Macintosh) presionada, haga clic en la columna con el icono del ojo. Para mostrar todas las capas y carpetas, vuelva a hacer clic en ella con la tecla Alt u Opción presionada.

Visualización del contenido de una capa como contornos

Para distinguir a qué capa pertenece un objeto, puede mostrar todos los objetos de una capa con contornos coloreados.

  • Para mostrar todos los objetos de una capa como contornos, haga clic en la columna de contorno correspondiente, a la derecha del nombre de capa. Para desactivar la visualización de los contornos, vuelva a hacer clic en dicha columna.

  • Para mostrar los objetos de las capas como contornos, haga clic en el icono del contorno. Para desactivar la visualización de contornos en todas las capas, haga clic de nuevo.

  • Para mostrar objetos de todas las capas salvo la actual, haga clic en la en la columna del contorno mientras presiona la tecla Alt (Windows) u Opción (Macintosh). Para desactivar la visualización de contornos para todas las capas, haga clic de nuevo mientras presiona Alt u Opción.

Cambio del color de contorno de una capa

  1. Realice una de las acciones siguientes:
    • Haga doble clic en el icono de la capa (el icono a la izquierda del nombre de la capa) en la línea de tiempo.

    • Haga clic con el botón derecho del ratón (Windows) o mantenga la tecla Control (Macintosh) presionada en el nombre de la capa y elija Propiedades en el menú contextual.

    • Seleccione la capa en la línea de tiempo y seleccione Modificar > Línea de tiempo > Propiedades de capa.

  2. En el cuadro de diálogo Propiedades de capa, haga clic en el cuadro Color de contorno, seleccione un nuevo color y haga clic en Aceptar.

Nota:

Los trazados de movimiento de la capa también utilizan el color del contorno de la capa.

Definición de la transparencia de capas

  1. En Animate, cree un archivo FLA o abra uno existente.

  2. Pulse Mayús y haga clic en la columna del icono del ojo que hay en la línea de tiempo para definir la visibilidad en transparente.

    Nota:

    El hecho de hacer clic con la tecla Mayús presionada no afecta a las capas ocultas.

    Definición de la transparencia de capas
    Definición de la transparencia de capas

  3. Utilice cualquiera de las siguientes opciones para definir la transparencia de las capas:

    • Haga clic con el botón derecho en cualquier capa y seleccione Propiedades en el menú contextual. En el cuadro de diálogo Propiedades de capa, seleccione Visibilidad > Transparente.
    • Haga clic con el botón derecho en cualquier capa y seleccione Mostrar otras como transparentes.
    Propiedades de capa
    Propiedades de capa

  4. Haga clic en Aceptar.

Nota:

La transparencia de capa no tiene ningún efecto en las capas ocultas. 

Uso de capas avanzadas

Con el modo Capas avanzadas de Animate, todas las capas de la línea de tiempo se publican como símbolos. El modo Capas avanzadas le permite acceder a las siguientes características:

El modo Capas avanzadas está habilitado de forma predeterminada. Puede habilitar o deshabilitar el modo Capas avanzadas en Modificar > Documento. Después de aplicar los cambios, haga clic en Establecer como valor predeterminado para preservar la configuración actual y utilizarla en otros documentos y sesiones de Animate. 

Modo Capas avanzadas
Modo Capas avanzadas

Al acceder a estos símbolos con un script en Animate, hay que llamarlos usando las capas como objetos. Por ejemplo, si no usa capas avanzadas, puede acceder directamente a un símbolo mediante un script como el del siguiente ejemplo: 

getchildbyname("symbol1");

Sin embargo, si utiliza capas avanzadas, solo puede acceder al símbolo a través de una capa usando un script como el del siguiente ejemplo:

Layer=getchildbyname("L1");

Layer.getchildbyname("symbol1");

Código de ejemplo para acceder a los símbolos usando capas avanzadas en el tipo de documento AS3: 

Var Layer:MovieClip =MovieClip(getchildbyname("L1")); Layer.getchildbyname("symbol1");

Código de ejemplo para acceder a los símbolos usando capas avanzadas en el tipo de documento HTML5 Canvas: 

Layer=this.getchildbyname("L1"); Layer.getchildbyname("symbol1");

En la ilustración siguiente se muestra cómo acceder a un símbolo utilizando un script con capas avanzadas y sin ellas. 

Ilustración de cómo acceder a un símbolo con y sin capas avanzadas
Ilustración de cómo acceder a un símbolo con y sin capas avanzadas

Nota:

El tamaño de los proyectos de animación publicados puede aumentar con el uso de capas avanzadas en Animate. Si encuentra cualquier problema al acceder a las funciones de cámara o profundidad de capa, compruebe si las capas avanzadas están activadas. Si están desactivadas, actívelas para obtener el comportamiento previsto. 

Aplicación de efectos de capa

Anteriormente, los filtros y los efectos de color solo se aplicaban a los clips de película. Mediante el uso de capas avanzadas, los filtros y los efectos de color ahora se pueden aplicar a un fotograma o varios fotogramas seleccionados y, por extensión, a todo su contenido, incluidas formas, objetos de dibujo, símbolos gráficos, etc. Los efectos de capa también se pueden interpolar utilizando la interpolación clásica, de forma y de cinemática inversa entre fotogramas.

Puede aplicar efectos de capa a uno o más fotogramas seleccionando los fotogramas que desee. También puede aplicarlos a todos los fotogramas de una capa seleccionando la capa entera. Los efectos de capa también se pueden aplicar en la línea de tiempo de un símbolo, como un clip de película o un símbolo gráfico, o a todas las escenas.

Nota:

Los efectos de capa solo se pueden aplicar cuando el modo Capas avanzadas está activado. Es posible que deba habilitar explícitamente el modo Capas avanzadas para poder usar esta funcionalidad en los archivos.

Uso de filtros para fotogramas

Para agregar filtros a un fotograma particular, primero seleccione el fotograma. En el panel del inspector de propiedades se cargarán las propiedades específicas del fotograma. Haga clic en el icono + de la lista desplegable Filtros

Filtros de fotograma
Filtros de fotograma

Al agregar filtros a fotogramas, el inspector de propiedades aparece como se muestra en la siguiente captura de pantalla. 

Puede establecer las propiedades que desee para cada uno de los filtros y aplicarlas en el nivel de fotograma. El interpolado es aplicable para todos los filtros de fotograma. 

Propiedades de los filtros de fotograma en el inspector de propiedades
Propiedades de los filtros de fotograma en el inspector de propiedades

Nota:

Los efectos de capa solo se admiten en el tipo de documento ActionScript 3. El interpolado de movimiento y las capas de cámara no admiten efectos de capa. 

Uso de efectos de color

Para aplicar un efecto de color a un fotograma particular, primero seleccione el fotograma. En el panel del inspector de propiedades se cargarán las propiedades específicas del fotograma. Elija cualquier propiedad de color que desee en el panel del inspector de propiedades.

Efectos de color
Efectos de color

Usar los modos de mezcla

Para aplicar modos de mezcla en un determinado fotograma, en primer lugar seleccione el fotograma y elija uno de los modos de mezcla que aparecen en la sección Visualización del panel Frame properties (Propiedades de fotograma).

Al aplicar mezclas en capas o fotogramas, se aplican a todo el contenido de estas, incluyendo formas, objetos de dibujo y símbolos gráficos. Todos los objetos de una capa se mezclan con los objetos de otra capa según el modo de mezcla que se aplique a ese fotograma.

Modos de mezcla de capas

Para obtener más información sobre el uso de los modos de mezcla, consulte Aplicación de modos de mezcla.

Mejorar sus animaciones con los efectos de capa

Aplicación de profundidad de capa

Es posible que los animadores quieran colocar las capas en diferentes planos de una animación en 2D para crear una ilusión de profundidad. 

La profundidad de las capas se puede cambiar dinámicamente en el panel Profundidad de la capa. Para abrir el panel Profundidad de la capa, haga clic en Ventana > Profundidad de la capa.

Profundidad de capa que representa cada una de ellas
Profundidad de capa que representa cada una de ellas

Nota:

Puede establecer los valores mínimo y máximo de la profundidad de capa en el intervalo entre -5000 y -10 000.

Tal como se ve en la captura de pantalla anterior, los valores de profundidad de capa se muestran junto a cada nombre de capa para un fotograma determinado.

  • Pase el puntero del ratón por encima de cada valor, haga clic y arrastre el regulador a la derecha o la izquierda.
  • Para reducir la profundidad, arrastre el regulador a la izquierda. Para aumentar la profundidad, arrastre el regulador a la derecha.  
  • Puede utilizar valores positivos inferiores para representar los objetos más cercanos y valores positivos superiores para representar los más lejanos.

Puede interpolar los valores de profundidad de capa en cualquiera de los grupos de interpolación de la animación. 

Cada capa se representa con líneas de un color propio en el panel de profundidad de capa. Puede ver los colores que representan cada una de las capas en la línea de tiempo. 

También puede aumentar o reducir la profundidad de los objetos que hay en cada capa moviendo las líneas multicolor hacia arriba o hacia abajo.

  • Para reducir la profundidad de los objetos de una capa, haga clic en la línea y desplácela hacia arriba.
  • Para aumentar la profundidad de los objetos de una capa, haga clic en la línea y desplácela hacia abajo.

Ilustración que representa animaciones con y sin profundidad de capa:

Contenido sin profundidad de capa
Contenido sin profundidad de capa

Contenido con profundidad de capa
Contenido con profundidad de capa

Ilustración que representa una animación cuando se aplica profundidad de capa:

Puede utilizar la cámara en capas de planos múltiples para crear un efecto de paralaje o zoom en el contenido de un plano. También puede bloquear la cámara en una capa específica o aplicar efectos de cámara en tiempo de ejecución mediante API interactivas. Para obtener más información, consulte Creación de efecto de paralaje mediante la profundidad de la cámara y la capa.

Nota:

La profundidad de capa solo se puede aplicar en la línea de tiempo principal.

Conservación del tamaño para la profundidad de capa

Puede cambiar la profundidad de capa de los objetos sin que ello afecte a su tamaño o posición. Para utilizar la funcionalidad de mantenimiento del tamaño, haga clic en el botón Conservar tamaño que hay en la esquina superior derecha del panel Profundidad de la capa.

Puede usar la opción Conservar tamaño de dos modos:

  • Haga clic en el botón Conservar tamaño y modifique la profundidad de la capa que quiera. El botón Conservar tamaño se activa automáticamente.
  • Mantenga pulsada la tecla Alt para habilitar temporalmente la opción Conservar tamaño mientras arrastra los valores de la profundidad de la capa.
Conservación del tamaño para la profundidad de capa
Conservación del tamaño para la profundidad de capa

Aplicación de la profundidad de capa en tiempo de ejecución

También puede introducir la cámara en objetos en tiempo de ejecución y aplicar efectos con las API de la cámara. Para obtener más información, consulte Uso de la cámara interactiva en tiempo de ejecución

API de profundidad de la capa para AS3

Puede administrar las capas en el tiempo de ejecución usando las API. Por ejemplo, puede hacerlo en el tiempo de ejecución en el que desee introducir una capa extra en la animación o reducir la profundidad de una de las capas de la animación. 

Método

Prototipo

Ejemplo

Descripción

setLayerZDepth

fl.Layer.setLayerZDepth(timeline,
layerName,zDepth)

fl.Layer.setLayerZDepth("layerName", 100);

Establezca el valor de profundidad Z de una capa en concreto.

getLayerZDepth

fl.Layer.getLayerZDepth(layerName) :zDepth

fl.Layer.getLayerZDepth("layerName");

Devuelve el valor de profundidad Z de una capa en concreto.

addNewLayer

fl.Layer.addNewLayer(layerName,
zDepth=0)

fl.Layer.addNewLayer("layerName",-80);

Añada una capa nueva a la cronología y establezca la profundidad Z.

removeLayer

fl.Layer.removeLayer(layerName)

fl.Layer.removeLayer("layerName");

Elimina una capa de la línea de tiempo.

API de la profundidad de la capa para HTML Canvas

Método

Prototipo

Ejemplo

Descripción

setLayerZDepth

AdobeAn.Layer.setLayerZDepth(layerName,
zDepth)

console.log(fl.Layer.setLayerZDepth
("layerName",100));

Establezca el valor de profundidad Z de una capa en concreto.

getLayerZDepth

AdobeAn.Layer.getLayerZDepth(layerName)
:zDepth

console.log(fl.Layer.getLayerZDepth
("layerName"));

Devuelve el valor de profundidad Z de una capa en concreto.

Asociación de capas

Animate le permite asociar una capa con otra. La asociación de capas es una manera fácil de permitir que una capa/objeto de la animación controle la otra capa/objeto. Como diseñador de animaciones o videojuegos, puede acelerar el tiempo de la animación, ya que puede controlar los movimientos de distintas partes de un carácter con más facilidad.

Para ver la opción de asociación de capas, es necesario que la opción Capas avanzadas esté habilitada. De forma predeterminada, la opción Capas avanzadas está activada para los archivos nuevos. Para habilitar la vista de asociación de capas, haga clic en el icono del símbolo de jerarquía en la esquina superior derecha de la línea de tiempo. 

Visualización de la asociación de capas
Visualización de la asociación de capas

Nota:

La asociación de objetos deformados funciona solo cuando el punto de transformación del objeto de la capa secundaria está sobre el objeto de la capa primaria.

Capas primarias y secundarias

En la vista de asociación, al arrastrar la capa 1 encima de la capa 2, la capa 1 se convierte en la capa secundaria de la capa primaria, que es la capa 2. El objeto de la capa secundaria hereda la posición y la rotación del objeto de la primaria, además de tener sus propias propiedades. Así pues, al mover o rotar la capa primaria, la secundaria también se mueve o se rota. Puede establecer múltiples relaciones primarias-secundarias para crear una jerarquía.

Asociar capas

Para conectar una capa con otra, haga clic en el control de capa (extremo de color) y arrástrelo sobre la otra capa. Otra opción es hacer clic en cualquier punto del espacio rectangular horizontal adyacente al nombre de la capa y arrastrarlo sobre la otra capa. También puede hacer clic en cualquier capa y elegir su capa primaria en la lista desplegable. 

En cuanto intente hacer clic y arrastrar la línea, aparecerá una línea de puntos junto al extremo de color de la capa. Al terminar la acción de hacer clic y arrastrar, se establece una conexión primaria-secundaria entre las dos capas.

Establecimiento de la capa primaria
Establecimiento de la capa primaria

El extremo de color de más a la izquierda en la jerarquía de la vista de asociación de capas representa la capa primaria. La jerarquía primaria-secundaria se mueve de izquierda a derecha.

Puede eliminar la conexión haciendo clic en el encabezado de color de cualquier capa, arrastrando la línea de puntos y, luego, soltándola. Otra opción es hacer clic en el espacio horizontal y, después, en Quitar principal, como se muestra en la siguiente captura de pantalla. 

Eliminación de la capa principal
Eliminación de la capa principal

En las capturas de pantalla siguientes, puede ver las imágenes de antes y después de las posiciones y la jerarquía de las capas al usar la asociación de capas.

Antes y después de la aplicación de la asociación de capas
Antes y después de la aplicación de la asociación de capas

A continuación se muestra un ejemplo de ilustración que representa el uso de la asociación de capas para partes del cuerpo humano.

Ejemplo de partes del cuerpo con asociación de capas
Ejemplo de partes del cuerpo con asociación de capas

En la ilustración anterior,

  • el torso es la capa primaria de todas las partes del cuerpo.
  • Legs_thigh es la capa primaria de otras partes de la pierna, como Sneaker, Leg_lower y Ankle.
  • Head es una capa secundaria de su capa primaria, Neck, y Torso es la capa primaria de Neck. Así pues, siempre que arrastre el cuello para alejarlo del cuerpo, la parte de la cabeza se moverá junto a él.
Nota:

La asociación es una propiedad del marco que debe establecer para cada marco clave en la capa secundaria. En un marco clave, puede romper o volver a asociar la capa secundaria a otra capa primaria.

Escalar, sesgar y girar en la asociación de capas

A partir de Animate 2022, la asociación de capas se ha mejorado para propagar las propiedades de escala, sesgo y giro, además de las propiedades de posición y rotación del objeto principal. De forma predeterminada, todas las propiedades se propagan, pero la propagación de la escala, el sesgo y el giro se puede desactivar o activar en el menú emergente de asociación, lo cual se puede realizar si mantiene pulsado el botón de vista Mostrar asociación en el panel de la cronología, tal y como se muestra a continuación.

Scale_Skew_1
Admite las transformaciones escalar, sesgar y girar en la asociación de capas

Además, se pueden cambiar los ajustes de propagar escala, sesgar y girar para realizar cambios momentáneos con una tecla modificadora al transformarlas con la herramienta Transformación libre. Para anular temporalmente esta configuración, mantenga pulsada la tecla acento (') mientras escala o sesga el objeto con la herramienta Transformación libre. Esto resulta útil cuando desea cambiar momentáneamente el comportamiento de propagación para las nuevas propiedades compatibles.

Scale_Skew_2
Modificador de teclado para activar o desactivar la configuración de propagación

Tutorial sobre la asociación de capas

Logotipo de Adobe

Inicia sesión en tu cuenta