Adición y configuración de widgets de proyecciones de diapositivas en Adobe Muse

Abra Adobe Muse. En la pantalla de bienvenida, siga uno de estos procedimientos:

• Haga clic en Crear Nuevo para añadir un widget de proyección de diapositivas en el sitio nuevo que está creando.
• Haga clic en Abrir y abra el archivo .muse existente al que desea añadir el widget. Haga doble clic y abra la página en la que desea añadir el widget de proyección de diapositivas.

Abra el panel Biblioteca de widgets (Ventana > Biblioteca de widgets) y expanda la sección Proyecciones de diapositivas. Seleccione el widget correspondiente en esta lista. Por ejemplo, seleccione el widget de proyección de diapositivas de miniaturas en la lista y arrástrelo a la vista Diseño.

Tenga en cuenta que hay un contenedor de miniaturas en la parte izquierda, un contenedor para la imagen principal y el contenedor de pie de ilustración debajo de la imagen.

Para eliminar las miniaturas, seleccione el contenido del marcador de posición (el marco de la imagen y el marco de texto dentro del área de contenido) y elimínelo.

Seleccione el widget y haga clic en el icono de la flecha azul para acceder al panel Opciones. En este ejemplo, no necesita los botones de flechas Siguiente y Anterior. Por lo tanto, desactive las opciones Anterior y Siguiente para deshabilitarlas. Observe que los botones desaparecen cuando se anula la selección de las casillas de verificación.

Anule la selección de las opciones de pies de ilustración y contador, de forma que solo permanezcan los botones de desencadenante de miniaturas y el contenedor más grande de destino. Repase las opciones y actualícelas para que coincidan con los ajustes que se enumeran a continuación:

• Nueva imagen principal: llenar marco proporcionalmente
• Nueva miniatura: llenar marco proporcionalmente
• Transición: suavizar
• Velocidad de la transición: 0,5 segundos
• Reproducción automática: no activado
• Reanudar tras: activado
• Reproducir una vez: no activado
  
• Reorganizar: no activado
• Habilitar barrido: activado
• Caja de iluminación: activado
• Pantalla completa: activado
• Cuadro de iluminación automático: no activado
• Miniaturas con forma libre: activado
  
• Primero: no activado
• Anterior: activado
• Siguiente: activado
• Último: no activado
• Pies de ilustración: activado
• Contador: activado
• Botón Cerrar: no activado
• Miniaturas: activado
• Mostrar partes de la caja de iluminación al editar: activado
• Editar conjuntamente: activado

Los diferentes widgets tienen diferentes opciones disponibles y algunos son más complejos que otros. Dedique unos minutos a revisar las opciones de menú para ver las configuraciones disponibles. A continuación, se ofrece una breve descripción general:

Añadir imágenes: haga clic en el icono de carpeta para buscar y seleccionar las imágenes que desea mostrar.

Nueva imagen principal: define el modo en el que el contenido de la foto más grande se muestra en el contenedor de destino.

• Encajar el contenido proporcionalmente: el archivo de imagen de la fotografía no cambia su tamaño original, incluso aunque ese tamaño no coincida con el contenedor de destino; la parte del contenedor en la que no encaja la imagen puede estar vacía.
• Llenar marco proporcionalmente: el archivo de imagen de la fotografía se ajusta para rellenar las proporciones del contenedor de destino; algunas de las imágenes de fotografías se pueden recortar.

Nueva miniatura: define el modo en el que el contenido de la fotografía de miniatura más pequeña se mostrará en el contenedor de desencadenante.

• Encajar el contenido proporcionalmente: el archivo de imagen de la fotografía no cambia su tamaño original, incluso aunque ese tamaño no coincida con el contenedor de destino; la parte del contenedor en la que no encaja la imagen puede estar vacía.
• Llenar marco proporcionalmente: el archivo de imagen de la fotografía se ajusta para rellenar las proporciones del contenedor de destino; algunas de las imágenes de fotografías se pueden recortar.

Transición: método de animación usado cuando el contenido de un contenedor de destino está en proceso de ser reemplazado por otro contenedor de destino. También están habilitadas para pantallas táctiles, por lo que si se crean sitios para dispositivos móviles, los visitantes pueden realizar un barrido en sus pantallas para ver la transición conforme aparece el siguiente elemento del contenido.

• Suavizar: la opacidad del nuevo contenedor aumenta a medida que disminuye el contenedor existente.
• Horizontal: el nuevo contenedor se desliza desde el lateral horizontalmente, pasando sobre el contenedor existente.
• Vertical: el nuevo contenedor se desliza desde el lateral verticalmente, pasando sobre el contenedor existente.

