Comentando con mi amiga Ana Cirujano, estupenda diseñadora visual y de interacción, el State of the World de Matt Mullenweg en WCUS 2019 en tiempo real por WhatsApp, va y me dice:
Desde hace tiempo el publicar presentaciones desde web ha sido un tema recurrente que no estaba resuelto para el usuario medio.
Existen magníficos frameworks como Reveal.js o WebSlides, pero requieren conocimientos relativamente avanzados para su implementación y su uso.
La idea tras estas herramientas es reducir las fricciones que existen al trabajar con diapositivas. Principalmente:
- Tener que compartir pptx o keynote con las fuentes adjuntas
- PDFs donde no se ven los vídeos o elementos interaccionables.
- Usar Slideshare y perder, de alguna forma, el control de tu contenido.
- Problemas de compatibilidades con visores y formatos.
Slide, el plugin para hacer, mostrar y albergar presentaciones de diapositivas
Ahora podemos crear presentaciones directamente desde WordPress, usando el editor de bloques de Gutenberg y mostrando la presentación online con una url de nuestro sitio web. Para ello emplearemos el plugin Slide, creado por la desarrolladora Ella van Durpe.
Instalando Slide
Para poder emplear Slide y crear presentaciones de diapositivas desde nuestra web, es imprescindible tener instalado el plugin Gutenberg. No solo tener activo el editor de bloques (que ya viene por defecto desde la versión 5 de WordPress), sino el propio plugin.
A partir de ahí veremos que Slide crea un nuevo Custom Post Type (un contenido personalizado) en la barra de administración del Escritorio de WordPress, llamado Presentaciones.
Creando tu presentación de diapositivas
Dentro de ese espacio podemos ir creando y administrando nuestras presentaciones, igual a como lo haríamos con las Entradas o las Páginas.
Al crear una nueva presentación podremos ver que nuestro lienzo de trabajo aunque tiene una estructura diferente, resulta indiscutiblemente familiar ya que usa Gutenberg como editor del contenido.
En la zona de trabajo veremos un espacio para el contenido de la diapositiva, limitada por un marco de referencia, y otro inferior para las notas del orador, Speaker notes.
La diapositiva o slide puede crearse utilizando bloques de la misma manera en que crearías cualquier otro contenido en WordPress: párrafos, titulares, imágenes, vídeos… Pero también estructuras más complejas como grupos de bloques, columnas, botones, widgets o incluso formularios.
Cada bloque tiene sus propios ajustes de estilo: colores, fuentes, tamaños…
Las posibilidades son enormes, aunque recuerda que cuanto más simples sean tus diapos mejor llegarán a la audiencia. No te vengas demasiado arriba 😉
Ajustes globales de la presentación
Pero antes de empezar con el contenido, es recomendable que te vayas a la columna de la derecha y realices los ajustes iniciales del documento:
- Formato: 4:3 o 16:9 y márgenes (padding, en realidad) del documento.
- Fuente de los titulares y los párrafos.
- Fondo: color sólido, degradado o imagen.
- Paleta de colores del documento.
- CSS personalizado: que te permite añadir nuevas fuentes a tu sitio, por ejemplo, mediante:
@import url('https://fonts.googleapis.com/css?family=…'); - Transiciones entre diapositivas.
Controles de la presentación: cursores y/o barra de progreso.
Exportar a PDF la presentación.
Especificar la url permanente de esta presentación/página.
Imagen destacada de la presentación/página.
Extracto.
Diseño de pantalla: áreas de widgets visibles.
A partir de aquí solo nos queda ir añadiendo nuevas diapositivas a la que aparece inicialmente (cada una de ellas es un bloque de tipo grupo de bloques).
Ajustes particulares de las slides
Cada slide tiene sus propios ajustes personales:
- Notas del orador.
- Color de las fuentes.
- Fondo: color, imagen, iframe o svg.
- Visibilidad de la diapositiva.
- CSS adicional
Esto nos permitirá realizar ajustes específicos diferentes de los globales de la presentación.
Una vez completada la presentación y publicado el documento, podrás comprobar como la presentación se puede reproducir a ventana completa y controlarse mediante los cursores de tu equipo.
En el caso de un dispositivo móvil, también puedes avanzar y retroceder la presentación arrastrando tu dedo de izquierda a derecha por la pantalla. Realmente muy usable.
Conclusión
En conclusión, Slide es un estupendo plugin que cubre un hueco muy atractivo para todas aquellas personas que se dedican a la formación, que son speakers o que sencillamente necesitan mostrar presentaciones a otros compañeros.
Ahora ya no necesitas preocuparte por el formato de tus diapositivas o cualquiera de los problemas que comentábamos al principio de este artículo.
Desde mi punto de vista una de las mayores ventajas es que tu presentación de diapositivas se mantiene en un formato editable (y por tanto actualizable) en tu propio sitio, bajo tu control. Algo similar a lo que sucede con los Google Docs, pero en tu propio servidor.
Estoy seguro de que este plugin va a crecer en próximas actualizaciones, no solo en uso, sino en posibilidades. Probablemente veremos aparecer extensiones que aumenten sus funcionalidades y configuraciones.
Actualmente, hay algunos detalles en la interfaz de bloques que deben mejorarse (bloques que se solapan o ajustes de tamaños) pero es bastante usable ya desde estas fases iniciales de desarrollo.
Si quieres verlo en marcha, te invito a probar su resultado en esta (sencilla, solo como prueba) presentación de diapositivas.
¿Te animas? Prueba Slide y añade tu valoración a este plugin en el repositorio oficial para ayudar a sus desarrolladores a mejorarlo.
