Alejandro Gonzalez
Empezar un producto se puede complicar muy rápido. Primero está la idea. Después hace falta un lugar para diseñarla, otro para construirla, una base de datos, autenticación, hosting, dominios, emails, analítica, pagos y probablemente otras tres cosas en las que nadie piensa el primer día.
Ya pasé por esto varias veces, tanto trabajando en productos para clientes como intentando construir los míos. Con el tiempo me di cuenta de que siempre terminaba usando una configuración muy parecida.
No digo que este sea el stack que necesita cualquier startup. Es simplemente el que probablemente usaría si mañana tuviera que empezar otro producto.
Figma y Figma Make
https://www.figma.com/es-es/make/
Normalmente empiezo acá. Figma sigue siendo el lugar donde pasa la mayor parte del trabajo de diseño real. Flujos, interfaces, componentes y todas esas pequeñas decisiones que de a poco convierten una idea en un producto.
Figma Make cambió una parte de ese proceso. Puedo describir una idea, generar algo interactivo y empezar a cuestionarlo mucho antes. Lo usé durante etapas de descubrimiento con clientes cuando necesitábamos entender una funcionalidad rápido. El resultado generado casi nunca termina siendo la interfaz final. Lo que me importa es tener algo concreto en pantalla, porque una versión clickeable hace que las conversaciones sean mucho más fáciles que discutir una idea que cada uno puede estar imaginando de forma distinta.
Next.js y Tailwind
https://nextjs.org/ y https://tailwindcss.com/
En algún momento el prototipo tiene que convertirse en algo real, y Next.js con Tailwind se volvió una combinación cómoda para mí en esa etapa.
Viniendo del diseño de producto, Tailwind se parece bastante a la forma en que ya pienso las interfaces. El espaciado, la tipografía, los estados y el comportamiento responsive quedan a la vista directamente en la implementación.
Next.js le da al producto la estructura alrededor de esa interfaz. No necesito entender cada parte del framework antes de empezar. Puedo construir una pieza, verla funcionando y expandirme de a poco desde ahí.
Claude Code
https://claude.com/product/claude-code
Probablemente sea la herramienta que más cambió mi relación con el desarrollo. Puedo trabajar directamente dentro de un código real, preguntar sobre algo que no entiendo, hacer cambios y revisar qué pasó. Eso achicó la distancia que antes sentía entre diseñar algo y construirlo.
Sigue habiendo una gran diferencia entre entender una interfaz y entender todo lo que pasa detrás de ella. Me choco con esa diferencia todo el tiempo. Claude Code me da una forma de seguir avanzando cuando llego a esas partes.
Supabase
Después aparece todo lo que la interfaz necesita recordar. Los usuarios necesitan cuentas. Los productos necesitan datos. Los pedidos necesitan un lugar donde existir. Las imágenes necesitan almacenamiento. Y empiezan a aparecer los permisos.
Supabase se volvió mi punto de partida habitual para esa parte. Lo usé en distintos proyectos personales para bases de datos, autenticación y almacenamiento, y lo que me gusta es que puedo ver lo que está pasando. Como diseñador que no empezó su carrera trabajando con bases de datos, poder abrir una tabla y literalmente ver la información hace que el backend se sienta mucho menos lejano.
Netlify
Tarde o temprano necesito mandarle un link a alguien. Puede ser un cliente, un amigo que me ayuda a probar algo o yo mismo abriendo el producto desde otro dispositivo. Netlify fue mi lugar habitual para eso. Conectar el repositorio, publicar el proyecto y de repente lo que estaba corriendo en local tiene una URL real.
Cuando un proyecto crece, empiezan a aparecer dominios, DNS y otras configuraciones. Algunas de esas partes las aprendí porque me tocó resolverlas. Pero para un producto temprano, lo que más me importa es pasar de local a online sin que el deploy se convierta en otro proyecto.
Después sumo lo que el producto necesita
Acá es donde el stack empieza a cambiar. Un producto puede necesitar Resend para emails. Otro puede necesitar Mercado Pago o Stripe para pagos. Otro puede necesitar analítica, mapas, WhatsApp o alguna API externa.
Cuando puedo, prefiero empezar sin tomar esas decisiones. Figma, Next.js, Tailwind, Claude Code, Supabase y Netlify ya cubren una cantidad sorprendente de lo que necesito para convertir una idea en algo que otra persona pueda abrir y usar. El resto aparece cuando el producto me da una razón.
Hace algunos años, construir algo por mi cuenta se sentía mucho más lejos de mi trabajo como diseñador. Hoy esa línea se siente mucho más fina. Sigo pasando gran parte de mi tiempo pensando en flujos, interfaces y personas. Solo que ahora tengo algunas herramientas más a mi alrededor que permiten que esas ideas salgan de Figma y se conviertan en algo real.