Velocidad de la transición: la cantidad de tiempo en segundos que se tarda en reproducir la animación.

Reproducción automática: cuando está activada, esta configuración reproduce automáticamente la proyección de diapositivas, en lugar de una experiencia interactiva (que requiere que el visitante haga clic en cada desencadenante para ver el destino correspondiente en la secuencia). Establezca el número de segundos que desea que se muestre cada imagen antes de pasar a la siguiente imagen.

Reorganizar: cuando se activa, las imágenes se muestran en un orden aleatorio, en lugar de desplazarse por las miniaturas secuencialmente.

Caja de iluminación: cuando esta opción está activada, la proyección atenúa el resto de la página con una superposición cuando aparece el contenido del contenedor de destino.  Cuando la ventana de la caja de iluminación se cierra, toda la página se muestra nuevamente.

Habilitar barrido: cuando esta opción está activada y el sitio incluye un diseño para tablet o teléfono para mostrar contenido web en un dispositivo móvil, los elementos interactivos del widget admiten movimientos de pantalla táctil.

Sección de partes:

• Primero: cuando esta opción está activada, se muestra el botón de navegación Primero.
• Anterior: cuando esta opción está activada, se muestra el botón de navegación Anterior.
• Siguiente: cuando esta opción está activada, se muestra el botón de navegación Siguiente.
• Último: cuando esta opción está activada, se muestra el botón de navegación Último.
• Pies de ilustración: cuando esta opción está activada, se muestran los pies de ilustración de la galería de fotografías.
• Contador: cuando esta opción está activada, se muestra el contador de la galería de fotografías.
• Botón Cerrar: cuando esta opción está activada, se muestra el botón Cerrar.

Miniaturas: cuando esta opción está activada, se muestran los botones de desencadenante de miniaturas.

Sección de edición:

• Mostrar partes de la caja de iluminación al editar: cuando la opción Caja de iluminación está activada, cada área de destino se muestra solo de forma predeterminada cuando su desencadenante correspondiente está seleccionado en la página. Como está realizando el diseño, puede resultar útil habilitar esta opción para poder ver los destinos mientras trabaja. Este ajuste no afecta a la visualización de la presentación al previsualizar la página o al verla en un navegador. Si la opción de Caja de iluminación no está habilitada, esta opción está inactiva. 

Tenga en cuenta que la opción Mostrar partes de la caja de iluminación al editar solo está activada si elige el widget de proyección de diapositivas de caja de iluminación.

• Editar conjuntamente: esta opción está habilitada de forma predeterminada, para que la edición de widgets sea más rápida. A menos que necesite definir el aspecto de cada desencadenante de forma diferente, tenga esta opción habilitada para que todos los cambios realizados en un elemento se apliquen automáticamente a los demás.

Después de revisar los ajustes disponibles, haga clic en el área de la página fuera del menú Opciones para cerrarlo.

Haga clic y seleccione el widget de proyección de diapositivas. Utilice la herramienta Selección para arrastrar sus manejadores y redimensionar el widget de proyección de diapositivas de miniaturas hasta que alcance aproximadamente 790 píxeles de ancho por 490 píxeles de alto. Puede examinar el panel Transformar o los campos de transformación del panel de control para comprobar las dimensiones.

Mientras la proyección de diapositivas está aún seleccionada, haga clic de nuevo en el contenedor de miniaturas para seleccionar el contenedor que contiene las tres miniaturas. Utilice los manejadores de transformación laterales para hacerlo más ancho y, a continuación, utilice la herramienta Selección para arrastrar las miniaturas hasta colocarlas encima y alineadas verticalmente con el centro del contenedor de la imagen principal de mayor tamaño.

Puede saber cuándo el contenedor de miniaturas está alineado con el centro del contenedor de imagen principal porque se muestra temporalmente una guía inteligente azul mientras se arrastra el elemento.

Siga estos pasos para añadir los gráficos a la galería de fotografías mientras se generan automáticamente los contenedores de miniaturas y de imagen principal correspondientes:

Haga clic en el botón de flecha azul para abrir el menú Opciones. Haga clic en el icono de carpeta junto a las palabras Añadir imágenes... y vaya a la carpeta donde se han guardado los archivos.

Seleccione los archivos de imagen requeridos. Haga clic en Abrir para cerrar el cuadro de diálogo Importar.

