Los procedimientos en este documento requieren que use recursos como imágenes y archivos de proyectos de Adobe Captivate de ejemplo. Puede optar por usar sus propios recursos y ejemplos. Sin embargo, se recomienda que descargue y extraiga el siguiente archivo Zip en su equipo:
Última actualización el
Mediante efectos es más fácil dirigir la atención de los usuarios a objetos o áreas concretas de una diapositiva. En esta sección, aplicaremos efectos a objetos de nuestro proyecto.
Recursos y ejemplos
Aplicar efectos a objetos
Los efectos de Captivate comienzan en el triángulo verde mostrado a continuación y terminan en el cuadrado rojo. El efecto termina en el centro del objeto.
En el proyecto de muestra incluido en este tutorial usaremos la siguiente diapositiva para aplicar efectos a las flechas izquierda y derecha:
- La flecha derecha debe hacer su entrada por el lado derecho de la diapositiva.
- La flecha izquierda debe entrar por el lado izquierdo de la diapositiva.
-
En la carpeta comprimida descargada, vaya a la subcarpeta samples y abra:
apply-effects.cptx
Nota:No es obligatorio que descargue el archivo de proyecto incluido con este tutorial. Aun así podrá seguir los pasos de este procedimiento. Pero debe crear un nuevo proyecto en Captivate con una diapositiva similar a la mostrada sobre estas líneas.
-
En la Tira de película, navegue a la diapositiva titulada Resumen.
-
Para aplicar efectos a la flecha izquierda, haga clic con el botón derecho del ratón en la diapositiva y seleccione Aplicar efecto.
-
En la sección Efectos, elija la categoría Entrada en la tercera lista desplegable.
Los efectos de entrada disponibles se muestran en el panel siguiente.
Para ver el efecto aplicado a un objeto en una diapositiva, pase el puntero sobre el efecto.
-
Elija el efecto Entrada lenta derecha.
-
Para la flecha derecha, configure Entrada lenta izquierda.
Al trabajar con efectos, conviene previsualizar los progresos frecuentemente. Así siempre tendremos en todo momento una idea clara de cómo se verán los efectos en la diapositiva.
-
Haga clic en Vista previa en la barra de herramientas y elija Reproducir diapositiva.
Vamos a ver el procedimiento que hemos completado.
Haga clic en Vista previa en la barra de herramientas y luego elija Proyecto para obtener una vista previa de todo el proyecto.
Aplicar efectos basado en eventos
Puede aplicar efectos a objetos activados por acciones del usuario (eventos). Puede aplicar un efecto a un objeto que solo se activa cuando se realiza una acción en el objeto.
En nuestro proyecto de muestra, aplicaremos un efecto para destacar la mesa de Samantha en el plano de la oficina. La diapositiva al final de este procedimiento se verá así:
Si el usuario hace clic en el botón Where is Sam's desk, se activa un efecto en el resalte azul que identifica la ubicación de la mesa de Samantha en el plano.
-
En la carpeta comprimida descargada, vaya a la subcarpeta samples y abra:
apply-effects.cptx
Nota:No es obligatorio que descargue el archivo de proyecto incluido con este tutorial. Aun así podrá seguir los pasos de este procedimiento. Pero debe crear un nuevo proyecto en Captivate con una diapositiva similar a la mostrada sobre estas líneas.
-
En la Tira de película, vaya a la diapositiva titulada Samantha.
En esta diapositiva, primero colocamos un resalte azul alrededor de la mesa de Samantha en el plano.
-
En la barra de herramientas, haga clic en Formas y elija la rectangular.
-
Dibuje la forma rectangular sobre la mesa de Sam en el plano.
-
En el inspector de Propiedades, introduzca las siguientes propiedades para el rectángulo:
Nombre: mesa_sam (usaremos el nombre posteriormente, al aplicar un efecto a este objeto)
Opacidad: 0% (hace visible la imagen de la mesa de Sam debajo de este objeto )
Si el inspector de Propiedades no está visible a la derecha del área de trabajo, haga clic en Propiedades en la esquina derecha de la barra de herramientas.
-
En la barra de herramientas, haga clic en Interacciones y elija Botón.
El objeto de botón se coloca en la diapositiva.
-
En el inspector de Propiedades, configure estas para el botón:
Where is Sam's desk
-
Vaya a la ficha Acciones.
-
En la lista desplegable Si aprueba, elija Aplicar efecto.
-
En la lista desplegable Nombre del objeto, elija mesa_sam y haga clic en
. -
En la sección Efectos, elija la categoría Énfasis en la tercera lista desplegable.
-
En la lista de efectos, seleccione Aumentar y girar.
Vamos a ver el procedimiento que hemos completado.
Haga clic en Vista previa en la barra de herramientas y luego elija Proyecto para obtener una vista previa de todo el proyecto.
Usar objetos dinámicos
Los objetos dinámicos en Captivate permiten mostrar contenido de forma condicional cuando un usuario pasa el puntero sobre un área dinámica predefinida en una diapositiva. Los objetos dinámicos son similares a la información de herramientas en la mayoría de las aplicaciones de escritorio. Pero con los objetos dinámicos además de texto se pueden mostrar imágenes e incluso diapositivas (denominadas minidiapositivas) en Captivate.
Añadir leyendas dinámicas
Nota:
Aquí [INTERNAL NOTE: Pending hosting] puede ver el resultado HTML5 del procedimiento descrito en esta sección. Puede usarlo como referencia durante el siguiente procedimiento:
Vamos a añadir una leyenda dinámica que aparecerá si un usuario coloca el puntero sobre la imagen del plano de la oficina en la siguiente diapositiva:
-
En la carpeta comprimida descargada, vaya a la subcarpeta samples y abra:
apply-effects.cptx
Nota:No es obligatorio que descargue el archivo de proyecto incluido con este tutorial. Aun así podrá seguir los pasos de este procedimiento. Pero debe crear un nuevo proyecto en Captivate con una diapositiva similar a la mostrada sobre estas líneas.
-
En la Tira de película del proyecto, vaya a la diapositiva titulada Samantha.
-
En la barra de herramientas, haga clic en Objetos y elija Leyenda dinámica.
Al agregar una leyenda dinámica a una diapositiva, el objeto tiene dos partes:
Leyenda dinámica: leyenda de texto que aparece de forma condicional (como la información de herramientas)
Área dinámica: área de tamaño modificable por encima de la que el usuario debe mover el puntero para que se muestre el texto.
-
En la leyenda, escriba el texto:
ESTUDIOS LUNARSPHERE, Planta 4, Plano de planta
-
Utilice los controladores para cambiar la posición y el tamaño del área dinámica de modo que cubra la imagen del plano en la parte derecha de la diapositiva.
-
Coloque la leyenda de texto en la parte inferior izquierda de la imagen, como se indica al principio de este procedimiento.
-
Veamos cómo se muestra la leyenda dinámica.
Haga clic en Vista previa en la barra de herramientas y luego elija Proyecto para obtener una vista previa de todo el proyecto.
Vamos a ver el procedimiento que hemos completado.
Haga clic en Vista previa en la barra de herramientas y luego elija Proyecto para obtener una vista previa de todo el proyecto.
Añadir imágenes dinámicas
Nota:
Aquí [INTERNAL NOTE: Pending hosting] puede ver el resultado HTML5 del procedimiento descrito en esta sección. Puede usarlo como referencia durante el siguiente procedimiento:
El objeto de imagen dinámica muestra una imagen cuando el usuario pasa el puntero sobre el área dinámica de una diapositiva.
Vamos a añadir una forma rectangular a la siguiente diapositiva. Luego añadiremos una imagen dinámica para que, al pasar el puntero sobre la forma, se muestre una imagen del equipo de Samantha:
-
En la carpeta comprimida descargada, vaya a la subcarpeta samples y abra:
apply-effects.cptx
Nota:No es obligatorio que descargue el archivo de proyecto incluido con este tutorial. Aun así podrá seguir los pasos de este procedimiento. Pero debe crear un nuevo proyecto en Captivate con una diapositiva similar a la mostrada sobre estas líneas.
-
En la Tira de película, vaya a la diapositiva titulada Samantha.
-
En la barra de herramientas, haga clic en Formas y elija la rectangular.
-
Dibuje la forma rectangular como se muestra arriba.
-
Haga doble clic en la forma e introduzca el siguiente texto:
Pase el puntero por encima de este texto para ver al equipo de Samantha
A continuación, añadiremos un imagen dinámica sobre esta forma.
-
Haga clic en Objetos y elija Imagen dinámica.
Se muestra un cuadro de diálogo para que seleccione un archivo de imagen guardado en su equipo.
-
En la carpeta de archivos descargados, vaya a la subcarpeta assets.
-
Elija el archivo sams_team y haga clic en Abrir.
Al añadir una imagen dinámica a una diapositiva, el objeto tiene dos partes:
Imagen dinámica: imagen mostrada de forma condicional.
Área dinámica: área de tamaño modificable por encima de la que el usuario debe mover el puntero para que se muestre la imagen.
-
Utilice los controles para modificar la posición y el tamaño del área dinámica de modo que cubra la forma añadida en el paso 3 de la sección anterior.
-
Coloque la imagen dinámica como se muestra al comienzo de este procedimiento.
Vamos a ver el procedimiento que hemos completado.
Haga clic en Vista previa en la barra de herramientas y luego elija Proyecto para obtener una vista previa de todo el proyecto.
Añadir minidiapositivas dinámicas
Nota:
Aquí [INTERNAL NOTE: Pending hosting] puede ver el resultado HTML5 del procedimiento descrito en esta sección. Puede usarlo como referencia durante el siguiente procedimiento:
Las minidiapositivas dinámicas permiten añadir objetos de Captivate a un objeto dinámico. De esta forma, al pasar el puntero sobre el área dinámica, se muestra todo el contenido de la minidiapositiva. Esta función es útil cuando se quieren mostrar de forma condicional otras cosas, además de texto o imágenes.
Vamos a añadir una minidiapositiva dinámica para mostrar más detalles sobre Samantha cuando los usuarios muevan el puntero sobre su imagen en la siguiente diapositiva:
-
En la carpeta comprimida descargada, vaya a la subcarpeta samples y abra:
apply-effects.cptx
Nota:No es obligatorio que descargue el archivo de proyecto incluido con este tutorial. Aun así podrá seguir los pasos de este procedimiento. Pero debe crear un nuevo proyecto en Captivate con una diapositiva similar a la mostrada sobre estas líneas.
-
En la Tira de película del proyecto, vaya a la diapositiva titulada Samantha.
-
En la barra de herramientas, haga clic en Objetos y elija Minidiapositiva dinámica.
Cuando se añade una minidiapositiva dinámica a una diapositiva, el objeto tiene dos partes:
Minidiapositiva: objeto de Captivate que contiene lo que se muestra de forma condicional.
Área dinámica: área de tamaño modificable por encima de la que el usuario debe mover el puntero para que se muestre el contenido de la minidiapositiva.
Vamos a añadir una forma rectangular a la minidiapositiva.
Nota:Aunque se pueden añadir otros objetos a una minidiapositiva, para simplificar el ejemplo nos limitamos a una forma rectangular.
-
Seleccione la minidiapositiva, haga clic en Formas y elija la rectangular.
-
Dibuje la forma rectangular dentro de la minidiapositiva.
-
Copie y pegue el siguiente texto en la forma rectangular:
Sobre mí: Llevo en Estudios Lunarsphere desde su fundación. No me gustan las negativas y espero que me sugieran soluciones a los problemas que se me notifican.
Mi película favorita: Casablanca
Mis mejores vacaciones: En Egipto, para ver las pirámides de Guiza
Un objetivo pendiente: Una clase de cocina con Chicote
-
Utilice el inspector de Propiedades para cambiar el color del texto a blanco y el color de la forma a rojo.
-
Utilice los controles para modificar la posición y el tamaño del área dinámica de modo que cubra la imagen de Samantha en el lado izquierdo de la diapositiva.
Vamos a ver el procedimiento que hemos completado.
Haga clic en Vista previa en la barra de herramientas y luego elija Proyecto para obtener una vista previa de todo el proyecto.
Previsualizar y publicar
En esta sección hemos visto bastante sobre efectos en Captivate.
Hemos aplicado efectos a objetos. Hemos creado efectos basados en eventos y añadido objetos dinámicos para mostrar contenido de manera condicional en una diapositiva.
Vamos a ver una vista previa de nuestros progresos.
Haga clic en Vista previa en la barra de herramientas y luego elija Proyecto para obtener una vista previa de todo el proyecto.
Si ve que falta algo, puede repasar la sección correspondiente en este artículo y realizar las actualizaciones necesarias para su proyecto.
Si todo se ve bien, publiquemos el proyecto.
-
En la barra de herramientas, haga clic en Publicar y elija Publicar en equipo.
Se muestra el cuadro de diálogo Publicar en mi PC.
-
En la lista desplegable Publicar como, asegúrese de que esté seleccionada la opción HTML5 / SWF.
-
En la opción Formato de salida, asegúrese de que esté seleccionada HTML5.
-
Haga clic en Publicar.
Para obtener más información sobre el uso de efectos, consulte Efectos de objetos.
Inicia sesión en tu cuenta