Característica Detalles
Nombre Cami
Tipo Agente de IA para diseño UI/UX
Empresa Fideval
Producto destino Investo (app móvil de fondos de inversión)
Objetivo Generar, clonar y modificar pantallas pixel-perfect en Figma a partir de instrucciones en español
Usuarios Equipo interno de producto, diseño y marketing de Fideval
Tiempo de construcción Una sesión de trabajo intensa (~10 horas)
Frontend Next.js 16 (App Router), React 19, TypeScript, Tailwind CSS 4
Backend API Routes de Next.js (serverless)
Base de datos Supabase (PostgreSQL gestionado)
Storage Supabase Storage (imágenes y archivos de referencia)
LLM Claude Sonnet 4.6
Gateway de IA OpenRouter (con prompt caching y búsqueda web)
Hosting Vercel (deploy automático desde GitHub)
Control de versiones Git + GitHub (repositorio privado)
Plugin de Figma JavaScript vanilla + HTML + Figma Plugin API
Lectura de Figma Figma REST API v1
Costo mensual estimado ~$28-34 USD (Figma + OpenRouter + uso variable)

Construyendo a Cami

Cómo pasé de una necesidad de negocio a un agente de IA que genera pantallas pixel-perfect en Figma, en una sola sesión de trabajo.

Parte I: El problema que quería resolver

Llevo meses frustrado con la misma escena. Abro Figma, selecciono un frame que ya diseñé, lo duplico, cambio un texto, cambio un color, y tardo diez minutos en algo que debería tomar uno. Multiplica eso por las decenas de variaciones que necesito para validar flujos con stakeholders, para probar copies con el equipo legal, para iterar sobre el mismo componente en veinte estados diferentes. Es trabajo que no aporta, pero que alguien tiene que hacer.

Soy Product Leader en Fideval. Lideramos Investo, una app móvil de fondos de inversión con más de veinte mil usuarios en Ecuador, y nos estamos preparando para expandirnos a Estados Unidos y España. El equipo de producto es pequeño y el roadmap es enorme. Cada día que paso haciendo trabajo mecánico es un día que no paso pensando en estrategia, shaping de pitches, o conversando con usuarios.

El diseño es especialmente costoso. Investo tiene un Design System vivo: componentes con variantes, variables de color ligadas a tokens, una guía de copies estricta (no decimos "tasas", decimos "rendimiento"; no decimos "rescate", decimos "retiro"), tipografía Outfit en cinco pesos distintos, y reglas de auto-layout que respetan Material Design 3. Cada pantalla nueva tiene que respetar todo eso. Y cuando quiero iterar sobre una pantalla existente para probar algo, terminan las dos horas antes de que haya movido el primer pixel.

Necesitaba algo que entendiera Investo tan bien como yo, que hablara español, y que ejecutara en Figma sin que yo tuviera que abrir Figma.