Diseño de proyecto interactivo

El diseño de un proyecto interactivo con Adobe Captivate le proporciona latan necesariaventaja competitiva. Creeuna sola vez y el contenido se reorganizará para las vistas de tabletas y móviles. Comience en un lienzo en blanco, grabe en un dispositivo iOS o incluso importe un guion gráfico mediante Adobe Captivate Draft. Ofrezca experiencias de aprendizaje de varias pantallas, específicas de la ubicación y que tengan en cuenta el dispositivo sin necesidad de programar.

Cree una experiencia de aprendizaje atractiva para sus alumnos; haga que el aprendizaje sea interesante e interactivo.

Fluid Boxes en Adobe Captivate

¿Qué es Fluid Box?

En la versión 2017 de Adobe Captivate, Fluid Box es un modo de diseño que proporciona la organización de objetos en una diapositiva, con el fin de que los objetos se comporten de manera predecible cuando la diapositiva se adecua a diferentes dispositivos y tamaños de pantalla. Fluid Box es un modelo de diseño fácil de usar para los diseñadores de aprendizaje electrónico. Puede utilizar objetos secundarios en cualquier orientación y tener flexibilidad para adaptarse al espacio de la pantalla.

Un contenedor de Fluid Box expande los objetos para rellenar el espacio libre disponible o los contrae para impedir el desbordamiento. Los elementos de Fluid Box son independientes de la orientación. Los objetos pueden adaptarse al espacio disponible.

Uso de Fluid Box en Captivate

En Captivate, un diseño de Fluid Box se puede insertar vertical u horizontalmente en un proyecto interactivo. Según el tamaño de la pantalla, los objetos de un contenedor de Fluid Box aumentan o disminuyen sin poner en peligro la anchura de la pantalla.

En la versión 2017 de Adobe Captivate, se han incorporado dos elementos nuevos a la barra de menús Objetos.

  1. Diseño de Fluid Box horizontal
  2. Diseño de Fluid Box vertical

Diseño de Fluid Box horizontal

En este ejemplo, crea un diseño mediante Fluid Box con cuatro bolas de billar. La vista cambia cuando el proyecto se previsualiza en un dispositivo diferente.

  1. Cree un solo diseño horizontal. Este diseño se convierte en Fluid Box principal.

  2. Coloque las bolas de billar en Fluid Box una a una desde la biblioteca.

  3. En el panel Inspector de propiedades, se activan las propiedades siguientes de Fluid Box:

    1. Estático: si selecciona estay,, los objetos dentro de Fluid Box se solapan y se pueden mover a cualquier parte dentro de Fluid Box.

      Opcional: si selecciona estay,, un objeto desaparece si se llega a su longitud. La modalidad Opcional solo es válida con una clase de ajuste, Encoger en una fila o Encoger en una columna.

    2. Flujo: denota la orientación en la que los objetos se colocan en Fluid Box. En un flujo horizontal, los objetos se colocan horizontalmente. Asimismo, en un flujo vertical, los objetos se colocan verticalmente.

      1.    Horizontal: elija las opciones de alineación horizontal de los objetos en el eje principal. Las opciones son:

      2. Alineación izquierda: los objetos se alinean a la izquierda. El primer objeto se encuentra al comienzo del eje.

      3. Alineación central: los objetos se centran en el eje.

      4. Alineación derecha: los objetos se alinean a la derecha. El último objeto se encuentra al final del eje.

      5. Espacio intermedio: los objetos se distribuyen en el eje de manera uniforme; el primer objeto se encuentra al comienzo del eje y el último objeto al final.

      6. Espacio alrededor: los objetos se distribuyen en el eje de manera uniforme con el mismo espacio a su alrededor.

    3. Relleno: el relleno añade espacio en todos los lados de un objeto. Para añadir relleno horizontalmente a los objetos, especifique el valor de relleno en píxeles. No se permiten valores negativos.

      Distribuir objetos de manera uniforme: haga clic en el botón para que todos los objetos de Fluid Box se coloquen de manera uniforme y tengan el mismo tamaño. Por ejemplo,

      Objetos antes de la distribución
      Objetos antes de la distribución
      Objetos después de la distribución
      Objetos después de la distribución

    4. Punto de ajuste: cuando se alcanza un punto de ajuste, dicho punto ajusta o reorganiza los objetos con un cambio en la anchura del dispositivo. Por ejemplo, si el punto de ajuste está al 80%, en el 80% de la anchura de dispositivo, un objeto se reorganiza en Fluid Box conforme a las propiedades definidas en las opciones de Ajustar.

      Por ejemplo, si el área de previsualización tiene una anchura de 1024 píxeles y el punto de ajuste se define al 50%, y si la anchura del dispositivo se define en 512 píxeles, los objetos se reorganizan.

    5. Ajustar: define el momento y el modo en los que los objetos se ajustan o reorganizan en Fluid Box cuando se llega a un umbral predefinido. Las opciones siguientes están disponibles:

      1. Ajustar a siguiente fila: cuando el punto de ajuste llega al umbral, un objeto se desplaza a la fila siguiente.

        pic1
      2. Encoger en una fila: cuando el punto de ajuste llega al umbral, los objetos no cambian de posición. Los objetos ajustan el tamaño conforme a las dimensiones del dispositivo.

        pic2
      3. Una fila/columna: cuando el punto de ajuste llega al umbral, los objetos se alinean en una columna.

        pic3
      4. Simétrica: cuando el punto de ajuste llega al umbral, los objetos se reorganizan en función de la cantidad de objetos en Fluid Box.

        pic4

