Un SaaS Completo en un Fin de Semana: La Historia de GlamBook

GlamBook es un sistema de reservas para salones de belleza. 25+ modelos de datos en Prisma. 26 servicios organizados en 9 categorías. Motor de reservas con disponibilidad en tiempo real. Vista de calendario día y semana. Booking público con URL personalizable. Diseño inspirado en L’Oréal. 50 imágenes generadas con IA. 12 páginas completas con CRUD.

Lo construimos en un fin de semana.

No un prototipo. No un mockup. Una app funcional que puedes probar ahora mismo en glambook.iamanos.com/book/glambook-demo.

Este artículo es el desglose completo de ese sprint: qué decidimos antes de empezar, qué construimos cada hora, qué problemas encontramos, y qué aprendimos. Es el case study más detallado que hemos publicado en iAmanos sobre cómo la IA transforma los tiempos de desarrollo.

La Decisión: Por Qué un Sistema de Reservas Para Salones

El mercado

En México hay más de 100,000 salones de belleza, estéticas y barberías. La mayoría gestionan citas por WhatsApp o cuadernos físicos. Los que usan software usan Fresha, Vagaro, o Booksy — plataformas extranjeras con precios en dólares que no entienden el mercado mexicano.

La oportunidad: un sistema de reservas hecho para México, con precios en pesos, soporte en español, integración con WhatsApp, y diseño que un salón premium pueda usar con orgullo.

El brief (30 minutos)

Antes de escribir una línea de código, definimos el CLAUDE.md:

  • Problema: Salones pierden citas por gestión manual y no tienen presencia digital profesional
  • Usuario: Dueño/gerente de salón de belleza en México, 5-15 empleados
  • Features core: Catálogo servicios, gestión staff, motor de citas, calendario, booking público
  • Diseño: Inspirado en L’Oréal — elegancia accesible, ivory/onyx/gold
  • Monetización: SaaS mensual, demo abierto sin registro

Día 1 (Sábado): De Cero a CRUD Completo en 14 Horas

Hora 0-2: Scaffold + Auth + Design System

