Caso de estudio · Producto & ejecución

CoffeeHouse

De un comentario al pasar a una app usada todos los días en la barra de casa.

Rol
Diseño, especificación y dirección
Tiempo
~4 días · sesiones cortas
Stack
HTML · JS · PWA · localStorage
Estado
En producción, uso diario

01El problema

Tengo una estación de espresso en casa y un molinillo con 30 niveles. Cada café nuevo necesita calibrarse —molienda, dosis, rendimiento, tiempo— y una vez que encontrás el punto, hay que recordarlo. Lo llevaba en la cabeza y en notas sueltas que nunca encontraba.

La idea nació de la forma menos épica posible: esperando que se renovara un límite de tokens de Claude, parado frente a la barra, pensé "tengo un celular Android sin usar y un problema que registrar". No arranqué queriendo hacer una app. Arranqué con un problema real y molesto.

La barra de café antes, sin la app
El punto de partida: la barra, el molinillo de 30 pasos, y ningún registro de nada.

02Cómo trabajé

No escribo código. Todo el proyecto se construyó dirigiendo a una IA: mi trabajo fue especificar bien, iterar sobre lo que volvía, y decidir qué estaba bien resuelto y qué no. Es más parecido a hacer de product manager que de programador — y ahí mi ventaja no era técnica sino de dominio: sé de café, así que podía detectar cuándo el contenido estaba mal.

Cada sesión empezaba con diez minutos de especificación escrita antes de pedir nada. Ese paso —no el prompt— es donde está el verdadero trabajo. La primera spec ya reveló dos supuestos escondidos:

En una iteración se me escapó un "obviamente los gramos" pero no era obvio: ¿los de café molido o los de bebida extraída? Resultó que hacían falta ambos, porque juntos habilitan el cálculo del ratio que necesita un espresso perfecto.

El segundo supuesto: la molienda no es un dato por café, es un dato por café y por método —el mismo grano se muele fino para espresso y grueso para prensa. Descubrir eso temprano evitó rehacer la estructura después.

03Cómo evolucionó

Cuatro versiones, cada una empujada por feedback de uso real, no por un plan cerrado de entrada.

v1
Estructura y persistencia

Tres secciones —registro, estándares, recetas— y datos que sobreviven entre sesiones.

v2
Identidad y contexto de uso

Al definir que viviría en un teléfono apaisado montado en la pared, decisiones "estéticas" se volvieron funcionales: tarjetas deslizables, rueda de molienda que imita el dial físico, paleta que dialoga con la pared verde.

v3
Kiosk real

PWA instalable, funciona sin conexión, timer que sobrevive la suspensión del teléfono, modo oscuro para la noche. Publicada por mí en GitHub Pages.

v4
Ajustes de uso en producción

Layout reorganizado, navegación que se oculta al scrollear, orientación libre para escribir cómodo. Todo detectado usándola de verdad.

Pantalla de registro de cafés Pantalla del timer
Registro de calibración por variedad y timer de preparación, en modo barra.

04Decisiones de producto

Construir no fue lo difícil; decidir qué construir y qué dejar afuera, sí. Dos ejemplos:

Distinguir evolución de "scope creep"

La app terminó siendo mucho más que la idea original, pero creció por capas que el uso validaba, nunca por sumarle features sin sentido. Las ideas grandes que aparecían —un modo guiado paso a paso de cada preparación, por ejemplo— se guardaban en un banco de ideas para madurar, en vez de inflar la versión en curso.

El experto de dominio es el control de calidad

En una iteración, la IA describió mal la diferencia entre un americano y un long black. Yo la sabía; la corregí. Cuando dirigís IA para generar contenido especializado, tu criterio no es opcional: es la última línea de defensa contra lo que suena bien pero está mal.

05El resultado

CoffeeHouse vive hoy en un Moto G100 restaurado, montado en la barra, con su propia cuenta y su identidad visual. La uso todos los días.

La app instalada en la barra, mostrando una variedad con su perfil de cata
En producción: variedad nueva con su perfil de cata cargado, lista para calibrar. En modo barra, la pantalla se funde con la pared.

La primera calibración real fue un magic: molienda demasiado fina, apenas 12,7 g extraídos en 25 segundos. Salió desbalanceado —pero quedó registrado, con la nota de qué probar la próxima vez. Ese bucle —hipótesis, prueba, registro, ajuste— es exactamente para lo que existe la app. Funcionó calibrándola mientras calibraba el café.

El timer de la app, listo en la barra
El timer, a mano durante la extracción. La estación además quedó conectada a asistente de voz y a una rutina de música de barista.

06Qué me llevo

El contexto de uso es parte de la spec

"Se usa en un teléfono apaisado en la pared" convirtió decisiones de estilo en decisiones funcionales.

Lo "obvio" esconde supuestos

Cada palabra dada por sentada en una especificación es una decisión sin tomar.

Terminar > ser ambicioso

Una app chica usada todos los días enseña más que una grande abandonada.

Criticar la causa, no el síntoma

"Quedó como una tabla apretada" permite arreglar la estructura; "está feo" no.

Stack y técnicas

· HTML + JS sin frameworks · PWA instalable · localStorage · Service worker / offline · Wake Lock API · Timer por timestamp · GitHub Pages · Diseño responsive