Vamos a imaginar que tu empresa es candidata a la realización de un proyecto y que preparas la presentación en un PDF interactivo, ¿crees que la recordarán? yo pienso que sí.
Aunque maquetar una presentación en formato PDF interactivo le aportará mayor dinamismo, los PDFs interactivos son imprevisibles cuando se ejecutan en algunos dispositivos y/o navegadores.
Esto hace que si por ejemplo se abre el documento desde un iPad no se mostrarán correctamente los elementos interactivos.
Curiosamente en mis pruebas se ejecuta sin errores en Internet Explorer y en Safari desde Windows, pero en navegadores como Chrome y Firefox no lo hace adecuadamente.
Por supuesto funciona a la perfección con Adobe Acrobat Reader, un programa que seguro tendrás instalado en tu ordenador.
Aún así dan resultados muy interesantes para presentaciones de empresa, por lo que en este artículo voy a proporcionarte herramientas para que puedas diseñar presentaciones interactivas en PDF.
Yo mismo, antes de comenzar cualquier diseño de páginas web en Valencia, suelo presentar al cliente una demo en formato interactivo. Y la verdad sea dicha, como la página web parece que existe, se hace una idea mucho más clara de su estilo y prestaciones.
¿Qué es un PDF interactivo?
Como su propio nombre indica un PDF interactivo es un documento PDF con formato dinámico al que se le puede añadir botones, enlaces, audios o vídeos y ciertos comportamientos.
También es posible vincular elementos que permiten el acceso a ciertas secciones, como veremos a continuación, o crear animaciones de pasar páginas.
En este tutorial crearemos la carta de un restaurante en formato interactivo en la que incluiremos un menú de navegación para acceder a sus secciones.
Lamentablemente si queremos que esta carta esté a disposición del público en dispositivos móviles, deberemos tener una cuenta de pago de Digital Publishing Suite y trabajar desde un Mac.
Si con todos los inconvenientes que te he planteado te interesa aprender a elaborar presentaciones interactivas para mostrarlas desde un ordenador y quedarte con la peña, estás en el lugar adecuado.
¿Qué programa hay que usar para crear un PDF interactivo?
Para crear PDFs interactivos usaremos inDesign.
InDesign es un programa creado por Adobe en 1999 que se usa para la maquetación de publicaciones profesionales como libros o prensa.
Adobe InDesign es un programa complicado con una curva de aprendizaje bastante prolongada, así que en este tutorial ahorraremos algo de esfuerzo.
Partiremos de imágenes prediseñadas gracias a lo aprendido en el curso de Photoshop, el programa de edición de imágenes por excelencia.
Aunque yo he usado JPG, te recomiendo que tus archivos de imagen sean en formato PNG, que al no tener compresión, permite una mejor lectura de los textos.
Los textos pintados en rojo en la imagen superior, corresponden al menú de navegación y/o al título de cada apartado del PDF interactivo, así que no deben formar parte de las imágenes.
➡ Los introduciremos luego como texto desde inDesign.
Con los diseños preparados podemos comenzar a crear un PDF interactivo 😉
¿Cómo se crea un PDF interactivo o PDF dinámico con InDesign?
Te resumo el proceso de creación del PDF dinámico en unas pocas palabras.
Como ahorraremos parte del trabajo utilizando las imágenes que hemos preparado previamente, la tarea se reducirá a generar los textos del menú de navegación, los títulos de las secciones y a enlazar unos con otros. Luego lo exportaremos como PDF interactivo.
¿Parece fácil verdad? 😉
Realmente diseñar PDFs interactivos no es tan complicado, lo que pasa es que hay que estar al tanto de cada uno de los pasos. Si te atascas en alguno no pasa nada, porque hacia el final del post encontrarás un vídeo de cómo crear un PDF interactivo paso a paso.
Crear nuevo documento en InDesign
En primer lugar es necesario abrir un nuevo documento en inDesign y darle las mismas medidas que a los archivo JPG o PNG que vas a usar de fondo.
Asigna los valores que te indico a continuación:
- Valor del documento: A medida.
- Calidad: Impresión.
- Número de páginas: 1.
- Número de página inicial: 1.
- Páginas opuestas: Desconectado.
- Marco de texto principal: Desconectado.
- Tamaño de página: Tus medidas elegidas en anchura y altura.
- Orientación: Selecciona vertical u horizontal.
- Columnas: 1.
- Medianil: El que venga por defecto porque solo tenemos una columna.
- Márgenes: Todos a cero.
➡ Debes dejar los parámetros tal cual los de la imagen.
Crear nuevas páginas en inDesign
Como la carta va a tener 3 secciones además de la página principal que hará de home (4 en total), en el documento debes crear las páginas necesarias desde el Panel Páginas, que tienes a tu derecha.
➡ En mi caso 4 páginas.
Colocar imágenes en inDesign
En cada una de las páginas del PDF «colocaremos» su imagen de fondo correspondiente.
➡ En InDesign, el término colocar es sinónimo de insertar gráficos.
- Coloca la imagen desde la ruta del menú superior Archivo > Colocar.
- A continuación, sitúa el cursor en la parte superior izquierda de la página, arrastrando hasta el final de la misma para que la imagen ocupe el espacio por completo.
Cuando tengas colocada las imagen que hará de fondo para al PDF interactivo en cada una de sus páginas podemos continuar con el siguiente paso.
Recibe nuevos artículos mensualmente
y aprende más sobre los temas que te interesan directamente desde la bandeja de entrada de tu correo electrónico.
Crear el menú de navegación del PDF interactivo
Es el momento de maquetar el menú del navegación del PDF interactivo, que permitirá acceder a otra sección del PDF pulsando sobre el elemento correspondiente.
➡ La caja de texto para cada palabra debe ser totalmente independiente.
Más tarde habrá que convertir los textos en botones a los que les asignaremos un marcador.
Los que estén familiarizados con inDesign esperarán que «como se repiten», voy a duplicar los textos con una página maestra. Pero no va a ser el caso por hacer el tutorial más sencillo 😉
La primera página de tu archivo PDF interactivo, con los textos ya formando parte del menú, debe quedar tal cual en la foto.
Crear marcadores para el menú de navegación del PDF
Cada una de las páginas representará un apartado de la carta del restaurante, así que utilizaremos estos títulos para implementar los marcadores de los botones.
Crea una caja de texto y titula cada página:
- La primera de ENTRANTES.
- La segunda de PRINCIPALES.
- Y la tercera para los POSTRES.
Convertir textos en marcadores
Si a la derecha no tienes a la vista el Panel de Marcadores, acude al menú superior de inDesign y muéstralo con la ruta Ventana > Interactivo > Marcadores.
Ahora ve a la página de entrantes y selecciona el texto ENTRANTES.
Con el texto seleccionado, desde el Panel Marcadores crea un marcador nuevo.
Como nombre, al crear un marcador inDesign se establecerá por defecto el texto seleccionado.
Convertir textos en botones en un PDF interactivo
Para que al clicar sobre cualquier elemento del menú de navegación nos lleve a su marcador hay que convertir los textos en botones.
Lo haremos seleccionándolos de uno en uno desde el menú superior del programa.
La ruta para llegar a la herramienta es: Objeto > Interactivo > Convertir a botón.
En el Panel Botones y Formularios debemos configurar el botón de la siguiente forma:
- Tipo: Botón.
- Nombre: El nombre del botón (puedes dejar el automático).
- Evento: Selecciona en el desplegable al hacer clic.
- Acciones: Con el signo + añades una acción, y con el signo – la eliminas. Añade una y busca en el desplegable ir a destino.
- Documento: En esta ocasión todo sucederá en el mismo documento. Puedes dejarlo como está.
- Destino: En el desplegable tendrás la lista de todos los destinos que has creado. Selecciona el adecuado para cada botón.
- Zoom: Esta apartado afecta al modo de presentación del PDF. Con Zoom anterior la página se mostrará con la vista que decidas cuando hagas la exportación.
- Apariencia: Si quieres que el botón cambie su opacidad al poner el cursor encima, debes configurar cada uno de los estados: normal, al pasar sobre él y al hacer clic.
- Imprimible: Para elementos que no necesitemos en los archivos a imprimir deselecciona esta opción para que el elemento no se muestre una vez impreso.
➡ Te dejo una captura de cómo se implementa el Panel de Botones y Formularios.
Vista previa de SWF
Para comprobar el funcionamiento de nuestro PDF dinámico, antes de exportarlo a PDF interactivo te recomiendo que pruebes la vista previa de SWF, donde se mostrarán los efectos.
Clonar el menú de navegación en el resto de páginas del PDF
Toca clonar los tres textos del menú convertidos en botones en el resto de páginas.
Para ello usaremos la opción de InDesign pegar en el mismo lugar, que encontraras en el menú superior desde la ruta Edición > Pegar en el mismo lugar.
Con todas las cajas de texto seleccionadas, copia simultáneamente los tres elementos que conforman el menú de navegación con el atajo de teclado Ctrl+C.
➡ Navega por las páginas pegándolos en el mismo lugar.
Exportar un PDF como PDF interactivo
Terminado «por fin» el trabajo de diseño nos queda exportar el documento, que lo exportaremos a un formato mágico: el formato PDF interactivo.
Desde Archivo > Exportar selecciona la opción de Adobe PDF interactivo.
Te dejo preparada la configuración que he usado 😉
Si todo ha ido bien, el efecto será parecido al de una página web, ya que cada vez que pulsemos sobre un elemento del menú nos llevará hasta la sección donde esté el marcador asignado.
Te muestro en vídeo cómo hacer un PDF interactivo
Puedes repasar cada uno de los pasos para conseguir que un PDF sea interactivo en el siguiente vídeo.
Animación de doblez de página en un PDF interactivo
Aunque hemos aprendido lo más básico en lo referente a PDFs interactivos, hay que destacar un efecto que con unos pocos pasos pone «la guinda final al trabajo de diseño».
➡ El efecto de pasar páginas.
En este caso simplemente hay que exportar a SWF en vez de a PDF interactivo.
Aplica la siguiente configuración:
Importante revisar el desplegable de transiciones de página, con el que podemos seleccionar el efecto de transición que nos guste.
¡Una maravilla! 😀
Y nada más. Solo que como otras veces, el tutorial con el que hacer un PDF dinámico o interactivo partió de la consulta que alguien me hizo alguna vez. A él le resolvió la duda y deseo que también haya solucionado la tuya.
Si te sigue interesando trastear con PDFs, tengo otro tutorial relacionado con ellos que tal vez pueda interesarte. Habla sobre una herramienta para cambiar PDFs de formato, los divide, los une, hace casi casi cualquier cosa con ellos.
Muchas gracias por leer este post y si lo haces (que lo espero) , por compartir 😉
Si te ha gustado comparte
33 Comentarios en “¿Cómo crear un PDF interactivo?”
Hola Ernesto!
Espero te encuentres muy bien!!! Leyendo los comentarios vi que platicaste que el pdf interactivo tiene un fin cercano.. y me da curiosidad saber cual es tu opinión sobre cual seria su reemplazo? o que programa recomendarías para hacer algo así como el pdf? Saludos !!!
Hola Ernesto
consulta, lo guarda como pdf interactivo pero ya no esta disponible la opción de guardar en SWF, en ese caso como hacemos??? cual seria la opción??
gracias
Vanesa
Hola Vanesa,
entiendo que estás utilizando una versión posterior a noviembre de 2019; en la que se elimina cualquier resquicio de Adobe Flash, por lo que lo único que te queda es utilizar una versión antigua.
Más allá de eso… te recomendaría Digital Publishing Suite, pero también se la han cargado ¿Conoces spark.adobe.com/es-ES/?
Hola Ernesto,
Quiero ofrecer e-notebooks personalizados y he pensado que con un pdf dinámico podría permitir al cliente personalizar ciertas zonas del cuaderno. El proceso sería 1. Crear PDF dinámico; 2. Importarlo en wordpress /woocommerce; 3. Mostrar el PDF al cliente para realizar personalización (suponiendo que exista el plugin); 4. Guardar los cambios; 5. Descargar el FDF con los cambios en el pc del cliente.
Es posible hacer esto? Muchas gracias, Fernando
Hola Fernando,
no he terminado de entender muy bien a qué te refieres (aunque dudo que exista un plugin que permita modificar PDFs interactivos, y mucho menos que se mantenga en el tiempo). Pero te recomiendo que no quieras utilizar este tipo de PDFs para algo más que presentaciones y/o cosas puntuales, porque su fin está cerca.
Estoy construyendo un portafolio personal y tengo creado un pdf interactivo con mis trabajos. ¿Podrías indicarme cómo subirlo a wordpress, para que se vea bien el la web? Gracias.
Hola Isabel,
para subir PDFs a WordPress tienes la explicación en este post. Sin embargo, no puedo recomendarte ningún plugin para visualizar PDFs porque no he utilizado ninguno. Por motivos de SEO, los contenidos importantes de una web «como un porfolio», deberían formar parte de ella, y no ser un archivo adjunto.
Hola Ernesto!
Justo ahora estoy intentando hacer un pdf interactivo, (Enero 2021) siguiendo todos tus pasos, desde Id cc 2017 pero no me funciona. Tendrá algo que ver la baja de flash? o qué puede estar fallando?
Agradezco tu respuesta
Hola Alejo,
con los datos que me das «qué sé yo qué puede fallar» 😀
Si sigues los pasos al pie de la letra no puede fallar.
Suerte!!!
hola Ernesto tengo un problema quiero incluir en un portafolio un gif hago el proceso como se debe al previsualizar el gif tiene movimiento pero al exportarlo intentar verlo el gif aparece como una imagen estática y no encuentro la manera de que al exportarlo pueda verlo con movimiento por favor ayúdame.
Hola Nestor,
El PDF no te va a reproducir el GIF. Nunca lo he probado, pero parece que hay algún truco que otro que puedes utilizar; como convertir el GIF en MOV con Quicktime.
A ver si esto te ayuda: stackoverflow.com/questions/9009771/is-it-possible-to-embed-animated-gifs-in-pdfs
Suerte!!!
Hola, Muchas gracias super bien explicado, tengo una situacion los botones (bookmarks) no me funcionan en mobile.
Nose si me puede ayudar gracias
Hola María,
inexplicablemente los dispositivos móviles no soportan bien los PDF interactivos; algo que comento en el propio post. Así que lo que te ocurre es totalmente normal.
Buenas tardes Ernesto! He seguido todos los pasos y logré armar el PDF interactivo, muchas gracias!!!.. el problema es que al abrir el PDF no quiero que se vean todas las páginas, sino solo la primera (pero necesito de todas para que la navegación funcione) solo que no quiero que la otra persona vea las 20 páginas de la programación. Es posible ocultarlas al exportar? Probé con tildar la opción de PDF en pantalla completa, y yo lo abro perfecto (solo me muestra la primer página) pero a la persona que lo recibe no le pasa lo mismo y al abrir el PDF ve las 21 páginas del PDF. Gracias! saludos!!!
Hola Milagros,
mediante Adobe Acrobat Pro puedes configurar esa opción.
Ernesto Gracias por tus explicaciones,
tengo una pregunta, si exporto como documento SWF y lo envío a alguien que no tengo FLASH ¿puede verlo?
Hola Mariana,
las siglas SWF significan Shockwave Flash. Eso implica que el formato está directamente relacionado con este programa, y que sin él no funcionará.
Hola, felicitaciones, muy buena explicación del proceso… Una pregunta, existen algunos estándares o criterios para elaborar documentos interactivos? dónde los puedo encontrar?
Gracias,
Hungria
Hola Hungria!!!
Que yo sepa ninguno específico. Pero al ser un documento navegable, podrías utilizar algunos de los criterios seguidos para el diseño web: Simplicidad, estructuración y optimización de imágenes.
¡Con que poco!, ¡Tanto! Gracias
Muchas gracias Afro!!!! 😀
Hola Ernesto!
He hecho un PDF interactivo desde indesign, siguiendo tus instrucciones. Todo perfecto, el problema es que envío el pdf a otra persona en una carpeta junto con los vídeos en mp4 y no lo ve. He pasado los vídeos a FLV Flash y tampoco… qué puede pasar?¿
Hola Lotes,
ese problema suele estar en el otro equipo, que no tendrá instalada el reproductor Flash adecuado. De hecho, no he incrustado ningún vídeo en el tutorial precisamente por ese motivo. No puedes controlar el dispositivo desde el que se visualiza el PDF interactivo.
Hola estoy buscando como hacer un documento dinámico con gráficas y datos de excel, esto es posible??
Saludos y Gracias.!
Hola Oscar,
la verdad es que para esto inDesign se queda un poco corto, o no he descubierto otro sistema.
Te cuento…
Los filtros para la importación de Excel a inDesign solo permiten importar texto, desde Archivo > Colocar.
Así que el truco que utilizo para llevar gráficas de Excel a inDesign es pasarlas antes por Illustrator 😉
Paso 1: Copias la gráfica del .xls y la pegas en illustrator, con el copiar y pegar de toda la vida.
Paso 2: Copias la gráfica de illustrator y la pegas en inDesign.
Ya tienes la gráfica del .xls en inDesign 😀
La pena es que no puedes modificar la gráfica como documento enlazado, desde el archivo original xls, pero la técnica te permite incluir gráficas en tu archivo PDF dinámico.
Espero haberte sido de ayuda.
SALUDOS, EXCELENTE APORTE, UNA PREGUNTA ERNESTO, PUEDO TRABAJAR TODO EN WINDOWS? OTRA PREGUNTA, NO VEO QUE HAYAS UTILIZADO EL Digital Publishing Suite QUE MENCIONASTE AL INICIO.
Hola Mario, ante todo gracias por la vista.
Como respuesta a la primera pregunta, SÍ puedes trabajar con Windows. Yo no trabajo con otra cosa 😉
Para la segunda…
No hablo de Digital Publishing Suite porque no hace falta para un documento como el del ejemplo. Esa herramienta, que es más bien un conjunto de herramientas y servicios (de pago), se utiliza para crear y distribuir publicaciones digitales para tablets.
Hola Ernesto saludos, muy buen post, mi problema es el siguiente: Estoy haciendo un portfolio en PDF interactivo y cuando lo exporto no me funcionan todos los botones y no me aparecen igual que en la previsualizacion, en cambio me aparece una mano en el puntero con una flecha hacia abajo para poder cambiar las páginas, por favor dime como solucionarlo muchas gracias.
Hola William,
si lo estás exportando como PDF interactivo y lo estás abriendo con Adobe Acrobat Reader no tendría por qué fallar nada.Haz la comprobación.
Si no te sigue fallando envíamelo por correo y le echo un vistazo.
Gracias por tu visita 😉
Hola buenas tardes, un pregunta, el pdf interactivo lo puedo enviar en un e mail, como cualquier pdf y al recibirlo lo diseccionara al pdf , o en esa situación como debo exportarlo o enviarlo? gracias de antemano.
Hola Carolina,
claro que puedes enviar un PDF interactivo por email. Siempre que no supere el tamaño máximo permitido por tu gestor de correos.
Buenos días Ernesto.
Mi duda es la siguiente. He diseñado un catálogo en InDesign y quiero exportarlo como PDF interactivo; he hecho todos los pasos similares a los que ud indica y lo único que deseo es que a la hora de exportar el catálogo, pueda ejecutar en Acrobat el doblez de página interactivo y esto no me esta pasando (no aparece el doblez de pagina)
Hay algo que esté haciendo mal o es normal esto.
Un saludo y muchas gracias
Enrique
Hola Enrique,
para la transición de páginas NO debes exportar como PDF interactivo, sino como SWF. Lo abrirá Adobe Flash Player.