Claude Code creó el proyecto base:

  • Next.js 15.5 con TypeScript + Tailwind + App Router
  • Prisma 6 con PostgreSQL (Docker local)
  • NextAuth v5 con credentials provider
  • Design system completo: variables CSS con paleta L’Oréal (ivory #FFFBF0, onyx #1a1a2e, gold #d4a574)
  • Tipografía: Cormorant Garamond (headers), Archivo (body), Inter (UI)
  • Layout base con sidebar responsive

En 2 horas teníamos un proyecto funcional con login, dashboard vacío, y la estética visual definida.

Hora 2-6: Modelos de Datos + Catálogo de Servicios

El schema de Prisma creció a 25+ modelos. Los principales:

  • Business: nombre, slug, logo, horarios de operación, configuración
  • User: email, password, role (admin/staff/client)
  • ServiceCategory: nombre, orden, icono (9 categorías: Corte, Color, Estilismo, Uñas, Facial, Corporal, Cabello, Maquillaje, Paquetes)
  • Service: nombre, descripción, duración, precio, categoría, imagen
  • Staff: nombre, bio, foto, servicios que ofrece, horario laboral
  • Appointment: fecha, hora, duración, servicio, staff, cliente, estado
  • Client: nombre, teléfono, email, notas, historial

Claude Code generó los 26 servicios con datos realistas para México: precios en MXN (corte dama $350, tinte completo $1,200, manicure gelish $450), duraciones reales, y descripciones profesionales.

También generó el CRUD completo de servicios: lista con filtros por categoría, formulario de creación/edición, vista de detalle con foto, y eliminación con confirmación.

Hora 6-10: Gestión de Staff + Calendario

4 perfiles de staff creados con datos ficticios pero realistas:

  • Sofía (directora creativa, especialista en color)
  • Valentina (estilista senior, corte y peinado)
  • Isabella (nail artist, uñas y extensiones)
  • Camila (terapeuta spa, facial y corporal)

Cada staff tiene: foto generada con Imagen 4, horario laboral configurable (lunes a sábado, con horarios distintos por día), servicios que puede realizar, y bio profesional.

El calendario muestra citas en vista día y semana. Cada cita se colorea según el staff asignado. Click en un slot vacío → crear cita rápida. Click en una cita → ver detalle y opciones (confirmar, cancelar, reagendar).

Hora 10-14: Motor de Disponibilidad + Booking Público

Esta fue la parte más compleja. El motor de disponibilidad debe considerar:

  1. Horario de operación del salón (ej: 9am-8pm)
  2. Horario laboral del staff seleccionado (puede variar por día)
  3. Citas ya agendadas del staff (bloquear slots ocupados)
  4. Duración del servicio (un corte de 45min ocupa un slot diferente a un tinte de 3 horas)
  5. Buffer entre citas (15 min para limpieza/preparación)

El resultado: una función que recibe (staffId, serviceId, date) y devuelve un array de slots disponibles. El booking público muestra estos slots como botones seleccionables.

La URL de booking público: glambook.iamanos.com/book/[slug]. Cualquier persona puede entrar, ver servicios, elegir staff, seleccionar horario, y agendar sin necesidad de login. La confirmación llega por email.

Al final del día 1: app funcional con auth, catálogo, staff, calendario, motor de citas y booking público. 14 horas de trabajo con Claude Code.

Día 2 (Domingo): Pulido, Imágenes IA y Deploy (10 Horas)

Hora 0-3: UI Polish + Carrusel + Ficha Técnica

El día 2 fue de pulido visual. Claude Code refinó:

  • Carrusel INV en la página de inicio: slider de servicios destacados con imágenes y precios
  • Ficha técnica de servicio: página individual con foto grande, descripción, duración, precio, staff disponible, y botón de reservar
  • Dashboard con métricas: citas de hoy, citas de la semana, clientes nuevos, ingresos estimados
  • Responsive mobile: sidebar se colapsa, tablas se vuelven cards, formularios se apilan

Hora 3-6: 50 Imágenes con Google Imagen 4

Generamos 50 imágenes que le dan vida a la app:

  • 4 retratos de staff (estilistas mexicanas con look profesional)
  • 26 fotos de servicios (corte en proceso, aplicación de tinte, manicure detalle, facial spa, etc.)
  • 10 ambientes de salón (recepción elegante, estaciones de trabajo, área de lavado, sala de espera)
  • 10 imágenes de productos y herramientas

Todos los prompts incluyeron: “elegant beauty salon, warm ambient lighting, ivory and gold color palette, professional photography”. Esto mantuvo consistencia visual como si todas las fotos fueran del mismo fotógrafo en el mismo salón.

Compresión: max 1280px, 72% JPEG. Upload a la app vía seeder de datos.

Hora 6-8: Datos Demo + Seed Script

Para que la demo sea convincente, creamos datos realistas:

  • 8 clientes ficticios con historial de citas (nombres mexicanos reales)
  • 30+ citas distribuidas en las próximas 2 semanas
  • Reseñas de clientes en cada servicio
  • Horarios de staff variados (Sofía no trabaja lunes, Isabella solo mañanas los sábados)

Todo en un script de seed que puede regenerar la demo con un comando.

Hora 8-10: Docker + Deploy al VPS

Dockerfile multi-stage, docker-compose.yml con labels de Traefik, rsync al VPS, build, up. GlamBook live en glambook.iamanos.com en 30 minutos.

Credenciales de la demo:

  • Admin: admin@iamanos.com / IAmanos2026!
  • Demo: sofia@glambook.com / Demo2026!
  • Booking público: glambook.iamanos.com/book/glambook-demo (sin login)

Los Números del Sprint

  • Tiempo total: ~24 horas de trabajo efectivo (sábado 14h + domingo 10h)
  • Líneas de código generadas: ~15,000+ (TypeScript + Prisma + CSS)
  • Modelos Prisma: 25+
  • Páginas: 12 (Dashboard, Servicios, Staff, Calendario, Citas, Clientes, Booking público, Configuración, Login, Registro, Perfil, y más)
  • Servicios: 26 en 9 categorías
  • Imágenes IA: 50 generadas con Imagen 4
  • Costo de infraestructura: $0 adicional (corre en nuestro VPS existente)
  • Costo de APIs IA: ~$5 USD (Claude Code session + Imagen 4 free tier)

En una agencia tradicional, este proyecto habría costado $200,000-400,000 MXN y tardado 3-4 meses. Lo construimos en un fin de semana por ~$100 MXN en APIs.

Lo Que Salió Mal: Problemas Reales del Sprint

Problema 1: Horarios con timezone

México tiene múltiples zonas horarias. El motor de disponibilidad calculaba slots en UTC y los mostraba sin conversión. Resultado: citas aparecían 6 horas antes de lo esperado. Solución: forzar timezone “America/Mexico_City” en todas las operaciones de fecha.

Problema 2: Duración variable de servicios

Un tinte completo puede tardar 2-4 horas dependiendo del largo del cabello. No puedes bloquear 4 horas para todos. Solución parcial: usar la duración promedio y agregar un campo “duración máxima” que el staff puede ajustar al crear la cita.

Problema 3: Conflictos de booking simultáneo

Dos personas pueden ver el mismo slot disponible y ambas intentar reservar. Sin manejo de concurrencia, ambas crean la cita. Solución: transacción PostgreSQL con SELECT FOR UPDATE que bloquea el slot mientras se procesa la reserva.

Problema 4: Imágenes de staff demasiado perfectas

Imagen 4 generó fotos de estilistas que parecían modelos de revista. Demasiado perfectas para ser creíbles como fotos de empleadas reales. Ajustamos los prompts para pedir “natural look, candid professional photo” en vez de “portrait photography”.

Lo que NO incluimos (pendiente)

  • Integración WhatsApp API para confirmaciones
  • Stripe/MercadoPago para cobros
  • CFDI/facturación electrónica
  • Upload de fotos reales (actualmente solo IA)
  • Multi-sucursal

Estas features son el roadmap de las siguientes semanas. El MVP del fin de semana cubre el core: servicios, staff, citas, y booking público.

5 Lecciones de Construir un SaaS en un Fin de Semana

1. El CLAUDE.md es tu arma secreta

Los 30 minutos invertidos en escribir el brief antes de codear ahorraron horas de correcciones. Claude Code mantuvo la visión del producto consistente durante todo el sprint porque tenía el contexto en el CLAUDE.md.

2. El design system al inicio paga dividendos todo el proyecto

Definir colores, tipografía y spacing en las primeras 2 horas significó que TODAS las páginas posteriores se vieran consistentes sin esfuerzo adicional. Si hubiéramos empezado a diseñar página por página, el resultado sería un frankenstein visual.

3. Los datos demo son tan importantes como el código

Una app con tablas vacías no impresiona a nadie. Los 8 clientes ficticios, 30+ citas, y 26 servicios con fotos hacen que la demo se sienta como un producto real en uso.

4. Deploy en el primer día, no en el último

Desplegamos GlamBook al VPS el sábado por la noche, no el domingo. Esto nos permitió hacer todo el pulido del domingo ya en producción, catcheando problemas de SSL, DNS, y variables de entorno temprano.

5. MVP significa cortar features, no cortar calidad

No incluimos pagos ni WhatsApp. Pero lo que SÍ incluimos funciona impecablemente. Mejor 12 páginas perfectas que 20 páginas mediocres.

Si tu salón de belleza necesita un sistema de reservas profesional, o si quieres un SaaS construido con la misma velocidad y calidad, cotiza tu proyecto en iAmanos. Lo que otros tardan meses, nosotros lo entregamos en días.

La Tecnología Detrás de GlamBook: Stack Detallado

Frontend

  • Next.js 15.5 con App Router y Server Components — render en servidor para SEO y performance
  • TypeScript estricto en todo el proyecto — zero runtime type errors
  • Tailwind CSS con variables CSS custom para la paleta L’Oréal
  • Google Fonts: Cormorant Garamond (300, 400, 600) + Archivo (400, 500, 600) + Inter (400, 500) — cargadas con next/font para performance óptima
  • Lucide React para iconos — consistentes, livianos, profesionales

Backend y datos

  • Prisma 6 con PostgreSQL 16 — 25+ modelos con relaciones tipadas
  • NextAuth v5 — credentials provider, JWT sessions, roles (admin, staff, client)
  • Server Actions para mutaciones — formularios que se submit directamente al servidor sin API routes
  • Zod para validación — schemas compartidos entre frontend y backend

Motor de disponibilidad

El algoritmo de disponibilidad es la pieza técnica más compleja de GlamBook. Funciona así:

  1. Recibe: staffId, serviceId, date
  2. Obtiene: horario laboral del staff para ese día de la semana
  3. Obtiene: todas las citas existentes del staff para esa fecha
  4. Calcula: slots de 30 minutos dentro del horario laboral
  5. Filtra: elimina slots que se traslapen con citas existentes (considerando duración del servicio + buffer de 15 min)
  6. Retorna: array de horarios disponibles como strings ISO

Este algoritmo se ejecuta en el servidor (Server Component) cada vez que el usuario cambia la fecha o el staff en el booking público. Response time: ~50ms incluyendo la query a PostgreSQL.

Infraestructura

  • Docker multi-stage build — imagen final de ~180 MB
  • Traefik como reverse proxy — SSL automático, zero-config routing
  • VPS Hostinger — compartido con las otras 34+ apps de iAmanos
  • Costo marginal: $0/mes adicional (infraestructura ya existente)

Roadmap de GlamBook: Qué Sigue Después del MVP

El MVP del fin de semana cubre el 80% del valor. Esto es lo que planeamos para llevar GlamBook al 100%:

Fase 2: Integraciones (2 semanas)

  • WhatsApp API: Confirmación automática de citas por WhatsApp. Recordatorio 24h antes. Notificación al estilista.
  • Stripe + MercadoPago: Cobro online al momento de reservar (anticipo o total). Suscripción mensual para el salón.
  • Google Calendar sync: Las citas de GlamBook se sincronizan con el Google Calendar del estilista.

Fase 3: Funcionalidades avanzadas (1 mes)

  • Programa de lealtad: Puntos por visita, descuentos automáticos, cumpleaños
  • Inventario de productos: Control de stock de productos de belleza vendidos en el salón
  • Reportes: Ingresos por servicio, por estilista, por mes. Clientes más frecuentes. Servicios más populares.
  • Multi-sucursal: Un mismo salón con varias ubicaciones

Fase 4: Producción y ventas (ongoing)

  • CFDI: Facturación electrónica integrada para salones constituidos como empresa
  • White-label: Dominio propio, logo propio, colores propios por salón
  • App móvil: PWA optimizada para que los estilistas gestionen desde el teléfono

Cada fase se construye con la misma metodología que el MVP: Claude Code como copiloto, sprints cortos, deploy continuo. La diferencia es que ahora tenemos base sólida sobre la cual construir, no empezamos de cero.

El Mercado de Software para Salones en México: Oportunidad Real

¿Por qué construimos GlamBook? Porque el mercado es enorme y está desatendido.

Números del mercado

  • 100,000+ salones de belleza, estéticas y barberías registrados en México (INEGI)
  • 85% gestionan citas por WhatsApp o cuaderno físico
  • 10% usan algún software de gestión (Fresha, Vagaro, Booksy)
  • 5% usan software mexicano adaptado a sus necesidades

Problemas que resuelve GlamBook

  • Citas perdidas: El 30% de los salones pierden al menos 5 citas semanales por mala gestión. A $500 MXN promedio por servicio, son $10,000/mes de ingresos perdidos.
  • No-shows: Sin recordatorios automáticos, el porcentaje de clientes que no se presentan es del 15-20%. Con recordatorio WhatsApp 24h antes, baja a 5%.
  • Presencia digital: La mayoría de los salones no tienen página web. GlamBook les da un booking público con URL personalizable que pueden compartir en redes sociales e Instagram.
  • Gestión de staff: Coordinar horarios de 5-10 estilistas con un cuaderno es caos. Un calendario digital con disponibilidad en tiempo real elimina conflictos de agenda.

Ventaja competitiva vs. Fresha, Vagaro, Booksy

  • Precio: Las plataformas internacionales cobran $20-80 USD/mes. GlamBook puede ofrecerse desde $377 MXN/mes (~$20 USD) con features comparables.
  • Idioma: 100% en español mexicano. No traducciones, no “appointments” — citas, servicios, estilistas.
  • Pagos: Integración con MercadoPago y OXXO — los métodos de pago que usan los mexicanos.
  • Soporte: En español, en horario México, por WhatsApp. No tickets en inglés con soporte en India.
  • Personalización: Cada salón puede tener su propio branding, colores, y dominio.

GlamBook demuestra que con IA puedes construir software que compite con plataformas internacionales — en una fracción del tiempo y costo. Y enfocado en las necesidades reales del mercado mexicano.

El modelo de negocio es claro: construir GlamBook costó un fin de semana de trabajo (~$100 MXN en APIs). Vender una sola licencia a un salón ($377 MXN/mes) recupera la inversión el primer mes. Con 10 salones pagando, son $3,770 MXN/mes de ingreso recurrente. Con 100 salones — una fracción del mercado de 100,000+ — son $37,700 MXN/mes. Todo corriendo en un VPS que ya estamos pagando, sin costo marginal por cliente nuevo.

La velocidad de construcción con IA no solo ahorra tiempo de desarrollo — transforma la economía del negocio de software. El costo de crear un producto nuevo es tan bajo que puedes experimentar con múltiples verticales hasta encontrar la que conecta con el mercado. GlamBook es una de esas apuestas — y los números del mercado dicen que es una apuesta muy bien fundamentada.

Compara esto con el modelo tradicional: una agencia cobra $250,000+ MXN por desarrollar un sistema de reservas similar. El salón necesita vender 660 meses de suscripción solo para recuperar la inversión del desarrollo. Con nuestro modelo, la inversión de desarrollo se recupera con el primer cliente en el primer mes. Esa es la diferencia fundamental que la IA trae al desarrollo de software — no solo velocidad, sino viabilidad económica para productos que antes no tenían sentido construir.

Si quieres explorar otras apps que hemos construido con esta metodología, visita nuestra fábrica de apps donde mostramos el catálogo completo. Y si tu negocio necesita un sistema similar a GlamBook — reservas, citas, gestión de staff — lo podemos personalizar para tu industria en la misma velocidad.

Preguntas Frecuentes

¿GlamBook está disponible para comprar o contratar?

Sí. GlamBook se ofrece como SaaS para salones de belleza en México. Incluye personalización de marca (logo, colores, dominio propio), migración de datos, y soporte. Contacta a iAmanos para pricing y demo personalizada.

¿Realmente se puede construir un SaaS funcional en un fin de semana?

Sí, a nivel MVP. Con Claude Code, un stack estandarizado, y experiencia previa en 30+ apps, puedes construir una app funcional con auth, CRUD, y lógica de negocio en 24 horas. El pulido (pagos, integraciones, edge cases) toma semanas adicionales.

¿Qué stack usa GlamBook?

Next.js 15.5 con TypeScript, Prisma 6 con PostgreSQL, NextAuth v5 para autenticación, Tailwind CSS para estilos, Google Imagen 4 para assets visuales. Deploy en Docker con Traefik en VPS Hostinger.

¿GlamBook funciona en móvil?

Sí. Toda la interfaz es responsive. El booking público está optimizado para móvil porque la mayoría de los clientes de salones reservan desde su teléfono. El panel de administración también funciona en tablet y móvil.

¿Puedo ver una demo en vivo de GlamBook?

Sí. El booking público está disponible sin login en glambook.iamanos.com/book/glambook-demo. Para acceder al panel de administración, usa las credenciales de demo: sofia@glambook.com / Demo2026!