Diseño de Fluid Box vertical

En este ejemplo, crea un diseño mediante Fluid Box con cuatro bolas de billar. La vista cambia cuando el proyecto se previsualiza en un dispositivo diferente.

pic5

En el inspector de propiedades, elija el flujo de objetos y el tipo de ajuste de objetos.

Opciones de flujo y ajuste
Opciones de flujo y ajuste

Elija la alineación horizontal de los objetos: central, izquierda o derecha.

Opciones de alineación horizontal
Opciones de alineación horizontal

Elija la alineación vertical de los objetos.

Opciones de alineación vertical
Opciones de alineación vertical

Alineación superior

pic9

Alineación media

pic10

Alineación inferior

pic11

Espacio intermedio

pic12

Espacio alrededor

pic13

Creación de un proyecto de Fluid Box con varios contenedores

  1. Cree un proyecto interactivo (Archivo > Nuevo proyecto > Proyecto interactivo o pulse Ctrl+H).

  2. En una diapositiva vacía, inserte un diseño de Fluid Box, como se muestra a continuación:

    Diseño de Fluid Box
    Diseño de Fluid Box
  3. Tras insertar el diseño vertical, haga clic en cualquier parte del diseño. FB_5 es el elemento principal que representa todo el contenedor de la diapositiva. En el panel Inspector de propiedades, puede ver toda la jerarquía de cada contenedor de Fluid Box.

    Fluid Box principal
    Fluid Box principal

    Para modificar los objetos, elija el contenedor pertinente.

  4. En los contenedores de Fluid Box, arrastre los controles azules para ajustar el tamaño de los contenedores secundarios.

    pic16

    Si hace clic en cualquier otro lugar, los controles azules desaparecen. Para que se vuelvan a mostrar, efectúe una de las acciones siguientes:

    • Haga clic en cualquier lugar fuera del área del escenario; a continuación, arrastre el ratón en el escenario.
    • Haga clic en cualquier lugar del área del escenario y seleccione el Fluid Box principal en la sección Selector de Fluid Box. Los controles han vuelto a aparecer.
  5. Inserte objetos en los contenedores como se muestra a continuación:

    pic17

    La imagen anterior representa un diseño para equipos de sobremesa (1024 x 627). Para comprobar el comportamiento de este diseño en otros dispositivos, desplace el control deslizante de la parte superior para observar los cambios en el diseño.

    Si previsualiza el objeto en diferentes dispositivos, puede ver que los contenedores de Fluid Box se adaptan automáticamente a la anchura del dispositivo.

    pic18

    En el caso de un dispositivo de anchura menor:

    pic19

    Si el texto especificado en un cuadro de texto se desplaza para incluir el cambio en la anchura del dispositivo, aparece un botón en la parte inferior del contenedor de texto. Haga clic en ese botón para ver todo el texto. Por ejemplo, en este caso, el texto aparece como:

    pic20

Nota:

