La historia detrás de las pantallas
Cómo diseñé una app de nutrición que me ayuda a ganar peso, no a perderlo
En pocas palabras
01El problema
Las apps me hacían trabajar a mí
Todas las apps que probé me obligaban a rebuscar en catálogos de alimentos y adivinar qué versión era la mía, sobre todo con platos de varios ingredientes.
02Lo que hice
Una app que registra por mí
Así nació Marea: describo una comida o escaneo su código de barras y la IA calcula la nutrición. Yo la diseñé y Claude Code la construyó.
03El resultado
+4,5 kg
recuperados tras hacerme pescetariano, en tiempo récord y con el coach indicándome qué comer.
Resultados con datos
1 semana
del primer mensaje a una app que funciona
13.700
líneas de código, ninguna escrita por mí
A diario
la sigo usando para mantener mis hábitos
La historia completa
Saltar a la app ↓Duración
1 semana
Equipo
- Diseño y producto yo
- Ingeniería Claude
¿Por qué hacerla yo mismo?
Este año me hice pescetariano y perdí unos 4,5 kilos que no quería perder. Ganar peso me cuesta, así que necesitaba controlar mis macros para ganar músculo y sumar lo que quemaba entrenando a lo que me quedaba por comer.
MyFitnessPal y apps parecidas convertían registrar comidas en rellenar formularios. Buscas salmón y aparecen decenas de versiones entre las que elegir, la de Costco o la de Trader Joe’s. Quería que la IA hiciera ese trabajo: describir la comida o escanear el código de barras, y tener los números.
Había otro motivo. Trabajo en diseño para banca, un sector que ha tardado en adoptar la IA, mientras amigos en fintech construyen con ella cada día. Quería aprenderla de primera mano y mantenerme al día.
Así que construí la mía y la llamé Marea, como la del mar.
Cómo la construí sin escribir código
- 1
Empezar por el objetivo
Le conté a Claude qué quería construir y por qué. Me llevó a Claude Code y me marcó los pasos.
- 2
Dividirlo en pasos pequeños
La configuración implicaba comandos en la Terminal, claves de API y muchos errores. Pedir un paso pequeño cada vez fue lo que me sacó adelante.
- 3
Iterar como en una revisión de diseño
Probaba cada función en cuanto estaba lista y seguía puliendo los flujos y el aspecto hasta que sentí la app como mía.
- 4
No tocar nunca el código
Yo describía, revisaba y corregía el rumbo. Claude Code escribió las 13.700 líneas.
Decisiones que tomé por el camino
Precisión antes que espectacularidad
Registrar con una foto queda vistoso, pero una foto de arroz no sabe si se cocinó con aceite. La opción de foto sigue ahí, pero yo uso la descripción o el código de barras.
Una aplicación web, no la App Store
Marea es solo para mí, así que en lugar de pagar por publicarla, la convertí en una aplicación web que tengo en la pantalla de inicio con las mismas funciones.
Gratis antes que de pago
Claude me sugirió un servicio de nutrición de pago. Pedí una alternativa gratuita, así que Marea funciona con datos nutricionales gratuitos y sin suscripción.
Los entrenamientos cambian el objetivo
Las calorías que quemo se suman al presupuesto del día, así que siempre sé cuánto me queda por comer.
Qué hace Marea
Resumen
Lo que he comido, quemado y me queda. Toco un macro para ver qué alimentos lo forman y veo qué días de la semana cumplí mi objetivo.
Registro
Desayuno, comida, cena y snacks. Describo una comida por voz o texto, escaneo un código de barras, reutilizo comidas y recetas guardadas o añado rápido lo que como a menudo.
Cuerpo
Agua, entrenamientos, peso y medidas mensuales.
Coach
Mis objetivos y el físico que busco, una revisión a mitad del día, un resumen al final y un chat para cualquier duda de nutrición. Tiene instrucciones de ser brutalmente honesto y usar siempre mis números reales.
Hecha con
Expo y React Native para la app · Supabase para el acceso y la sincronización · Google Gemini para las descripciones de comidas y el coach · USDA y Open Food Facts para los datos nutricionales · Cloudflare para el alojamiento y la conexión con la IA
Lo que aprendí por el camino
Un producto real muestra lo que las pantallas esconden
Usar una app que funciona sacó a la luz carencias que ninguna maqueta habría mostrado: cómo pasas de un paso al siguiente y qué ocurre después de introducir algo.
Pasos pequeños antes que grandes peticiones
Cuando la configuración me superaba, ir tarea a tarea convirtió los errores en avances.
Decirlo de otra forma
Cuando Claude no me entendía, reformular solía arreglarlo, aunque algunos callejones sin salida costaron tiempo y tokens.
Lo pequeño suma
Una ensalada no es una comida para mí, y los snacks en los que nunca pensaba sumaban muchas calorías que no necesitaba. Ahora como en función del peso que quiero alcanzar.
Saber no es lo mismo que ver
Soy entrenador personal certificado e hice un curso de nutrición, pero ver mis propios números cada día es lo que hizo que la lógica por fin encajara.
La IA también tiene sitio en el diseño bancario
Me enseñó lo rápido que podrían avanzar los equipos de banca con IA, y llevo esa forma de pensar a mi trabajo en banca.
Siguiente proyecto
