Todos los proyectos

birkly.io

Web de producto para un CMS

birkly.io es la casa pública de Birkly, un CMS pensado por igual para personas e IA. En siete idiomas, recorre con dueños de negocios, profesionales del marketing, desarrolladores, creadores de producto y agentes de IA lo que Birkly hace por cada uno. Parece sencilla, pero detrás hay todo un conjunto de funciones conectadas, desde una red social y donaciones hasta votaciones de la hoja de ruta y automatizaciones, que funcionan con el propio Birkly.

Cliente
Birkly
Servicios
Diseño digitalDesarrollo webBirkly & plugins
Hecho con
Birkly
Web
Visitar la web

El punto de partida

Un producto, dos lectores muy distintos

Birkly tiene que tener sentido para dos tipos de lector. Una dirige un negocio y quiere una web que pueda actualizar un martes por la tarde sin llamar a nadie. El otro es desarrollador, o cada vez más a menudo un agente de IA, y quiere saber exactamente cómo se guarda, se genera y se amplía el contenido.

Una web de producto que solo habla a la primera suena vaga para el segundo. Una que solo habla al segundo pierde a la primera en el primer párrafo. El encargo de birkly.io era llegar a los dos, y hacerlo sin una sola afirmación que no pudiéramos respaldar.

Texto

Primero palabras sencillas, los detalles a petición

Escribimos la web de fuera hacia dentro. Cada página empieza por lo que Birkly hace por ti, con lenguaje corriente, y solo después muestra cómo: colecciones, entradas, plantillas. Los términos técnicos aparecen cuando son útiles, y cada uno se explica la primera vez que sale.

También dejamos cosas fuera a propósito. No hay cifras de instalaciones, ni logos de empresas que nunca usaron el producto, ni testimonios escritos por nosotros. Birkly está en alfa y la web lo dice: el acceso anticipado se abre por oleadas, la documentación es una edición preliminar y el software será gratuito y de código abierto cuando se lance. La misma regla vale para las máquinas. Un Agent Guide publica las afirmaciones de Birkly como datos estructurados para buscadores y asistentes de IA, cada una revisada y fechada, con una instrucción clara de no inventar funciones más allá de ellas.

birkly.io en un móvil: «A CMS built for humans and AI equally» y un botón menta
La portada dice qué es Birkly en una sola frase.

Diseño

Papel, tinta, menta y abedul

birkly.io hereda sus colores base del propio CMS: papel blanco roto, texto color tinta y un acento menta, de modo que el producto y su web parecen de la misma familia. Los titulares van en Source Serif 4 y el texto en Instrument Sans. Sobre esa base, la web usa un abanico mucho más amplio de recursos visuales y efectos de marketing del que usaría nunca el panel.

Lo más característico son las animaciones de líneas que recorren los fondos de toda la web. Se mueven de forma orgánica y cuentan la historia natural que hay detrás del nombre (birk significa abedul en danés), y marcan el tono de un diseño que equilibra lo natural y lo digital. El lado digital aparece en fragmentos de sintaxis real de plantillas de Birkly usados como etiquetas de sección, como from 'birkly' get 'the point' o for each entry in 'hub' ordered by newest. Y en el Hub, cada plugin tiene su propio color y un pequeño bosque de abedules.

El Hub de birkly.io en un portátil, con tarjetas de los plugins Automation, Commerce, Events, Studio y User Management
El Hub: sintaxis de plantillas sobre el titular y un bosque de abedules para cada plugin.

Mostrar el producto

Pantallas reales, no maquetas

Siempre que la web muestra Birkly, muestra lo real. La portada explica el modelo de contenido en tres pasos (define la forma, rellénala, llévala a una página), cada uno con una captura del panel en funcionamiento: el editor de esquemas, el formulario de entradas y una plantilla en acción. Los ejemplos que siguen también son configuraciones reales: un portfolio, un blog, una documentación, una tienda online, una web de eventos y un feed social, todos hechos con las mismas colecciones, entradas y campos.

Eso cuesta un poco de brillo, porque las interfaces reales tienen casos límite reales. Compensa en el momento en que alguien instala Birkly y encuentra exactamente lo que se le prometió.

Dos portátiles con birkly.io: «One content model. Every kind of site.» en claro y la sección de públicos en oscuro
Un modelo de contenido, todo tipo de webs.

Estructura

De la primera visita a la primera instalación

La web guía a quien la visita a través de una historia de usuario, organizada en torno a las preguntas que la gente hace de verdad, más o menos en el orden en que las hace:

  • ¿Qué es? La portada dice qué es Birkly y después muestra lo que hace por cada tipo de lector: dueños de negocios, profesionales del marketing, desarrolladores, creadores de producto y agentes de IA, que abren todos la misma instalación.
  • ¿Cómo funciona? La página de producto cubre el modelo de contenido, las plantillas, los roles, la IA y los plugins.
  • ¿Puedo fiarme? La documentación está escrita para leerse en una tarde, con caminos distintos para principiantes y usuarios avanzados, y la hoja de ruta hasta la 1.0 es pública y está al día.
  • ¿Puedo influir? Los miembros del Club votan la hoja de ruta, así que la comunidad decide de verdad qué se construye después.
  • ¿Cómo empiezo? Caminos claros llevan al Hub, al Club y al acceso anticipado, que se abre por oleadas.
  • ¿Cómo puedo ayudar? La página de patrocinadores y el Club permiten apoyar un CMS independiente, una vez o cada mes.

Cada página termina señalando la siguiente pregunta, para que nadie tenga que buscar su propio camino por el menú.

Hecho con Birkly

Todas las funciones de Birkly, en producción

birkly.io no solo describe Birkly: funciona con él y usa todas las partes del sistema a la vez:

  • Las páginas y el contenido se editan en el mismo panel que describe la web, en siete idiomas.
  • El Club es una red social que funciona de verdad para la comunidad de Birkly, hecha con el plugin User Management. Los miembros escriben publicaciones, se siguen, comparten anuncios y votan la hoja de ruta.
  • Las donaciones funcionan con el plugin Commerce, como aportación única o como suscripción mensual. Cada una está vinculada a la cuenta del Club de quien apoya, le da una insignia de colaborador y aparece en un muro de donantes hecho a medida.
  • Las automatizaciones responden a los formularios y reparten a la gente de la lista de espera en grupos. Cuando alguien se apunta, un flujo le asigna su grupo y le envía un correo de confirmación, sin que nadie lo haga a mano.
  • Agent Guide y WebMCP describen la web para buscadores y asistentes de IA, y ofrecen a los agentes del navegador unas pocas acciones seguras.

La web parece sencilla, pero las piezas están conectadas: una donación aparece en el perfil de un miembro, los miembros publican y votan, y los votos deciden qué se construye después. Eso convierte birkly.io en la primera y más exigente prueba del producto, y en la demostración más clara de lo flexible que es. Cuando algo resultaba incómodo al gestionarla, se convertía en un cambio en el propio Birkly y no en un apaño en la web.

La automatización «New Waitlister» de birkly.io: al crearse una entrada se rellena un campo y se envía un correo
La automatización de la lista de espera de birkly.io, hecha en Birkly.

El resultado

birkly.io parece una web de producto tranquila, y esa es la idea: bajo la superficie, una red social, donaciones, un muro de donantes, votaciones de la hoja de ruta y automatizaciones funcionan juntas, hechas con las mismas colecciones, entradas y plugins que recibe cualquier usuario de Birkly. Cada afirmación se puede comprobar, y cada mejora de la web empieza siendo una mejora del producto. Es la demostración más clara de lo flexible que es Birkly.

Visitar la web

Sigue leyendo