Refuerza tu contenido con animaciones de entrada impulsadas por IA que no tienes que programar tú mismo. Chatea con AI Assistant en Storyline 360, describe el efecto que deseas en un lenguaje conversacional y observa cómo AI Assistant escribe el código y crea el accionador de JavaScript. Sigue leyendo para aprender cómo hacerlo.

• ¡Comience
• Aplica animaciones de entrada a uno o varios objetos
• Itera y crea animaciones de varios pasos
• Comprenda la compatibilidad

¡Comience

Sigue estos pasos para crear atractivas animaciones de entrada en JavaScript chateando con AI Assistant.

1. Escribe tus indicaciones. Haz clic en la pestaña AI Assistant de la derecha e introduce tus indicaciones en el cuadro de chat de la parte inferior. Las instrucciones pueden ser tan sencillas como «Sugerir una animación para esta diapositiva». Si ya has seleccionado un objeto, puedes decir algo como: «Haz que este objeto aparezca lentamente».
2. Genera el accionador. AI Assistant responde con un esquema para una animación adecuada, como se muestra en la imagen de abajo.

2. • Si lo prefieres, puedes saltarte el esquema pidiéndole a AI Assistant que cree el accionador de inmediato.
   • Una vez que apruebes el esquema, AI Assistant convierte tus instrucciones en código JavaScript y crea el accionador.
3. Revisa y edita el código (opcional). AI Assistant muestra el fragmento de código en la ventana de chat, pero está oculto de forma predeterminada. Haz clic en las comillas angulares del encabezado de la respuesta para ver el código, como se muestra en la imagen de abajo.

• • Para copiar el código, haz clic en el icono Copiar JavaScript (hojas de papel) situado debajo, a la derecha.
  • Si desea editar manualmente el código o ajustar la configuración del accionador, haga clic en el icono Abrir el activador (relámpago). Esto abre el cuadro de diálogo Asistente de activación, donde puede actualizar el nombre, modificar el código, ajustar la temporización y agregar condiciones.
  • De forma predeterminada, el accionador generado por la IA está vinculado al evento «Inicio de la línea de tiempo». Introduce un mensaje de seguimiento si quieres cambiarlo. Descubre cómo modificar los activadores de animación de JavaScript con IA en esta guía del usuario.

4. Obtenga una vista previa de la animación. Haga clic en el botón Vista previa para cambiar Storyline al modo de vista previa y ver cómo se reproduce la animación.
5. Refina el resultado. Durante la vista previa, puedes seguir chateando con AI Assistant para realizar más ajustes. Por ejemplo, puedes decir cosas como «Disminuye la animación 2 veces» o «Reproduce la animación en bucle hasta el infinito». Deshaz acciones simplemente preguntándolas en el chat. Los fragmentos de código anteriores también tienen un botón de activación de restauración para revertir o comparar diferentes versiones.
6. Comparte tus comentarios (opcional). Si te resulta útil el contenido generado, haz clic en el icono con el pulgar hacia arriba en la parte inferior izquierda, justo debajo del botón de vista previa. Si no es así, haz clic en el icono con el pulgar hacia abajo y comparte tus opiniones. Sus comentarios se enviarán directamente a nuestros equipos de producto e ingeniería.

Nota: AI Assistant aún no puede recordar conversaciones pasadas. Al cerrar y volver a abrir un proyecto, se restablece el chat.

Efectos de animación compatibles

AI Assistant puede generar numerosos efectos de animación de entrada populares, que incluyen:

• Desvanece
• ¡Entra volando
• Flota hacia adentro
• Giratorio
• Y más...

Nota: AI Assistant también puede inventar nuevas animaciones de entrada. Intenta experimentar para ver qué funciona. Por ejemplo, pídele a AI Assistant que «haga que los botones se muevan y se difuminen».

Efectos de animación no compatibles

Si bien es posible utilizar animaciones de enmascaramiento sencillas, es probable que no funcionen las que coincidan exactamente con las animaciones de enmascaramiento existentes en Storyline, o las animaciones de máscaras muy complejas. Estas incluyen, pero no se limitan a:

• Dividir
• Limpiar
• Forma
• Barras aleatorias

Consejos profesionales:

• ¿Necesitas inspiración creativa? Pide ideas a AI Assistant. Por ejemplo, «Sugiera animaciones para esta diapositiva».
• AI Assistant reconoce las selecciones de diapositivas, por lo que no siempre es necesario nombrar los objetos en las indicaciones.
• Puede aplicar animaciones de entrada de JavaScript a los objetos de las capas de la diapositiva, no solo a los objetos de la diapositiva base.
• Pide a AI Assistant que escriba comentarios de código detallados para ayudar a aclarar qué hace cada parte al inspeccionar el código JavaScript generado.
• Tenga cuidado al combinar transiciones diapositivas y animaciones de JavaScript, ya que algunas pueden entrar en conflicto y provocar resultados inesperados, especialmente con ciertos tipos de movimiento.

Aplica animaciones de entrada a uno o más objetos

Al trabajar con uno o más objetos en una diapositiva, AI Assistant ofrece flexibilidad a la hora de aplicar animaciones de entrada.

Anima objetos individuales

Especifique qué animación debe aplicarse a cada objeto individual. A continuación se muestra un ejemplo de cómo aplicar una animación diferente a cada objeto.

Aviso: mueve el cuadrado de izquierda a derecha, el círculo de arriba a abajo, la cruz de derecha a izquierda y el triángulo de abajo hacia arriba

Anima varios objetos

Anime todos los objetos con el mismo efecto de animación con una sola solicitud. El siguiente ejemplo muestra la misma animación aplicada a todos los objetos.

Aviso: Haz que los objetos aparezcan lentamente

Consejo profesional: AI Assistant crea un único accionador independientemente del número de animaciones y objetos. Si necesitas un accionador independiente para cada objeto, especifícalo en el chat.

Itera y crea animaciones de varios pasos

Conversar con AI Assistant para crear animaciones facilita la iteración. También te permite combinar efectos en animaciones de varios pasos, lo que aumenta la interactividad del contenido. Aquí te explicamos cómo hacerlo:

1. Comienza pidiéndole a AI Assistant que cree una animación inicial.
2. Haga clic en el botón Vista previa para entrar en el modo de vista previa. El cuadro de chat de IA permanece abierto durante la vista previa. Al hacer clic en el botón AI Assistant de la parte superior derecha, se oculta o se vuelve a abrir.
3. Mientras está en la vista previa, puede proporcionar más instrucciones para agregar nuevos efectos a las animaciones existentes. Puedes agregar tantos pasos como desees y AI Assistant reescribe el código manteniendo el mismo accionador.
4. Cada actualización actualiza automáticamente la vista previa, lo que te permite ver los cambios al instante.
5. ¿No estás satisfecho con los resultados? Recuerda que puedes deshacer acciones fácilmente preguntándole a AI Assistant en el chat o utilizando el botón Restore Trigger de fragmentos de código anteriores para volver a un paso específico o comparar versiones.

Consulta nuestro artículo de consejos y trucos para obtener más ideas y ejemplos rápidos.

¿Quieres crear interacciones más avanzadas? Lee esta guía del usuario para obtener más información.

Comprenda la compatibilidad

Las animaciones de entrada de JavaScript basadas en IA son exclusivas de Storyline 360 a partir del 2 de diciembre de 2025. Los proyectos con activadores de animación de JavaScript creados en AI Chat no se abrirán en versiones anteriores de Storyline 360. Para restablecer la compatibilidad, elimine el nombre del accionador en el activador JavaScript generado y, a continuación, guarde el archivo.