Crear una nueva animación personalizada

Para abrir el panel de animaciones personalizadas, haz clic en el botón Custom Animations de la cabecera principal de Pitchdeck (en el tamaño de ventana Small se llama Animations). Se abrirá el panel de animación personalizada, donde puedes empezar a añadir tu propia animación con fotogramas clave.

Al abrir el panel de animaciones verás 2 fotogramas clave: el primero (0 %) y el último (100 %). Se añaden de forma predeterminada y no se pueden quitar, porque una animación con fotogramas clave necesita al menos un fotograma desde el que empezar y otro que indique dónde termina.

Seleccionar un fotograma clave para editarlo

Puedes pasar al instante de un fotograma clave a otro haciendo clic en él, en la fila de porcentajes de fotogramas clave de la parte superior del panel de animaciones personalizadas. Al hacer clic en un fotograma clave podrás editar sus propiedades.

Insertar nuevos fotogramas clave

Para añadir un fotograma clave entre el inicio y el final predeterminados, introduce su porcentaje (por ejemplo, 50) y selecciona Insert New Keyframe.

Cada fotograma clave nuevo se crea automáticamente con las mismas propiedades que el fotograma clave seleccionado en ese momento; así puedes ajustar las propiedades a partir de otros fotogramas clave que ya hayas añadido. El nuevo fotograma clave también queda seleccionado automáticamente después de hacer clic en el botón Insert New Keyframe.

Editar las propiedades de un fotograma clave

Puedes editar 5 propiedades distintas en cualquier fotograma clave de tu animación. Cualquier diferencia de propiedades entre tus fotogramas clave se anima automáticamente. Por ejemplo, si pones la escala a 2x en el fotograma clave del 0 % y a 1x en el del 100 %, se creará automáticamente una animación de "encogimiento".

• La propiedad X anima la posición horizontal (izquierda/derecha) del elemento en píxeles.
• La propiedad Y anima la posición vertical (arriba/abajo) del elemento en píxeles.
• La propiedad Opacity anima el porcentaje de transparencia del elemento.
• La propiedad Rotate anima los grados de rotación del elemento.
• La propiedad Scale anima el tamaño del elemento.

Copiar y pegar propiedades de fotogramas clave

Puedes copiar y pegar propiedades de un fotograma clave a otro: selecciona el fotograma clave cuyas propiedades quieres copiar, haz clic en el botón Copy Properties, selecciona el fotograma clave en el que quieres pegarlas y haz clic en el botón Paste Properties para pegar las propiedades copiadas en el fotograma clave seleccionado.

Las propiedades copiadas solo están disponibles hasta que cierras el panel. Puedes copiar y pegar propiedades entre cualquier fotograma clave de tus animaciones mientras el panel de animaciones personalizadas esté abierto; después de cerrarlo, ya no podrás pegar las propiedades copiadas.

Eliminar fotogramas clave

Para eliminar un fotograma clave, haz clic en él en la fila de porcentajes de fotogramas clave para seleccionarlo y luego haz clic en el botón Delete Keyframe para quitarlo de la línea de tiempo. Ten en cuenta que no puedes eliminar los fotogramas clave del 0 % ni del 100 %, porque son fotogramas clave predeterminados necesarios para la línea de tiempo de la animación.

Después de eliminar un fotograma clave, el del 0 % vuelve a seleccionarse automáticamente como fotograma clave activo para editar.

Eliminar un fotograma clave lo borra de forma permanente. Cuando eliminas un fotograma clave, desaparece para siempre de la línea de tiempo y no puedes deshacer la eliminación. Aun así, puedes usar Copy Properties en un fotograma clave, eliminarlo y pegar sus propiedades en otro fotograma clave mientras sigues editando la línea de tiempo de la animación.

Usar la vista previa en directo para ver tu animación

Para ver cómo queda tu animación con los fotogramas clave y las propiedades que has cambiado, fíjate en el área Live Preview, que está justo al lado de las propiedades del fotograma clave y directamente debajo de la línea de tiempo de la animación. Cualquier cambio que hagas en los fotogramas clave, las propiedades o el suavizado se muestra automáticamente en la vista previa en directo.

Puedes ajustar la velocidad de reproducción de la vista previa en directo. Si quieres ver cómo queda tu animación personalizada a distintas velocidades, arrastra a izquierda o derecha el control deslizante de velocidad que hay debajo de Live Preview para reducir o aumentar la velocidad de reproducción.

Configurar el suavizado de la animación

Puedes elegir el tipo de suavizado que necesita tu animación con una opción del selector Easing. El suavizado se aplica automáticamente a toda la línea de tiempo y actualiza el área Live Preview para que veas cómo cambia el movimiento de tu animación con el suavizado elegido.

Puedes elegir entre estas opciones de suavizado:

• Ease (Default)
• Linear
• Ease In
• Ease Out
• Ease In Out

Guardar tu nueva animación personalizada

Para guardar tu nueva animación, ponle un nombre en el campo de texto New Custom Animation Name y haz clic en Add New Animation

Las animaciones personalizadas solo se guardan y están disponibles en el archivo de Figma actual. Al guardar una animación, queda disponible en cualquier página de tu archivo de Figma actual. Sin embargo, tus animaciones guardadas no aparecerán si ejecutas Pitchdeck en un archivo de Figma distinto o nuevo, porque se guardan directamente en el archivo de Figma y no se pueden transferir a otro. Tendrás que volver a crear las animaciones en cada archivo de Figma nuevo. También puedes crear una página nueva en el archivo de Figma actual, donde seguirás teniendo disponibles las animaciones personalizadas guardadas en ese archivo.

Usar tus animaciones personalizadas guardadas

Cuando hayas guardado al menos una animación personalizada, puedes usarla en tus diapositivas: selecciona una capa en la pestaña Animations y abre su selector de animaciones (All effects… o el menú Animation). Verás una pestaña Custom en el selector con todas las animaciones personalizadas que has guardado.

Igual que con las demás animaciones predefinidas, también puedes aplicar tu animación personalizada a varias capas a la vez seleccionándolas juntas en la pestaña Animations.

Actualizar tus animaciones guardadas

Para actualizar una animación personalizada que ya guardaste, elige la animación en el selector Your Saved Animations; se cargarán la animación guardada y sus fotogramas clave en el panel de animación personalizada.

Después de elegir la animación guardada, edita los fotogramas clave y las propiedades que necesites. Cuando estés conforme con los cambios, haz clic en el botón Update Saved Animation para guardarlos y sobrescribir los fotogramas clave anteriores de la animación.

Ten en cuenta que, al actualizar una animación guardada, los fotogramas clave actualizados se aplican automáticamente a todas las capas de tus diapositivas que ya usaban esa animación personalizada.

Crea una animación nueva a partir de una guardada. Si quieres cargar una animación guardada y modificarla sin "sobrescribir" la versión guardada, puedes crear una animación nueva a partir de ella: introduce un nombre en New Custom Animation Name y haz clic en el botón Add New Animation.

Eliminar tus animaciones guardadas

Para eliminar una animación, selecciona cualquier opción de Your Saved Animations para cargarla y luego haz clic en el botón Delete Saved Animation para eliminarla.

Eliminar una animación guardada la borra de forma permanente y la quita de tus capas. Cuando eliminas una animación guardada, desaparece para siempre de la lista Your Saved Animations. Las capas de tus diapositivas que usaban esa animación personalizada pasarán a no tener ninguna animación aplicada.