No puede copiar una diapositiva que tiene objetos en Fluid Box ypegarlaen un proyecto en blanco o interactivo. Una solución es hacer clic con el botón derecho en Fluid Box, elegir Seleccionar todo y pegar los objetos en un proyecto en blanco o interactivo.

Nota:

Si en Fluid Box solo hay un objeto, no se puede cambiar el tamaño del objeto. Puede ver los controles rojos alrededor del objeto; eso significa que no se puede cambiar el tamaño del objeto.

Modificar la anchura de Fluid Box

La anchura de una Fluid Box se puede modificar cambiando los valores del panel Posición en el inspector de propiedades.

Por ejemplo, si una anchura de una Fluid Box secundaria es un 33,3 % de la de la Fluid Box principal o 341 px, puede cambiarla a los valores que desee. Dichos cambios se reflejarán en el escenario.

Antes de cambiar la anchura
Antes de cambiar la anchura
Después cambiar la anchura
Después cambiar la anchura

Nota:

En el panel Posición, si indica un valor mayor que el valor máximo permitido, el valor se restablece en el valor original.

Automatic Device Preview

Hit the play button to see your content automatically change shape and form factor across the full spectrum of device sizes. See how responsive your content is on every screen size.

Click the Layout Preview button to see your content automatically wrap, scale and align across device sizes.

Live device preview
Live device preview

You can also use the same option in the Wrap properties. Change the wrap property for the Fluid Box and click the Layout Preview button to check out the new wrapping behavior.

Activación de punto de ajuste para Fluid Box

Como se ha explicado en la sección anterior, un punto de ajuste es un nivel que, cuando se alcanza, ajusta o reorganiza los objetos con un cambio en la anchura del dispositivo.

Por ejemplo, si el punto de ajuste está al 80%, en el 80% de la anchura de dispositivo, un objeto se reorganiza en Fluid Box conforme a las propiedades definidas en las opciones de Ajustar.

A menudo, en proyectos de aprendizaje electrónico visualizados en dispositivos, se desea que los objetos se ajusten en más de un Fluid Box. Si bien se puede definir un punto de ajuste fácilmente en un Fluid Box, la capacidad de definir puntos de ajuste en varios Fluid Box confiere mayor flexibilidad al desarrollar proyectos de aprendizaje electrónico.

Para ajustar un punto en varios Fluid Box, haga clic en Editar > Preferencias o pulse Mayús+F8 para abrir el cuadro de diálogo Preferencias.

Activar punto de ajuste
Activar punto de ajuste

Seleccione la casilla de verificación Activar punto de ajustey,a continuación, haga clic en Aceptar. Reinicie Captivate.

En el proyecto, al añadir varios Fluid Box y objetos en cada Fluid Box, puede ver que puede activar puntos de ajuste en cada Fluid Box.

Al mover los reguladores, los objetos se ajustan en el punto exacto donde había especificado el umbral de ajuste.

Ajuste de objetos en cada Fluid Box
Ajuste de objetos en cada Fluid Box

Captura interactiva

Barra de reproducción interactiva

Configure los controles de labarra de reproducciónpara que sean interactivos. Desde Ventana > Editor de aspectos, puede crear un aspecto personalizado cambiando losbarra de reproducciónde la barra de reproducción y guardando los cambios como tema. Ahora puede hacer que los controles de labarra de reproducciónse muestren en vistas de tipo Principal, Tableta y Móvil.

