Contenido. Instalación. Menú de la paleta de publish88. Acciones de los componentes. Go to layer. Slide projector. Gallery.

Transcripción

1 Tutorial

2 Contenido Instalación Menú de la paleta de publish88 Acciones de los componentes Go to layer Slide projector Gallery More info Video Audio streaming Embedded video URL Google maps Tap on text Panoramic 3D 3D View Upload! Contenido

3 Instalación 1. Aplicación Adobe InDesign Se recomienda que la aplicación permanezca cerrada al momento de agregar el Plug In. Para realizar la instalación se debe descomprimir el archivo Publish88.zip. La carpeta del mismo nombre se debe integrar completa a la carpeta de Plug-Ins de la Aplicación Adobe In Design (CS5 o CS4 según el Plug In solicitado). Descomprimir Carpeta publish88 Ubicar Aplicación Depositar en carpeta Ruta Confirma la correcta instalación del PlugIn al desplegar esta paleta cuando se abre la aplicación Plataforma

4 Instalación 2. App Para visualizar la publicación en ipad Desde el AppStore buscar el App de publish88 for ipad y descargarla 1, es gratuita En los settings del App deberás ingresar tu usuario y contraseña 2 para visualizar tu publicación. Deberás activar la opción Test Mode 3 3. Monitor Monitorea el armado de tu publicación Se ingresa al monitor con el usuario y contraseña asignados El navegdor está diseñado para visualizar los trays en formato vertical, horizontal o ambos. Se selecciona el formato de preferencia y dando click en GO 4 se despliegan en pantalla. La información que muestra se encuentra alojada en el servidor de Publish88, se requiere conexión de internet para lograr el proceso completo. 4 Plataforma

5 Paleta publish88 Desde menú contextual de la paleta de publish88 aparace esta ventana de opciones Log In/Out Acceso a la cuenta, se requiere usuario y contraseña 2 New Edition Vertical / Horizontal 3 Transport to landscape Trasladar una edición vertical a horizontal, respetando la configuración de los componentes 5 Upload Exportar trays para publicación, acceso directo con el botón ubicado en la parte inferior de la paleta 6 Create document library Opción que facilita el traslado de elementos de un archivo preparado para print, previo a que se trabaje con publish88 4 Show ipad frame Muestra por medio de una capa el marco del dispositivo Plataforma 5

6 Paleta publish88 1 a La paleta de publish88 secompone de: 1 Stories Ventana donde se administren los grupos de acciones. Se asignará un encabezado (slug line) a cada grupo (Story) 2 h b c Sus elementos: a. Slug line b. Nuevo story c. Eliminar story 2 Story components Corresponde a las acciones que se le asignen a cada componente. d e f g Sus elementos: d. Editar component e. Buscar liga para component f. Nuevo component g. Eliminar component h. Acciones de components. Menú *ver siguiente página 3 Upload Exportar trays para publicación, acceso directo con el botón ubicado en la parte inferior de la paleta. 3 Plug in

7 Menú de la paleta de publish88 1. Acciones de los components Dando click en el botón (None) despliega el menú de acciones Cada component tendrá que ser administrado por un Story. A excepción de las imágenes que son detecadas automáticamente como Image, los demás componentes aparecerán sin asignar una función (None). Si al integrar un component no se ha asignado un Story, solicitará un Slug line para crearlo y se genera uno nuevo que administrará este componente. Si al momento de integrar un nuevo component se tiene seleccionado un Story automáticamente se agregará a su lista de acciones. Los Stories pueden contener diversos componentes, inclusive de distintas páginas, la organización de estos se deja al criterio del usuario. Las acciones recomendadas para ser administradas por un solo Story son Slider y Scroll.

8 Acciones de components Go to tray Función: Ir a un tray asignado Se programa a través de una caja creada con la herramienta de caja rectangular (shortcut f) Se genera un nuevo Story y se le asigna un nombre. Se crea la caja destinando el espacio táctil para la acción, esta caja se arrastra a la ventana de story components. Aparecerá un nuevo elemento en la lista, y se le asignará la acción Go to tray, la cual se encuentra desplegando con el botón ubicado en la parte superior de la sección de Story components Si no se generó previamente un Story se solicitará un slug line para agregar el componente a la lista. Plug in

