HOURLINE es una plataforma de reservas online que diseñamos y construimos como concepto, presentada a través de un negocio ficticio: Maison Hourline, tres estudios premium en Moscú, Dubái y Londres con nueve especialistas que ofrecen masajes, tratamientos faciales, peluquería, uñas y fisioterapia. Un interruptor en la barra superior alterna entre las dos caras del producto: la página de reservas que ve el cliente y el back office con el que trabaja el estudio.

El encargo que nos pusimos: reservar desde el móvil debía llevar segundos, la disponibilidad tenía que ser real y no una cuadrícula decorativa, y el estudio debía ver cada reserva en el momento en que se hace. Todo funciona en el navegador de quien la visita: los datos de demostración se generan para cada visitante, se guardan en localStorage y no se envían a ninguna parte.

El cliente pasa por estudio, servicio, especialista, una tira de fechas con una cuadrícula de horas, nombre y teléfono, y una confirmación. Cada estudio muestra su hora local y si está abierto. Unas sugerencias proponen la hora más cercana, «tu hora habitual», aprendida de visitas anteriores, y una hora con el especialista de siempre; «reservar con alguien» busca dos especialistas libres a la misma hora. La confirmación es un pase de estilo Wallet con un archivo .ics real generado en el navegador, y la cita se puede mover arrastrándola por la jornada del especialista o cancelar según la política del estudio.

Detrás de cada hora ofrecida hay un único motor de disponibilidad: el horario semanal y las pausas de cada especialista, las reservas existentes, un margen de preparación tras cada cita, una antelación mínima y un horizonte de reserva, todo calculado en la zona horaria de cada estudio, incluido el cambio de hora de Londres. El calendario del estudio usa el mismo motor: vistas de día y semana, arrastrar para mover, estirar el borde inferior para cambiar la duración y hacer clic para crear; si un movimiento rompe una regla, el bloque vuelve a su sitio con una sacudida y explica el motivo.

El lado del estudio añade lo que llamamos IA de demostración, rotulada en la página como reglas más estadística en el navegador: un riesgo de inasistencia para cada cita próxima, calculado por un modelo bayesiano ingenuo entrenado en el navegador con el propio historial de la demo, con sus factores explicados y una acción sugerida, y «llenar huecos», que empareja el tiempo libre con una lista de espera simulada. Lo completan un panel con un mapa de calor de ocupación, una base de clientes con etiquetas e historial y unos ajustes que llegan al instante a la página de reservas. Sin framework: JavaScript y CSS puros empaquetados con esbuild, dos tipografías alojadas en el propio servidor, Cormorant y Manrope, y una paleta crema y piedra con un acento berenjena.

El concepto funciona en /demos/hourline/ con siete vistas, dos del lado del cliente y cinco del estudio, en inglés y ruso. El 28 de septiembre de 2026 lo medimos nosotros mismos en Chrome headless en un MacBook, con el reloj de la demo fijado en el 1 de octubre de 2026 a las 15:40: una reserva automatizada en una pantalla de móvil de 390 px, con una pausa de 0,9 s tras cada toque, tardó 6 s desde el primer toque hasta la confirmación según el cronómetro de la propia demo (mediana de 14 ejecuciones, entre 6 y 16 s). Una reserva hecha en una pestaña apareció en el calendario del estudio abierto en otra.

Una comprobación independiente por fuerza bruta volvió a verificar las 658 horas que el motor ofreció en diez días, tres estudios y nueve servicios frente a horarios, pausas, reservas con sus márgenes, antelación mínima y la ida y vuelta por la zona horaria: ningún hueco erróneo, ninguna reserva doble y ningún margen incumplido, y la misma prueba a través del cambio de hora de Londres del 25 de octubre tampoco encontró fallos. Todo el JavaScript y el CSS pesan 95 KB con gzip. En la dirección pública, Lighthouse 13.5 (cinco ejecuciones por dispositivo, medianas, en un MacBook con una carga media de 3 a 9) dio un rendimiento de 94 en móvil y 100 en escritorio, con accesibilidad y buenas prácticas en 100, y la página transfiere 0,2 MB.