Para ver distintos controles de labarra de reproducciónen cada una de las vistas Principal, Tableta y Móvil, personalice la variable cpMobilePlaybar.

 

  1. Vaya a la ubicación de la barra de reproducción:

    C:\Archivos de programa\Adobe\Adobe Captivate 8 x64\es_ES\Gallery\Playbars\HTML\cpPlaybarMobileStep text

    Nota:

    La ubicación varía según el directorio de instalación en el equipo. 

  2.  Cree una copia de seguridad para la barra de reproducción que desea cambiar.

  3. Abra el archivo playbarScript.js

    cp.responsiveButtons = 
    {
    	//"ButtonName"	: 	[Primary,Tablet,Mobile],
    	"Rewind"		: 	[true,true,false],
    	"Backward"		: 	[true,true,true],
    	"Play"			: 	[true,true,true],
    	"Slider"		: 	[true,true,false],
    	"Forward"		: 	[true,true,true],
    	"CC"			: 	[true,true,true],
    	"AudioOn"		: 	[true,false,false],
    	"Exit"			: 	[true,true,true],
    	"FastForward"	: 	[true,true,false],
    	"TOC"		: 	[true,true,false]
    };
  4. Si desea que cada uno de los botones de control de la barra de reproducción aparezca en vistas de tipo Principal, Tableta y Móvil, modifique el código anterior como [true, true, true] para todos los botones. Guarde y cierre el archivo. 

    Por ejemplo, si quiere que el control deslizante aparezca únicamente en vistas de tipo Tableta y Móvil, defina el código como se indica a continuación: 

    "Slider" : [false, true, true] 

    Nota:

    Si quiere que otra barra de reproducción sea interactiva, siga el procedimiento mencionado sobre estas líneas, pero antes copie la función interactiva en el archivo js.

    La primera preferencia se asigna a las casillas situadas en Editor de aspectos. Si no están seleccionadas, no aparecen en la barra de reproducción, sea cual sea el valor de true o false del botón.

  5. Reinicie Captivate y la barra de reproducción se actualiza. 

Captura interactiva (simulación interactiva) 

Cree una única captura de pantalla y utilícela en varias pantallas y dispositivos. Adobe Captivate le permite elegir la parte de la captura de pantalla que desea mostrar en las pantallas más pequeñas.

  1. Abra un proyecto interactivo de Captivate.

  2. Haga clic en Diapositiva > Simulación de software.

    Aparece la ventana Grabar diapositivas adicionales.

    record-additional-slides
  3. Seleccione la diapositiva después de la cual quiere insertar la diapositiva grabada y haga clic en Aceptar. 

    Aparece la ventana de captura de pantalla.

  4. Seleccione el tipo de grabación Automático, Demostración de video o Manual, y haga clic en Grabar para capturar las pantallas. 

    Nota:

    Utilice la grabación manual si desea obtener y seleccionar unas cuantas capturas de pantalla durante el proceso de grabación. 

    Cuando se graba utilizando la grabación automática, Adobe Captivate realiza las capturas de pantalla de manera automática y las coloca en diapositivas independientes. La grabación automática es el método de grabación que se utiliza con más frecuencia en Adobe Captivate.

  5. En Proyecto interactivo, haga clic en la vista Móvil.

    La captura de pantalla se realinea y aparece como se muestra aquí: 

    responsive_mobile
  6. Observará que el fondo se ve sesgado. 

    Puede utilizar una parte de la imagen de fondo en la vista Móvil. 

  7. En el inspector de propiedades, haga clic en Usar porción de imagen de fondo. Puede mover la captura de la diapositiva a la porción de fondo que quiera.

    Observe la diferencia con la vista anterior.

    background_skew_fix

Conversión de un proyecto vacío en un proyecto interactivo

  1. Cree un proyecto vacío con algunos objetos, como se muestra a continuación.

    Nuevo proyecto en blanco
    Nuevo proyecto en blanco

  2. Para convertir el proyecto en interactivo, haga clic en Archivo > Guardar como interactivo. Puede ver un mensaje de advertencia sobre los objetos que no son compatibles en un proyecto interactivo. Para obtener más información, consulteObjetos no admitidos en salidas con formato HTML5.

    Haga clic en Guardar y guarde el proyecto como interactivo. Ahora tiene un nuevo proyecto interactivo, como se muestra a continuación:

    Nuevo proyecto interactivo
    Nuevo proyecto interactivo

    Arrastre el control deslizante para ver el proyecto en las distintas vistas.

  3. Si el texto especificado en un cuadro de texto se desplaza para incluir el cambio en la anchura del dispositivo, aparece el botón Expandir en la parte inferior del contenedor de texto. Haga clic en ese botón para ver todo el texto. 

    Botón Expandir
    Botón Expandir

  4. En la diapositiva interactiva, puede insertar su propio diseño de FluidBox (FluidBox > Vertical u Horizontal) o hacer clic en Sugerir FluidBoxes para colocar los objetos de forma inteligente en contenedores interactivos. Si hace clic en Sugerir FluidBox, puede ver cómo cambia el diseño del proyecto, como se indica aquí:

    Diseño de FluidBox
    Diseño de FluidBox

  5. Mueva los objetos, colóquelos en el orden deseado y luego obtenga una vista previa o publique el proyecto interactivo.