9 Go to layer Go to Layer Layer Display Función: Mostrar un layer oculto dentro de un espacio definido en el diseño de una página Para programar este componente se requiere agregar las capas deseadas al documento. Colocar la información en cada uno de las capas dentro del área a mostrar que se haya definido. La capa principal (Layer 1, generalmente) debe quedar por encima de las otras capas, las cuales se ocultarán. Fig. 1 Fig. 1 Se genera un nuevo Stor y se le asigna un nombre. (Go to layer, ej) Se crea una nueva caja (f) con la cual se define el espacio de despliegue del contenido de cada capa y se arrastra a la ventana de Story components asignándole la opción de Layer display ubicada en el menú de la paleta de publish88. Component

10 Go to layer Adicionalmente se generan los botones para direccionar a cada capa, creando cajas de acuerdo al número de capas que se deseen mostrar en la página, se agregan al mismo Story, a cada component se le asigna la función Go to Layer desde el menú de la paleta de publish88, se coloca en la captura el nombre exacto de la capa. La imágen de la izquierda muestra la estructura final del Story. Nota: las cajas generadas para los components son invisibles al lector, por lo que se recomienda el uso de recursos gráficos para evidenciar la presencia de estos. Component

11 Slide Projector Slide Projector Función: Mostrar varias fotografías en un mismo espacio dentro del diseño de una página, se arrastra la fotografía hacia los laterales para ver las siguientes. Para programar este componente se requiere agregar capas de acuerdo a la cantidad de imágenes que se desee desplazar dentro del espacio de Slide. Las imágenes que se colocan en cada capa deben ubicarse exactamente en la misma posición. La capa principal (Layer 1, generalmente) debe quedar por encima de las otras capas. Se genera un nuevo Story se le asigna un nombre. (Slide Projector, ej) En la capa principal se coloca una caja (f) en la misma posición que las imágenes de las capas destinadas para el Slide, esta caja será el área que se asigne para la ación, se arrastra la caja a los components y se le asigna la opción de Slide Projector. Component

12 Slide Projector Se desactiva la capa principal para poder visualizar las inferiores, se arrastra la imágen de cada capa al Story components, debiendo quedar el mismo número de components asignados como imágen, con el número de capas. En este caso el component identifica automáticamente que la caja contiene imágen y no es neceario asignarle la función desde el menú de la paleta de publish88. El orden de las imágenes se rige por el orden que aparecen dentro de Story components, se pueden modificar arrastrando hacia arriba o hacia abajo el componente dentro de la ventana. No interfiere el orden de las capas del documento. La imágen de la izquierda muestra la estructura final del Story.

13 Gallery Gallery Image Función: Mostrar varias fotografías vistas desde una ventana auxiliar, en modo pantalla completa, con opción de pie de foto. La habilidad de la herramienta tambien se basa en hacer zoom (pinch) a las imágenes. Para programar este componente se requiere colocar la serie de imágenes a un costado del espacio de diseño. Es indistinto el tamaño de la caja o si aparece la imágen completa, se tomará solo la liga o ruta del archivo para proyectarlo como galería. El formato de las imágenes puede ser JPG a una resolución de 132 dpi s con un tamaño de 1024 x 768 pixeles, también acepta formatos PSD, TIFF, EPS. Las imágenes se optimizarán al momento de la exportación. Se genera un nuevo Stor y se le asigna un nombre. (Gallery, ej) Component

14 Gallery Se arrastrarán al mismo Story las cajas de imágenes y aparecerán enlistadas, A la caja que detona la acción se le asigna la función de Gallery. También se pueden agregar las ligas de las imágenes desde la herramienta de búsqueda de la paleta de publish88, aun cuando no se vea en el documento la caja del component. Si ya existe una caja con el texto de pie se arrastra junto con la imágen y se genera un solo component. Para agregarle pie de foto a la imágen es necesario seleccionar el component y dar click en el ícono editar. Se mostrará una ventana de captura en la cual se agrega el texto. La imágen de la izquierda muestra la estructura final del Story.

15 More info More info Función: Mostrar una etiqueta sobre cualquier objeto al dar click. Se genera un nuevo Storie y se le asigna un nombre. (More info, ej) Se crea una caja destinando el espacio táctil para la acción, esta caja se arrastra a la ventana de story components. A este component se le asignará la acción More info. La imágen de la derecha muestra la estructura final del Story. Component

16 Video Audio Streaming Video Audio streaming Función: Integrar video audio a una página Se debe considerar el alojamiento del material en un servidor o FTP, esta opción también puede alimentarse desde ligas de YouTube. Se genera un nuevo Storie y se le asigna un nombre. (Video Audio, ej). Se crea una caja destinando el espacio táctil para la acción, esta caja se arrastra a la ventana de story components, al cual se le asigna la función de Streaming Video o Streaming Audio. La imágen de la derecha muestra la estructura final del Story. Component

