Ya hemos visto a lo largo de la primera parte de este post el contexto y las características de la gestión de contenidos moderna. También, en la segunda parte, las claves a tener en cuenta a la hora de diseñar el frontend y el backend de nuestro site atendiendo al nuevo escenario en gestión de contenidos.
Ahora llega el turno de hablar de algunos ejemplos reales de cómo hemos aplicado esto en Biko con algunos de nuestros clientes.
Esta reflexión no se basa en lo que hemos leído por ahí o discutido en congresos y eventos. Se basa en la experiencia propia. Allá donde hace años hubiéramos aplicado siempre la misma solución de CMS monolítico, ahora implementamos un marco tecnológico ajustado a las necesidades de cada caso, atendiendo aspectos técnicos y de negocio.
Os presentamos tres casos:
Una solución global para un gigante editorial
Puede que sea uno de nuestros proyectos más emblemáticos hasta la fecha. En este caso, se trata de una de las organizaciones de divulgación científica más importantes a nivel mundial, centrada en ámbitos como la geografía, la educación, la ciencia, la historia… Cuenta con revistas y canales de televisión, pero sin duda una de sus principales herramientas de difusión es su conjunto de sites.
La tarea que ha acometido Biko ha sido ofrecer una solución editorial para los sites globales de este cliente en mercados como México, Brasil, Portugal, España, Francia, Italia, Alemania, Holanda y UK. En total, aproximadamente 1.000 millones de personas de audiencia potencial, pero con un plan de expansión aún más ambicioso.
El proyecto fue iniciado en Atlanta (USA) y posteriormente traspasado a Biko. En origen, una solución tradicional Drupal con costosas necesidades de infraestructura (múltiples regiones geográficas, decenas de servidores, capas y capas de caché, complejidad de despliegues, etc.)
Teniendo en cuenta los principales aspectos de mejora, Biko aportó una solución basada en un modelo desacoplado con Gatsby como frontend. Vamos a echar un vistazo a sus principales características:
- Reducción de servidores a uno único que alberga el backend privado de Drupal.
- Exportación de contenidos a JSON desde Drupal en cada edición de contenido.
- Generación de un site estático en unos segundos gracias a Gatsby.
- Upload del site a CDN
¿Qué ventajas aporta un modelo así? Para empezar, una drástica reducción de costes debido principalmente al recorte en el número de servidores. Pero además, existen otros muchos beneficios:
- Escalado a tamaño Internet: preparado para soportar cualquier pico de tráfico. Cualquiera.
- Seguridad absoluta: es un site estático servido por una CDN que no puede ser atacado.
- Navegación instantánea: Gatsby genera en realidad una SPA dotada de todas las optimizaciones frontend posibles.
- SEO potenciado: todos los contenidos están prerrenderizados en compilación.
- Compilación ultrarrápida: 20.000 páginas compiladas en < 120 segundos
- Rapidez de trabajo:
- Desarrollo de interfaces con React: x3-x5 veces más rápido que con modelo tradicional Drupal
- Paralelización: una vez definida la estructura de ficheros JSON, un equipo de desarrollo backend y otro frontend pueden trabajar en paralelo.
Sin duda, una solución de filigrana a la altura de una empresa de proporciones titánicas.
¿Quieres más? Vamos con otro ejemplo.
Una herramienta de trabajo en un entorno corporativo
Helvetia, aseguradora suiza con fuerte presencia en España, necesitaba dar un salto en el uso de su site como herramienta de gestión y trabajo de agentes a nivel local. La organización ya estaba familiarizada con el CMS Drupal gracias a su web corporativa, por lo que vimos la idoneidad de mantener esta solución como sistema de gestión de contenidos.
Algunos de los requisitos planteados eran el consumo de datos desde APIs externas, disponer de notificaciones push, un sistema de control de visionado de contenidos basado en permisos y roles de usuario y un sistema de login. Todo ello, bajo una capa de interfaz de usuario rica en UX, interactiva y atractiva, por lo que, de manera natural, optamos por React.
Teniendo en cuenta este panorama, teníamos claro que para conectar esta SPA desarrollada con React íbamos a utilizar GraphQL.
Pero, ¿por qué utilizar GraphQL como lenguaje de consulta? A diferencia de un JSON/API, GraphQL nos permite tener un único endpoint desde React y proporciona una mayor simplicidad en las consultas, ya que responde exclusivamente a lo que pedimos. Además, cuenta con un sistema de autocompletado y documentación que lo diferencia del resto de herramientas.
Otra de las ventajas es que nos permite gestionar información en Drupal muy fácilmente con el método CRUD , así como formatear los datos de salida a nuestro gusto. También podemos implementar web services externos en nuevas querys de GraphQL de una manera relativamente sencilla.
Una prueba del potencial de esta herramienta es que GraphQL está siendo usado por muchas de las grandes compañías (Facebook, Shopify, IBM, Gatsby….)
El arte de mostrar arte
No es necesario indagar demasiado para ver que el principal atractivo de un museo es su propia colección, las exposiciones o las distintas actividades programadas en torno
Por ello, cuidar la presencia digital y presentar el contenido de manera adecuada y atractiva es fundamental para un museo. A día de hoy, muchos museos están evolucionando sus plataformas online hacia entornos mucho más versátiles y dinámicos, con interfaces más amigables y con un completo flujo de publicación para los editores.
En este caso, el Museo Nacional Thyssen-Bornemisza necesitaba dar un giro a la gestión de sus activos digitales. Necesitaba una solución que le permitiera mantener una web viva, con información actualizada día a día, con búsquedas de contenidos y actividades y un área privada para Amigos del Museo y periodistas.
Todo ello, por supuesto, siendo una web correcta semánticamente, respetuosa con el SEO, que les permitiera desarrollar toda su estrategia de marketing digital y una integración directa con sus sistemas corporativos vía APIs.
Ante estos requisitos, decidimos apostar por Drupal, ya que se trata de un CMS referente en el mundo de los museos (Tate Modern, Museo del Louvre, Museo Reina Sofía…). No en vano, Drupal permite exponer contenidos de forma eficiente y sencilla a través de un API Rest u otras herramientas. Así, ahorramos mucho trabajo en la parte de diseño y gestión de los mismos.
Otro de sus beneficios es que se trata de una solución Open Source que cuenta con una fuerte comunidad de apoyo en su desarrollo.
Finalmente, nuestra experiencia con Drupal nos permite montar flujos de autoría complejos y de fácil gestión para el cliente. Además, es totalmente escalable y se puede mantener y actualizar fácilmente con cualquier requisito que el museo pudiera necesitar.
Así, nuestra receta fue apostar por una solución en Drupal 8 para gestionar tanto el backend como frontend. En el back tenemos la interfaz estándar de Drupal, y para el front se construyen varios themes personalizados adhoc con plantillas en Twig, de forma totalmente acoplada. Esto nos permite poder gestionar el proyecto con un equipo pequeño y especializado.
Para exponer la Colección, contenidos y actividades se construyó una API Rest basada en el módulo core de Drupal. Mediante content moderation podemos construir complejos modelos de autoría para los contenidos y controlarlos además con el sistema de permisos.
Drupal + Domain nos ha permitido mostrar fácilmente los distintos contenidos en cada dominio, gestionándolos desde un único backend en función de permisos y bajo la misma infraestructura, dando salida tanto a la web del museo como al site EducaThyssen.
Esto son algunos ejemplos de los que llevamos coleccionados en esto que llamamos «gestión de contenidos moderna». Si conoces otras aproximaciones, anímate a compartirlas con nosotros.
Extracto del artículo «Gestión de contenidos moderna: un cambio de paradigma», incluido en Biko Insights #3, el informe de tendencias tecnológicas de Biko.
El artículo completo es el resultado de una reflexión conjunta y aportaciones de muchas personas en Biko: Alberto Silva, Karlos G Liberal, Juanjo López, Rodrigo Alfaro, Luis Gil, Oier Bravo, Diego Cenzano, Aritz Suescun.