Creación de un dispositivo de previsualización personalizado

En cualquier proyecto interactivo, Captivate permite previsualizar el proyecto en diferentes dispositivos como el escritorio, iPhone, iPad, etcétera.

Puede crear dispositivos de previsualización personalizados, además de los que ya se proporcionan de forma predeterminada.

Para crear un dispositivo de previsualización personalizado:

  1. En primer lugar, inicie Captivate como administrador.

    Después, escriba las dimensiones adecuadas, como se muestra a continuación: 

    Dimensiones de vista previa personalizadas
    Dimensiones de vista previa personalizadas

  2. Para añadir la previsualización a la lista de modos de previsualización, haga clic en + junto a los campos de dimensión. Puede ver el siguiente cuadro de diálogo:

    Nuevo dispositivo de previsualización personalizado
    Nuevo dispositivo de previsualización personalizado

    Escriba un nombre, por ejemplo Galaxy S8, y el dispositivo de previsualización personalizado pasa a formar parte de la lista de dispositivos de previsualización.

    Para eliminar un dispositivo de previsualización personalizado, selecciónelo y haga clic en - junto a los campos de dimensión.

  3. <?xml version="1.0" encoding="UTF-8"?>
    <devicelist>
       <device name="Desktop" width="1024" height="627" candelete="0"/>
       <device name="iPhone6" width="375" height="667" candelete="0"/>
       <device name="iPad" width="768" height="1024" candelete="0"/>
       <device name="Galaxy S7" width="360" height="640" candelete="0"/>
       <device name="Nexus 5x" width="412" height="732" candelete="0"/>
       <device name="Galaxy S8" width="1000" height="1000" candelete="1"/>
    </devicelist>
    
  4. Añada o elimine una vista previa personalizada utilizando los atributos de nombre, anchura y altura.

  5. Reinicie Captivate para que se reflejen los cambios en la lista desplegable Vista previa.

    Lista desplegable de vista previa
    Lista desplegable de vista previa

Puntos de corte en proyecto interactivo

Cree contenido con cinco puntos de corte: 

  • Escritorio con una ventanilla de 1024 x 627
  • Tableta Horizontal con una ventanilla de 896 x 627
  • Tableta Vertical con una ventanilla de 768 x 627
  • Móvil Horizontal con una ventanilla de 667 x 410
  • Móvil Vertical con una ventanilla de 360 x 460

Vea una vista previa del resultado mediante la reproducción de diapositivas en los diseños de dispositivo correspondientes. Publique el contenido en formato HTML5.

Adobe Captivate le permite arrastrar y soltar los objetos con una experiencia óptima en todas las vistas de punto de corte en proyectos interactivos.

Para obtener más información sobre las propiedades específicas de la vista del proyecto interactivo, consulte Propiedades específicas para cada vista.

Puede ver el panel Alinear haciendo clic en Ventana > Alinear.

Creación de un proyecto interactivo

  1. Después de iniciar Adobe Captivate, haga clic en la primera miniatura de la pantalla de inicio, Proyecto interactivo, y haga clic en Crear. 

    También puede elegir Archivo > Nuevo proyecto > Proyecto interactivo.

  2. Para desplazarse por los distintos puntos de corte, haga clic en los iconos de Escritorio, Tableta y Móvil en el diseño de proyecto interactivo.

    Puede ver el área Proyecto interactivo dividida en seis puntos de corte únicos, como se muestra en las tres capturas de pantalla más abajo. Cada área de punto de corte es un espacio de creación único.

    responsive_layout
    Puntos de corte disponibles

Diseño adaptable (posicionamiento inteligente)

Al principio y al final de cada punto de corte, hay disponibles reguladores.

De forma predeterminada, hay cinco puntos de corte disponibles para la creación de contenido.

Si crea contenido para cualquier otro dispositivo cuyo tamaño sea mayor que el de la ventanilla del diseño para móviles, puede aumentar el tamaño arrastrando el control deslizante.

Nota:

Cualquier tamaño superior al de la ventanilla predeterminada adoptará el diseño de ventanilla siguiente.
Por ejemplo, es posible que desee cambiar la ventanilla para móviles a 450 x 450 en lugar de usar los valores predeterminados. En tal caso, puesto que este tamaño es mayor que el tamaño para Móvil y menor que el tamaño para Tableta, adoptará el diseño para Tableta.