17 Embedded Video Embedded Video Función: Integrar espacio para visaulizar video dentro de una página Se debe considerar el alojamiento del material en un servidor o FTP Se genera un nuevo Storie y se le asigna un nombre. (Embedded Video, ej). Se crea una caja destinando el espacio de viualización del video, esta caja se arrastra a la ventana de story components, se le asigna la función de Embedded Video. La imágen de la derecha muestra la estructura final del Story. Component

18 URL Google maps URL Google maps Función: Direccionar a una acción web (Página de internet, enviar a un mail predestinado, ubicación de un lugar en google map) Se genera un nuevo Storie y se le asigna un nombre. (URL Google map, ej). Se crea una caja destinando el espacio táctil para la acción, esta caja se arrastra a la ventana de story components, se le asigna la función deseada. Component

19 URL Google maps URL Considerar que la visualización de la página web se basa en el código de generación, si está basado en un formato.swf la visualización será nula. El formato deberá ser html. Podrá configurar cualquier dirección de correo electrónico existente. Google maps Colocar la dirección de búsqueda que arroje google. La imágen de la izquierda muestra la estructura final del Story. Component

20 Tap on Text Tap on text Función: Ventana flotante que se activa através de un botón y que tiene como finalidad ofrecerun artículo (o información) con formatos tipográficos predeterminados e imágenes. Se genera un nuevo Story, se le asigna un nombre. (Tap on text, ej). Se crea una caja destinando el espacio táctil para la acción, esta caja se arrastra a la ventana de story components, se le asigna la función Action point. Los elementos a integrar en la ventana flotante se generan fuera del área de diseño de la página y de forma independiente. Fig.2 Component

21 Tap on Text Fig. 2 Estas cajas con contenido se arrastran a la ventana de story components, se le asigna la función de acuerdo a la jerarquía de cada una de ellas. La imágende la derecha muestra la estructura final del Story.

22 Panoramic 3D Panoramic 3D construction Origin Horizontal cross Strip ic 3D construction Panoramic 3D Función: mostrar una vista panorámica de 360 grados, basado en un montaje de fotografías fijas que se componen de la siguiente manera. Horizontal cross Strip Conversion Left Front Right Left Behind Down Up Result Behind on Left Front Right Left Front Right Behind Down Up Panoramic Behind 3D construction Down Up Origin Imágen basada en una composición de cruz horizontal Horizontal cross Strip

23 Panoramic 3D Se genera un nuevo Story, se le asigna un nombre. (Tap on text, ej). Left Result Front Right Se crea una caja destinando el espacio de visualización. Behind Down Up Por la naturaleza de la imágen, debe ser un cuadrado perfecto, se coloca la imágen dentro de esta caja ubicando la vista frontal en el cuadro. El resto de la imágen permanecerá oculto. Esta caja se arrastra a la ventana de story components, se le asigna la función Panoramic 3D. La imágen de la izquierda muestra la estructura final del Story.

24 3D View 3D View Función: mostrar la rotación de un objeto sobe su eje central, basado en una secuencia de imágenes (de 12 a 34) Vistas desde distintos ángulos

25 3D View Se genera un nuevo Story, se le asigna un nombre. (3D View, ej). Se crea una caja destinando el espacio de visualización. Y se agrega al Story component. Sólo la imágen principal estará dentro del diseño, las imágenes adicionales se colocan fuera del área y se arrastran también a la ventana de Story components. A cada caja se le asigna la función 3D View, mas el número de secuencia a seguir. La imágen de la izquierda muestra la estructura final del Story.

26 Upload! Upload! Función: exportar los trays como contenido, con esta función el proyecto se sube a la nube. Es necesario ingresar usuario y contraseña para realizar la exportación. La configuración de la exportación se realiza desde esta ventana, donde se selecciona el nombre de la edición, la fecha de publicación, el tray que se desea exportar y el rango de páginas que corresponde a ese tray dentro del archivo de InDesign. Al dar click en OK comienza el proceso de exportación, aparecerá una barra de avance.

27 Upload! Al finalizar el proceso se visualiza esta ventana Si se reemplaza un tray en una exportación avisará con este mensaje que el tray ya existe, dar click en continuar para seguir haciendo la exportación. Para monitorear el armado ingresa a con el mismo usuario y contraseña. La publicación ya puede visualizarse en el ipad.