Al seleccionar varios archivos de imágenes, se carga el widget de proyección de diapositivas de miniaturas. Esta estrategia le permite seleccionar varios archivos de imágenes y generar un botón contenedor de miniaturas que se corresponda con cada archivo nuevo de imagen grande en el contenedor de imagen principal.

Las imágenes nuevas se añaden a los botones de miniaturas existentes.

Haga doble clic y seleccione la imagen en miniatura que aparece de forma predeterminada cuando se añade por primera vez la proyección de diapositivas. Pulse la tecla para eliminar (Mac) o la tecla Retroceso (Windows) para quitar cada una de ellas tras seleccionarla, hasta que solo queden las nuevas miniaturas.

Tenga cuidado de no eliminar el conjunto completo de las miniaturas; si esto ocurre deshaga la última operación en Edición > Deshacer y, a continuación, asegúrese de hacer clic en cada miniatura (el indicador de selección muestra la palabra: Miniatura) antes de pulsar Retroceso o Suprimir.

Seleccione el contenedor que alberga el conjunto de cinco imágenes de miniatura. Utilice los manejadores de transformación para cambiar el tamaño, de forma que las miniaturas restantes queden centradas sobre el contenedor de imagen principal.

En primer lugar, pruebe la galería de fotografías en la vista Diseño, haga clic en los botones de miniaturas en la parte superior y vea cada una de las imágenes principales correspondiente que se muestran en el contenedor más grande a continuación.

Haga clic en Vista previa para ver cómo se mostrará la galería en un navegador. Interactúe con la proyección de diapositivas para ver cómo las imágenes más grandes aparecen al hacer clic en la miniatura correspondiente.

Elija Archivo > Vista previa de página en navegador para ver la página acerca de que se muestra en su navegador predeterminado.

Cambie el tamaño del navegador y previsualice el widget de proyección de diapositivas en diferentes tamaños de pantalla. Puede ver que los widgets de proyección de diapositivas son adaptables de forma predeterminada. Es decir, se redimensionan y adaptan al tamaño de la pantalla. 

También puede utilizar la barra de desplazamiento en la vista Diseño, para obtener una vista previa de los widgets. Si desea modificar o volver a colocar el widget en cualquier momento, añada un punto de rotura y vuelva a alinear el widget. 

Pruebe la funcionalidad del widget de panel en fichas. Haga clic en las fichas para ver el contenido correspondiente que se muestra en los contenedores de área de contenido. A continuación, pruebe la proyección de diapositivas en la ficha Gallery (galería), haciendo clic en los botones de miniaturas para ver las imágenes principales más grandes correspondientes.

En la biblioteca de widgets, haga clic en Proyecciones de diapositivas.

Seleccione el widget Básica y arrástrelo a la página.

De forma predeterminada, el widget Proyección de diapositivas básica contiene un rectángulo gris oscuro (marcador de posición de imagen), un texto de marcador de posición, el número de la imagen (1 - 1) y dos botones de flecha (siguiente y anterior) en los que los visitantes pueden hacer clic para desplazarse por un conjunto de imágenes.

Haga clic en la flecha azul para acceder al menú Opciones. Compruebe y establezca las siguientes opciones:

• Transición: Suavizar
• Reproducción automática: Lenta
• Nueva imagen principal: Llenar marco proporcionalmente
• Nueva miniatura: Llenar marco proporcionalmente
• Caja de iluminación: No seleccionada
• Partes: Anule la selección de todas las opciones para ocultar los pies de ilustración, el contador y los botones siguiente y anterior.

Haga clic fuera del menú Opciones para cerrarlo. Tenga en cuenta que después de realizar estos cambios, solo el rectángulo gris oscuro permanece visible. En cualquier momento, puede cambiar la configuración de los widgets cambiando los valores en el menú Opciones.

Haga doble clic y seleccione el marco de imagen (el rectángulo gris oscuro) y, a continuación, arrastre los manejadores laterales para expandir la proyección de diapositivas a todo el ancho de la página.

Utilice las flechas superior e inferior para extender la altura del marco de imagen y cubrir toda la página principal. En la parte inferior, estire el marco de la imagen hasta que se detenga justo encima de la imagen con mosaico en zigzag que aparece en la parte superior del pie de página. De momento, está bien que el marcador de posición gris oscuro cubra la imagen de la gota marrón en la parte derecha de la barra de navegación.

Haga clic en la flecha azul para acceder nuevamente al menú Opciones. Esta vez, haga clic en el icono de carpeta situado en la parte superior, junto al texto Añadir imágenes.