La colocación inteligente se permite entre puntos de separación. Adobe Captivate le permite obtener una vista previa de los proyectos con una experiencia óptima en los puntos de corte. En otras palabras, los usuarios no experimentan ningún retraso en la vista previa de la salida cuando pasan de una vista a otra vista entre puntos de corte.

Personalización de colores de tema

Puede elegir los Colores de tema predeterminados o modificar los Colores de tema para crear sus propios esquemas de color.

  1. En la Barra de herramientas, haga clic en Temas > Colores de tema

  2. Elija cualquiera de los Colores de tema predeterminados en el menú desplegable Seleccionar color de tema y haga clic en Personalizar. La ventana de colores de tema de que personalizar aparece como se muestra a continuación:

    theme-colors
  3. Seleccione el componente cuyos colores desea cambiar.
    Puede cambiar los colores de todos los componentes de la diapositiva: Título, Aspecto, Subtítulo, Fondo de diapositiva.

  4. Utilice las herramientas Sombreados, Muestras, Selector de color o Cuentagotas para elegir el color deseado.

  5. Haga clic en el Título del tema predeterminado y utilice su propio título.

  6. Haga clic en Guardar.
    A continuación, podrá ver el color de Tema personalizado en la lista desplegable.

    Utilice el icono de Rueda de configuración para gestionar los colores de tema: Eliminar, Cambiar nombre.

Altura de dispositivo

Defina fondos diferentes en las distintas vistas mediante la inclusión o exclusión de objetos.

También puede establecer la altura de dispositivo para cada diseño mediante la selección de la casilla Altura de dispositivo en el Inspector de propiedades. Si se selecciona Altura de dispositivo, puede ver el borde amarillo para cada diseño como se muestra en las capturas de pantalla más abajo para el diseño para Móvil.

device_height
Configuración de la altura del dispositivo

device_height_view

Es posible vincular la altura de las diapositivas a la altura de los dispositivos. Para ello, basta con hacer clic en el icono de vinculación junto a Altura de diapositiva en la ventana Propiedades como se muestra en la captura de pantalla más abajo. Puede cambiar la altura de las diapositivas para una vista específica o para todas las vistas. 

slide-height-link

Altura de diapositiva

Adobe Captivate también le permite personalizar la altura de la ventanilla de acuerdo con la altura de los dispositivos.

La altura de Ventanilla es la altura del diseño de página para Principal (Escritorio), Tableta y Móvil. Puede ajustar esta altura de modo que se adapte a cualquier altura de dispositivo específica con la opción de Altura de diapositiva en Propiedades.

Nota:

Desvincule la altura de la diapositiva de la altura del dispositivo para modificarla.

Personalización de la altura de diapositiva

Supongamos que la altura de la ventanilla y del dispositivo para Móvil es 415. Supongamosquela altura del dispositivo sea 500. Puede ajustar la altura de la ventanilla moviendo el regulador vertical de la altura del dispositivo hasta que se alcance 500. De forma predeterminada, la altura del dispositivo está vinculada a la altura de la diapositiva. Puede anular el vínculo al mismo haciendo clic en el icono de vincular junto al valor de altura de la diapositiva en el inspector de propiedades. 

En este caso, todo el contenido incluido en la altura de la ventanilla estará visible en eldispositivomóvil de forma predeterminada. Esta opción permite desarrollar contenidos con precisión de manera que la altura del diseño coincida con la de los dispositivos.

Si la altura de la ventanilla es superior a la del dispositivo, el usuario final podrá el contenido que se encuentre fuera de la altura del dispositivo mediante una barra de desplazamiento.

Ahora, puede alinear cualquier objeto en elcentrode la diapositiva en todos los puntos de corte de proyectos interactivos. Captivate 9 introduce opciones de alineación horizontal y vertical.

  1. Inserte cualquier forma inteligente en la diapositiva del punto de corte principal. 
  2. Haga clic en la ficha de posición de la vista y la forma inteligente en elInspectorde propiedades. 
  3. Haga clic en Avanzadas. Puede ver las opciones de alineación horizontal y vertical como se muestra en la instantánea. 

Alinear objetos

