Animación de trazo

Dibujar con el tiempo el contorno de elementos vectoriales y flechas, con revelado del relleno y una imagen en la punta.

Una bicicleta en proceso de dibujo con un lápiz seguidor, junto a la ilustración terminada.

Animación de trazo dibuja el contorno de los elementos a lo largo del tiempo, como a mano. Después, el mismo bloque revela el resto del elemento: el relleno aparece con un fundido y la etiqueta se escribe.

Funciona con trazados, elementos a mano alzada, polilíneas, elementos geométricos y flechas que tienen trazo.

Con ella puedes:

  • Dibujar elementos como a mano: primero el contorno y después el relleno y la etiqueta.
  • Dibujar varios elementos a la vez: al mismo tiempo o trazo a trazo.
  • Añadir una imagen seguidora: un lápiz o un pincel que viaja en la punta del contorno.

Crearlo

Animación de trazo resaltada entre Animación de opacidad y Capturar en tiempo real en el panel de acciones.

Añade un bloque que dibuja o borra el contorno de los elementos seleccionados.

  • Operación:
    1. Selecciona los elementos en el tablero.
    2. En el Modo animación, elige Animación de trazo en el panel de acciones.
  • Resultado: un bloque seleccionado empieza en el cabezal y dibuja los elementos.
    • Primer bloque de trazo: dibuja el contorno completo desde cero.
    • Bloques de trazo posteriores: parte del estado del contorno en el cabezal.
      • Sin dibujar: dibuja el contorno completo.
      • Dibujado por completo: borra el contorno.
      • Dibujado a medias: termina de dibujar el contorno.
    • Duración: depende de cuánto contorno se dibuja o se borra a la velocidad base de trazo del tablero, más hasta medio segundo para revelar el relleno y la etiqueta.
    • Continuar desde su final: el cabezal pasa al final del bloque, así que el siguiente bloque que crees empieza donde termina este.

Con varios elementos

Todos los contornos de la rueda al 20%, 50% y 100% de progreso, sin escalonado.

Al seleccionar varios elementos, un solo bloque de trazo dibuja todos sus contornos. El bloque guarda un solo progreso inicial y un solo progreso final para todos los elementos, así que los contornos dibujados hasta puntos distintos se igualan en su media:

  • Sin bloque de trazo todavía: sus contornos se dibujan desde cero.
  • Ninguno dibujado en el cabezal: se dibujan.
  • Todos completos: se borran.
  • En otro caso: el bloque empieza en su progreso medio y los termina de dibujar, así que cada elemento toma primero esa media.
  • Duración: el bloque dura lo que tarda el contorno más largo, más el revelado del relleno y la etiqueta. Todos los contornos se dibujan al mismo ritmo, así que los más cortos terminan antes.
  • Uno detrás de otro: activa Escalonar elementos y pon Ref en Fin. Consulta Escalonado.

El bloque de animación de trazo en el panel de línea de tiempo

Bloques numerados: 1 para un elemento, 2 para varios y 3 para elementos escalonados.

En el panel de línea de tiempo, los bloques de trazo se muestran en gris ().

  1. Los bloques que animan un solo elemento usan manejadores circulares.
  2. Los bloques que animan varios elementos usan manejadores cuadrados.
  3. Los bloques escalonados muestran una marca donde empieza cada elemento posterior.

En el tablero

El progreso del dibujo no tiene indicador ni manejadores. Se configura en el panel de atributos. Una imagen seguidora se muestra con sus propios manejadores mientras el bloque está seleccionado. Consulta La imagen seguidora.

Un bloque de trazo revela él mismo el relleno y la etiqueta, después del contorno. Mientras un bloque de opacidad se ejecuta en el mismo elemento, es el bloque de opacidad el que controla la transparencia del elemento, y el bloque de trazo omite su revelado. Consulta Animación de opacidad.

Flechas y contornos discontinuos

Las flechas y los contornos discontinuos se dibujan a su manera:

  • Flechas: se dibujan por etapas, y la etiqueta aparece al final.
    1. Las líneas de desplazamiento.
    2. El cuerpo.
    3. Las puntas.
  • Flechas dibujadas al revés: el dibujo empieza por el final de la flecha, y la etiqueta sigue apareciendo al final.
  • Contornos discontinuos: el patrón de trazos se mantiene en su sitio mientras se dibuja el contorno, en ambas direcciones.

La imagen seguidora

El lápiz seguidor con llamadas numeradas: 1 lo desplaza, 2 lo gira y 3 cambia su tamaño.

Una imagen puede viajar en la punta del contorno mientras se dibuja, como un lápiz o un pincel. Selecciona el bloque de trazo para mostrar su recuadro y sus manejadores rosas, que cambian solo la imagen:

  1. Desplazar: arrastra la imagen, o cualquier zona dentro de su rectángulo rosa, para desplazarla respecto al punto de dibujo. Úsalo para alinear la punta de tu lápiz o pincel con el contorno.
  2. Girar: arrastra el manejador de flecha curva para ajustar el ángulo de la imagen.
  3. Escalar: arrastra el manejador de doble flecha para aumentar o reducir su tamaño.

Dos marcas ayudan a alinearla:

  • Punto rosa: el punto de dibujo actual.
  • Rectángulo rosa: los límites de la imagen, incluidos sus márgenes transparentes.

Atributos

Los ajustes de un bloque de trazo están en la sección Animación de trazo del panel de atributos.

Tiempos

Controles de inicio, fin, duración y velocidad del dibujo de la rueda.
  • Tiempo: instantes de inicio y fin del bloque, en segundos. Cada tiempo se resalta con un borde mientras el cabezal está sobre él.
  • Duración: la duración total del bloque, incluidos el revelado, los elementos escalonados y las pausas de bloque.
  • Velocidad: multiplicador respecto a la velocidad base de trazo del tablero, que se mide en píxeles de contorno por segundo.
    • Se mide sobre la longitud dibujada, así que un contorno más largo tarda más a la misma velocidad.
    • Cambiarla cambia la duración del bloque.

Progreso

Progreso inicial en cero y progreso final en uno.
  • Progreso: dos valores, cuánto contorno está dibujado al inicio y al final, de 0 para nada a 1 para completo.
    • Un final por debajo del inicio borra el contorno.
    • Mantener velocidad, en la cabecera del panel de línea de tiempo, decide qué pasa al cambiar un valor:
      • Activado: la velocidad se mantiene y la duración se ajusta.
      • Desactivado: la duración no cambia.
El contorno de una rueda dibujado al 25, 50 y 100 por ciento.

Un inicio de 0,5 empieza con la mitad del contorno ya dibujada.

Revelado

Control de duración del revelado en los atributos de la animación de trazo.

Un bloque de trazo dibuja primero el contorno y después hace aparecer el relleno con un fundido y escribe la etiqueta. Duración de revelado fija cuánto tardan en aparecer, en segundos:

  • Positiva: aparecen después de completar el contorno, lo que puede alargar el bloque.
  • Negativa: empiezan a aparecer antes de completar el contorno. Cambiar entre valores negativos modifica el solapamiento sin mover el final del bloque.
El contorno de la cesta, su relleno parcialmente revelado y la cesta con todo su color.

Escalonado

Escalonado activado con un retraso de 0,6 segundos medido desde cada inicio.
  • Escalonar elementos: empieza los contornos de los elementos uno detrás de otro. Consulta Escalonar elementos.
  • Panel de reordenación: con Escalonar elementos activado, fija el orden en que empiezan los elementos. Consulta Escalonar elementos.
Consejo

Para revelar un dibujo trazo a trazo, activa Escalonar elementos y establece Ref en Fin.

  • Con Retraso en 0 s, cada contorno empieza en cuanto termina el anterior, sin esperar a que aparezcan su relleno y su etiqueta.
  • Aumenta el Retraso para dejar una pausa entre trazos.

Easing

Curvas lineales de entrada y salida, con el cruce en 0,5.
  • Easing: cómo se acelera y se frena el dibujo. El valor predeterminado es cuadrático de entrada y seno de salida. Consulta Easing.

Trazo múltiple

Menú Trazo múltiple con las opciones Uno a uno y A la vez.

Los contornos rugosos pueden tener varios trazos superpuestos. Trazo múltiple fija cómo se dibujan:

  • Uno a uno: dibuja cada trazo completo antes de empezar el siguiente. Es la opción predeterminada.
  • A la vez: dibuja todos los trazos al mismo tiempo, como un solo contorno.

Imagen seguidora

El lápiz seguidor, los controles de imagen y la opción Autorrotar.

La fila Imagen seguidora fija la imagen que viaja en la punta del contorno. Durante la reproducción, la imagen se mueve con el punto de dibujo y desaparece cuando termina el dibujo o el borrado de ese elemento.

  • Añadir: elige una imagen para el seguidor.
  • Reemplazar: elige la miniatura para escoger otra imagen.
  • Pegar del portapapeles: usa una imagen copiada.
  • Limpiar seguidor: quita la imagen.
  • Copiar seguidor desde animación: después elige otro bloque de trazo en el panel de línea de tiempo para copiar su imagen y sus ajustes.
  • Autorrotar: fija cómo gira la imagen mientras se mueve.
    • Activado: la imagen gira con la dirección del contorno. Es la opción predeterminada.
    • Desactivado: la imagen mantiene un ángulo fijo.

Acciones

Acciones de bloque

Eliminar, Cortar, Copiar, Pegar, Reasignar y Crear pausa de bloque en el panel de acciones.

Con un bloque de trazo seleccionado, el panel de acciones ofrece estas acciones de bloque:

Invertir la dirección

Invertir trazo resaltado entre las acciones de eliminar animaciones y crear una animación de posición.

Hace que los contornos se dibujen desde su final en lugar de desde su inicio.

  • Operación:
    1. Selecciona los elementos.
    2. Elige Invertir trazo en el panel de acciones.
  • Necesita: un bloque de trazo que dibuje los elementos en el cabezal.
  • Resultado: en esos bloques de trazo, los contornos de los elementos seleccionados se dibujan desde su final.
    • Cada elemento conserva su dirección: la dirección se guarda por elemento en cada bloque.
    • Elegirlo de nuevo: restaura la dirección. Si hay direcciones mezcladas, la primera vez se invierten todas.