En el cuadro de diálogo Importar, vaya a la carpeta de activos y ábralos. Haga clic en Seleccionar para añadir las imágenes a las proyecciones de diapositivas.

Haga clic en Previsualizar para ver la reproducción de la proyección de diapositivas. La reproducción automática está configurada a velocidad lenta, pero se puede modificar la configuración en el menú Opciones si prefiere que las imágenes hagan el recorrido más rápidamente. Tenga en cuenta que tras mostrar la última fotografía, la proyección de diapositivas se repite y comienza a reproducir la primera imagen del conjunto. La proyección de diapositivas se repite indefinidamente cuando está activada la Reproducción automática.

En la vista Plan, haga doble clic en la miniatura de la página maestra A para abrirla en la vista Diseño.

Utilice la herramienta Selección para seleccionar la gota marrón en la parte superior derecha del gráfico de navegación.

Haga clic con el botón derecho del ratón en la imagen de la gota y elija Organizar > Traer al frente en el menú contextual que aparece.

Haga clic en la X de la pestaña maestra A para cerrarla. Abra la página en la que se ha añadido el widget Básica. Haga clic en Previsualizar y observe que ahora la imagen de la gota aparece por encima de la proyección de diapositivas con reproducción automática. Después de revisar la proyección de diapositivas, vuelva a la vista Diseño.

Inicie Adobe Muse. Haga doble clic en una página para abrirla en la vista Diseño.

Elija Ventana > Biblioteca de widgets para acceder a la biblioteca de widgets, o haga clic en la ficha Biblioteca de widgets en el conjunto de paneles para activarla.

Expanda la sección Proyecciones de diapositivas en la lista de widgets. Seleccione el widget denominado Pantalla completa en la sección Proyecciones de diapositivas.

Arrastre el widget de proyección de diapositivas a pantalla completa de la biblioteca de widgets a la página.

Observe que el contenido predeterminado se redimensiona para ajustarse a la altura y la anchura de toda la ventana del navegador.

De forma predeterminada, al añadir el widget de proyección de diapositivas Pantalla completa, se muestran el botón Anterior, el botón Siguiente y un campo de contador en la esquina superior derecha.

Haga clic en la flecha azul para revisar la configuración del panel Opciones.

La opción para rellenar el marco proporcionalmente se aplica automáticamente a las nuevas imágenes principales y a las nuevas imágenes en miniatura para facilitar la vista a pantalla completa.

Elija el tipo de transición que desee aplicar. Utilice el menú Transición para elegir entre Transición, Horizontal o Vertical. De forma predeterminada, la velocidad de transición es de 0,5 segundos, pero puede ajustarla como desee.

Si activa la opción Reproducción automática, la proyección de diapositivas empezará a reproducirse en cuanto cargue la página y el contenido se irá mostrando según el número de segundos definido. De forma predeterminada, cada imagen se muestra durante 3,5 segundos cuando la opción Reproducción automática está activada.

Al configurar el widget de proyección de diapositivas a pantalla completa, es muy común activar los botones Siguiente y Anterior para la navegación, por lo que las miniaturas se ocultan de forma predeterminada. Sin embargo, puede activar la opción Miniaturas si desea que se muestren en la parte superior de la imagen principal de la proyección de diapositivas.

Si se ocultan las miniaturas, asegúrese de dejar activados los botones Siguiente y Anterior. El contador es opcional; permite a los visitantes saber qué imagen del conjunto están viendo.

Si desea mostrar los botones Siguiente y Anterior y el contador en un lugar concreto de la página, utilice la herramienta Selección para moverlos a la ubicación deseada y fije los controles. Si también desea que las miniaturas permanezcan en la misma posición en la página, coloque el conjunto de miniaturas y fíjelo también en su lugar. Si desea mostrar los botones Siguiente y Anterior y el contador en un lugar concreto de la página, utilice la herramienta Selección para moverlos a la ubicación deseada y fije los controles. Si también desea que las miniaturas permanezcan en la misma posición en la página, coloque el conjunto de miniaturas y fíjelo también en su lugar.

Puede modificar la configuración de fijación y cambio de tamaño en distintos puntos de rotura al añadir este widget a un sitio adaptable.

Seleccione Archivo > Colocar.

En la ventana de importación que aparece, utilice el comando Mayús + clic para seleccionar varios archivos de imagen contiguos en el ordenador. Si lo prefiere, mantenga pulsada la tecla Comando (Mac) o Control (Windows) mientras selecciona varios archivos de imagen no contiguos de una carpeta de activos.

Haga clic en Abrir para cargar los archivos seleccionados en el cursor de colocación.

Haga clic en la proyección de diapositivas una vez para añadir los archivos de imagen seleccionados. Observe que las imágenes predeterminadas de la proyección de diapositivas se eliminan automáticamente al añadir nuevas imágenes.

Seleccione Archivo > Vista previa de página en navegador. Ajuste el tamaño de la ventana del navegador y observe cómo el contenido de la proyección se recorta y redimensiona para ocupar toda la ventana. Haga clic en los botones Siguiente y Anterior para desplazarse por la serie de imágenes o deje que se reproduzcan si la opción Reproducción automática está activada.

Cierre la ventana del navegador y vuelva a Adobe Muse. 

En la vista Diseño, abra la biblioteca de widgets y expanda la sección Proyección de diapositivas. Arrastre cualquiera de los widgets de proyección de diapositivas a una página.

Cuando toda la página esté seleccionada, haga doble clic y seleccione la imagen en miniatura. Para ver qué elemento está seleccionado, observe el indicador de selección de la esquina superior izquierda del panel de control.

De forma predeterminada, las miniaturas que aparecen en los widgets de proyección de diapositivas se almacenan en un contenedor llamado Contenedor de miniaturas. Este contenedor externo garantiza que las miniaturas se alineen en filas o líneas rectas, según cómo redimensione el contenedor externo. El conjunto de imágenes en miniatura se anida dentro de un contenedor de miniaturas para todas las proyecciones de diapositivas que tengan las miniaturas activadas, hasta que active la opción Miniaturas de forma libre.

Mientras está seleccionado el widget de proyecciones de diapositivas, haga clic en la flecha azul para acceder al menú de opciones.

Active la casilla de verificación que hay junto a la opción Miniaturas de forma libre. El cuadro delimitador que rodea el contenedor de miniaturas en la vista Diseño desaparece inmediatamente y el indicador de selección muestra la palabra Proyección.

Haga clic en cualquier otra parte de la página para cerrar el menú Opciones.

Ahora que ha eliminado el contenedor externo para las miniaturas, puede cambiar la posición de cada miniatura para lograr el diseño de página que desee.

Utilice la herramienta Selección para seleccionar una miniatura. Mientras está seleccionada, el indicador de selección muestra la palabra Miniatura. Mueva la miniatura seleccionada hasta la ubicación deseada. Repita este paso para cambiar la posición de todas las miniaturas. Si desea que cada miniatura permanezca en su sitio si el navegador se desplaza o cambia de tamaño, tiene la opción de fijarlas.

En un sitio adaptable, también puede volver a alinear, cambiar el tamaño y configurar las opciones de fijación de las miniaturas.

Seleccione Archivo > Vista previa de página en navegador. Las miniaturas de la proyección de diapositivas se dispersan en la página. Haga clic en las miniaturas para ver la imagen correspondiente en la proyección de diapositivas.

Cierre el navegador y vuelva a Adobe Muse.

En la vista Diseño, expanda la sección Proyección de diapositivas de la biblioteca de widgets. Arrastre cualquiera de los widgets de proyección de diapositivas a una página.

En el menú de opciones, busque la opción Caja de iluminación en la sección Maquetación y compruebe que está seleccionada.

Mientras el menú de opciones sigue abierto, realice cualquier otro cambio para configurar el widget como desee. Por ejemplo, puede mostrar u ocultar los botones Anterior y Siguiente, los pies de ilustración y el contador. Para la pantalla de caja de iluminación, resulta útil activar el botón Cerrar. Active la casilla de verificación que hay junto a la opción del botón Cerrar.

Si lo desea, puede utilizar la herramienta Selección para mover el botón Cerrar a otra ubicación. Cuando los visitantes deseen salir de la pantalla de la caja de iluminación y cerrar la ventana modal, pueden hacer clic en el botón Cerrar o pulsar Esc.

Elija Archivo > Vista previa de página en navegador para probar el widget de proyección de diapositivas. Haga clic en las imágenes en miniatura para ejecutar el efecto de caja de iluminación y ver la imagen principal correspondiente en una ventana modal mientras el resto de la página aparece atenuado.

Haga clic en los botones Siguiente y Anterior para desplazarse por las imágenes de la proyección de diapositivas.

Después de probar la proyección de diapositivas, salga de la vista de caja de iluminación haciendo clic en el botón Cerrar. La caja de iluminación se cerrará y aparecerá el resto del contenido de la página.

Cierre el navegador y vuelva a Adobe Muse.