Ahora puede alinear cualquier objeto en el centro de la diapositiva en todos los puntos de corte de proyectos interactivos mediante las opciones de alineación central horizontal y vertical de Captivate.

  1. Inserte cualquier forma u objeto en la diapositiva del punto de corte principal.

  2. Selecciónelo y observe el panel Posición en el Inspector de propiedades. Haga clic en Avanzadas.

  3. Haga clic en Avanzadas. 

    alignment
    Opciones de alineación vertical y horizontal de imágenes

    Puede ver las opciones de alineación horizontal y vertical como se muestra en la instantánea. 

    vertical_horizontal
    Opciones de alineación

  4. Puede elegir opciones de alineación central horizontal y vertical haciendo clic con el botón derecho en el objeto y seleccionando Alinear como se muestra aquí.

    right-click-centeralign
  5. También puede utilizar los iconos del panel Alinear como se muestra aquí. 

    Nota:

    Active el panel Alinear haciendo clic en Ventana > Alinear.

    align-panel

    Alineación central horizontal: si aplica esta alineación, puede mover el objeto solo en dirección vertical en direcciónverticalen la diapositiva. El movimiento horizontal está restringido. 

    Alineación central vertical: si aplica esta alineación, puede mover la forma solo en direcciónhorizontalen la diapositiva. El movimiento vertical está restringido. 

    Alineación horizontal y vertical: si aplica ambas alineaciones, elmovimientose restringe en ambas direcciones. 

    Se admite el código de color de las opciones de alineación tanto central como vertical. El color del borde de las dos opciones de la casilla de verificación toma el esquema de color delpunto de corteen el que se eligen las opciones de alineación. 

Nota:

Si dispone de varias formas, puede alinear un objeto individual en el centro de la diapositiva y vincular el resto de los objetos al objeto centrado para obtener diagramas de flujo centrados a la diapositiva en todos los puntos de corte.

Si desalinea la opción central horizontal o vertical, el objeto no regresa a su posición original. 

Definición de los colores predeterminados de las leyendas

Es posible definir distintos colores de texto de leyenda predeterminados para las vistas de punto de corte.
 

  1. Elija Editar > Administrador de estilos del objeto

  2. Seleccione Estilo predeterminado de pie de ilustración

  3. En Formato de texto, haga clic en el cuadro desplegable junto a Puntos de corte y elija Escritorio, Tableta Vertical o Móvil Vertical.

  4. Elija el color para cada punto de corte.

Captura de interacciones

Es posible capturar las interacciones en todas las vistas y definir el enfoque automático para un área de interacción específica en las vistas. Defina una forma inteligente como imagen de fondo en Proyecto interactivo y se le permite definir el área de recorte para la imagen de fondo en las distintas vistas.

Las diapositivas de Preguntas y Resultados, así como Diapositivas patrón, son compatibles con todas las vistas del proyecto interactivo.

Es posible aplicar las propiedades y los temas interactivos a las diapositivas de Preguntas.

Los estilos modificados se indican con un símbolo de estrella en el área Texto de muestra del Inspector de propiedades.

Interacción de arrastrar y soltar

Adobe Captivate admite interacciones de arrastrar y soltar para los proyectos interactivos.

Las interacciones de arrastrar-soltar ofrecen un modo interesante y atractivo de evaluar el conocimiento de los usuarios. Esta interacción permite a los usuarios responder a preguntas arrastrando y soltando objetos en las áreas o los objetos designados.

Una interacción de arrastrar-soltar implica un origen de arrastre y un destino de colocación. Los usuarios arrastran los orígenes de arrastre y los sueltan en los destinos de colocación.

En un proyecto interactivo, puede ejecutar el asistente de interacción de arrastrar y soltar si selecciona Insertar > Iniciar el asistente para arrastrar y soltar. También puede seleccionar Interacciones > Arrastrar y soltar, como se muestra en la instantánea a continuación: 

drag-n-drop

Todas las funciones de la interacción de arrastrar y soltar en proyectos interactivos son similares a los proyectos vacíos. Para obtener información sobre cómo crear una interacción de arrastrar y soltar, las distintas funciones de interacción y las prácticas recomendadas, consulte Interacciones de arrastrar y soltar. 

Descargar proyectos de muestra

Para obtener más información sobre Captivate y cómo crear contenido didáctico atractivo, descargue los proyectos siguientes:

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea