iBooks Author: Métodos para colocar imágenes a pantalla completa, por Davide Barranca

20/04/2012 por Alf

Una de las características más interesantes -aunque sea obvia- de iBooks Author es la posibilidad de hacer que una imagen llene la pantalla, de manera que cualquier ilustración por pequeña que sea pueda apreciarse tan grande como permita el tamaño de la pantalla... y más allá, ampliando con el zoom. Sin embargo, hay al menos tres formas de hacerlo en iBooks Author, cada una con sus pros y contras: porque pantalla completa e imagen sin bordes no son sinonimos.

Imágenes

Probablemente ya te has dado cuenta de que no hay un ítem de menú para Insertar - Imagen. Puedes arrastrar y soltar un JPG o PNG (si te interesa la transparencia) bien desde el Finder o desde el panel Multimedia, o Elegir… uno (Comando Mayúsculas V). Como en Pages, puedes redimensionarla, desplazarla, etc. Pero la imagen no permitirá ningún tipo de zoom/pellizcado: será una imagen estática, fusionada en el fondo, cuando la exportes al iPad. Los usuarios podrán tocarla una o dos veces (el gesto para ampliar en iOS), pero no ocurrirá nada). Para que tenga interactividad, la imagen tiene que convertirse en un Widget.

Widget de imagen

De vuelta a iBooks Author, selecciona la imagen y abre la pestaña de Widgets en el Inspector (si el Inspector no es visible como paleta flotante, haz clic en la "i" blanca con círculo azul que hay en la barra de herramientas).

Marca la casilla de Título o Pié de foto (o ambas) para transformar la imagen en un Widget de imagen. Si lo deseas, puedes etiquetar el Título desde el menú desplegable y escoger de la larga lista la definición correcta (Diagrama, Figura, Gallería, Illustración, Imagen, Interactiva, Película, Repaso), permitiendo la numeración automática.

Si no te interesa tener Título o Pie de foto, borra el texto en el editor y déjalos en blanco. Por si te interesa, la Etiqueta no está relacionada con el tipo de widget (puedes tener un Widget de imagen etiquetada como Película y no pasará nada).

La pestaña de Interacción (justo al lado de la de Disposición) muestra una prometedora casilla para marcar que dice "Solo pantalla completa". Aunque en todas partes te dicen que la marques, no tiene ningún efecto. De hecho no entiendo para qué sirve, ya que aparentemente no tiene efecto alguno una vez exportado como iBook.

En el iPad, la imagen ocupará toda la pantalla cuando hagan doble toque sobre ella:

Aún así, aunque la imagen está a pantalla completa, tiene bordes. De hecho, si por alguna razón no quieres que la imagen se reescale, la dimensión máxima a la que se mostrará a pantalla completa es de 2.008 x 1.319 píxeles. Un borde de 20 píxeles por cada lado siempre se mantiene, y la imagen se coloca sobre un fondo blanco. No he encontrado forma de cambiar su color.

Widget Galería

Se puede conseguir una imagen a pantalla completa usando el widget Galería. Haz clic en el botón Widget de la barra de herramientas y selecciona Galería, o desde el menú Insertar - Widget - Galería. Se trata de una colección de imágenes con un espacio para colocar dentro del texto (las miniaturas para las otras imágenes son opcionales), que puedes desplazar con un dedo tanto en tamaño normal como a pantalla completa. Las imágenes comparten todas el mismo título, y los pies de foto son opcionales. ¿A que suena bien? Puedes crear una Galería con sólo una imagen. Este es el aspecto que tiene (una auténtica imagen sin bordes a pantalla completa).

Un toque en la imagen y tanto el Título como el pié de foto desaparecerán. ¿Qué problema tiene el widget Galería?

No se trata de que el título sea Galería incluso si sólo tiene una imagen (puedes cambiarlo desde el menú desplegable de Etiquetas). Como se puede ver en la captura de iBooks Author, muestra dos flechas grises que son para navegar por las imágenes.

Las flechas no aparecerán en el iPad si la Galería sólo tiene una imagen, pero el widget acaba teniendo un espacio extra en blanco absolutamente desperdiciado en la parte inferior que arruina el aspecto de la página. Al menos en mi opinión, y para mi esa es la que cuenta.

A pesar de todo, esta es la mejor solución para mostrar una imagen sin bordes a pantalla completa, con titulo y pie de foto opcionales, pero con ese contra en el diseño de la página del libro.

Widget de imagen interactiva

Este widget es para ampliar la imagen en zonas predefinidas, que normalmente incluirán pies de texto: del mismo modo que se puede construir una Galería con una sola imagen, puedes añadir un widget de imagen interactiva sin añadir vistas extra o puntos de ampliación de información. Sólo tienes que añadir el widget y borrar las vistas en la pestaña Widget del panel Inspector. Así se verá a pantalla completa (se pasa a pantalla completa pellizcando hacia afuera -menos intuitivo que las otras. Probablemente habrá que poner la instrucción en el pie de foto para que el lector sepa que puede interactuar):

No tiene título ni pie de imagen - puede resultar útil en ocasiones.

Sin embargo, para mi, es que en iBooks Author es prácticamente imposible hacer que la imagen pequeña encaje en el espacio del widget (manipulando la ampliación de la imagen), evitando la desequilibrante barra que aparece por arriba (y también por debajo, en ocasiones) de la imagen. Te sugiero, si utilizas el zoom para ocupar la mayor cantidad de espacio posible, que marques el botón Fijar vista, porque si no, el widget devolverá la imagen a su valor inicial.

¿Qué problemas has encontrado al maquetar con iBooks Author?

Traducido del blog de Davide Barranca

0
Comentarios
  • #1 por Sandra Martinez Fernández el 21/05/2012
    Hola! Muchas gracias por estos tutoriales me están siendo de gran ayuda. Espero que me puedas ayudar en esto también, quizás es una tontería pero yo no logro dar con ello, ¿¿a una imagen se puede añadir un hipervínculo?? Entiendo que no porque como ya te dije no encuentro la manera, no se si a través de algún widget o algo... Me parece bastante raro lo verdad.
    Muchas Gracias! :)