Proyectos
Cookbook — Una app de recetas con IA
- Encuadre del problema: entrevisté a una mezcla de cocineros cotidianos, padres y usuarios con restricciones alimentarias (vegetarianos, sin gluten, diabéticos) para encontrar los puntos de dolor reales. El patrón recurrente no era "no sé recetas" — era fatiga de decisión y desperdicio de ingredientes.
- Mapeo de jobs-to-be-done: surgieron tres jobs dominantes — "usa lo que ya tengo", "alimenta a esta persona específica esta noche" y "aprende a cocinar una cocina específica". El producto tenía que servir a los tres sin esconder uno detrás de otro.
- Auditoría de contenido de cómo los sitios convencionales de recetas estructuran una receta, que sacó a la luz una larga lista de lo que los usuarios realmente saltan (historias personales, relleno SEO, cortes de publicidad) frente a lo que sí consumen (ingredientes, tiempos, sustituciones).
- Pruebas de prototipo: flujos en Figma de baja fidelidad frente a usuarios reales para validar que una entrada conversacional "dime qué tienes" le ganaba a un buscador tradicional. Lo hizo, de forma contundente.
- Una estética editorial y calmada — espacio en blanco generoso, una paleta neutra cálida amigable con comida y un sistema tipográfico que respeta el contenido largo de una receta.
- Receta-como-documento: cada receta está maquetada como una página de un libro de cocina bien diseñado, no como una página web. Imprimir a PDF es una feature de primera clase (vía
jspdf) porque las cocinas reales todavía imprimen.
- Layout mobile-first: el caso de uso principal es alguien parado frente al mostrador con una mano libre. Tap targets grandes, modo paso con scroll bloqueado y tipografía legible a la distancia de los brazos.
- Contraste accesible y encabezados semánticos en todo — porque filtros dietéticos, alérgenos y guía paso a paso son contenido genuinamente relevante para la seguridad.
- Micro-interacciones donde añaden claridad (ingredientes marcables, progreso de paso) y en ningún otro lugar.
- Generación de receta con IA a partir de ingredientes: describe lo que tienes, obtén una receta real adaptada.
- Perfiles dietéticos y de hogar: recuerda que cocinas para dos, uno de los cuales es sin gluten.
- Guardar, organizar e imprimir: biblioteca personal de recetas con exportación a PDF.
- Sustituciones inteligentes: swaps sugeridos por la IA cuando falta un ingrediente.
- Páginas de receta compartibles con URLs limpias y previews sociales correctas.
- Frontend: React 18, Vite, TypeScript, Tailwind CSS, React Router,
react-helmet-async para metadatos por receta, lucide-react + Heroicons para iconografía.
- Exportación PDF:
jspdf para renderizado imprimible de recetas.
- Backend / datos: Firebase (Auth, Firestore, Cloud Functions, Storage), Firebase Data Connect con cliente tipado generado, reglas de seguridad de Firestore escritas a mano con revisión de least-privilege.
- Capa de IA: generación de recetas respaldada por LLM con prompting de salida estructurada para que la UI pueda renderizar de forma confiable, no "best-effort".
- Observabilidad: Sentry para tracking de errores frontend y monitoreo de rendimiento.
- Móvil: build móvil acompañante compartiendo la misma API y tokens de diseño.
- Hosting: Firebase App Hosting.
- Diseñar alrededor de salida probabilística: un LLM es un ingrediente no determinista. La UI tuvo que manejar elegantemente respuestas parcialmente formadas, forzar el esquema en el servidor y nunca mostrar al usuario una receta insegura de cocinar.
- La latencia como problema de UX: la generación de receta toma unos segundos. Hacer streaming de la respuesta y diseñar un estado de carga que se sienta como anticipación en lugar de espera fue tan importante como la respuesta misma.
- Precisión dietética: "sin gluten" no es una elección estilística. El pipeline de restricciones valida los ingredientes contra datos estructurados de alérgenos antes de presentar una receta — un caso donde el rigor de ingeniería protege directamente al usuario.
- Print-first en un mundo web-first: conseguir que el PDF de salida se vea como la receta en pantalla, en distintos locales y con listas largas de ingredientes, tomó más iteración que el resto de la app junta.
Un producto entregado y en vivo en getcookbook.app que convierte una capacidad de IA en una herramienta diaria genuinamente útil — donde la investigación, la interfaz y la ingeniería refuerzan la misma apuesta: la mejor app de recetas es la que empieza desde ti, no desde un índice de búsqueda.
