Playbook
Prototype Kit

Paso 4: Ejecutar el prompt del prototipo

Abre tu extensión instalada de Gemini CLI o tu plugin de Claude Code y ejecuta su comando de prototipo documentado.

Con tus tres documentos listos, ya puedes dejar que el agente construya.

Abre tu agente instalado en la carpeta del proyecto

# macOS / Linux
cd ~/mi-prototipo
gemini
# Windows PowerShell
cd $HOME\mi-prototipo
gemini

Si instalaste el plugin verificado de Claude Code, ejecuta claude desde la misma carpeta.

Con Gemini CLI verás un prompt similar a este:

Gemini CLI v1.x.x — type /help for available commands
> 

Ejecuta el comando de tu agente

Gemini CLI

/prototype-from-docs

Claude Code

/prototype-kit:prototype-from-docs

El agente leerá tus tres documentos y luego te hará una serie de preguntas de aclaración. Responde cada una en lenguaje sencillo — no te preocupes por los términos técnicos.

Preguntas de aclaración que hará el agente

El agente hace estas cinco preguntas — en este orden — antes de tocar código. Ten tus respuestas listas.

1. Persona principal — ¿quién es la persona que usa este producto?

Respuesta fuerte: "Estudiante universitaria en México, 18-25 años, que usa la app desde el celular entre clases." — nombra quién, dónde y cuándo.

Respuesta débil: "Todos." — sin persona, UI genérica.

2. Tres pantallas must-have — ¿cuáles tres vistas deben existir para que el prototipo sea demostrable?

Respuesta fuerte: "Dashboard, Registrar gasto, Resumen semanal." — tres pantallas concretas por las que el jurado puede navegar.

Respuesta débil: "Todas las de screens.md." — obliga al agente a escoger y probablemente escoge mal.

3. Vibe de marca — elige dos adjetivos que describan el tono visual.

Respuesta fuerte: "Minimalista y autoritario." o "Cálido y juguetón." o "Oscuro y técnico."

Respuesta débil: "Moderno y limpio." — esas palabras no significan nada; todas las UIs default dicen lo mismo.

4. ¿Datos reales o mock?

Respuesta fuerte: "Mock — montos en pesos realistas, historial de transacciones falso." — hace la demo autocontenida.

Respuesta débil: "Reales si se puede." — a menos que ya tengas una API, esto solo atrasa al agente.

5. ¿Assets existentes?

Respuesta fuerte: "Logo en ./assets/logo.svg, color primario #1A237E, tipografía Inter." o "Aún no tengo assets, inventa."

Respuesta débil: Saltar la pregunta — el agente se inventa algo y puede que no te guste.

Qué sucede después de responder

Los comandos verificados usan reglas distintas de ubicación:

  • Gemini CLI: esta guía ya contiene docs/, así que la extensión de Gemini escribe el proyecto React + Vite en ~/mi-prototipo/prototype/, incluidos prototype/src/routes/ y prototype/README.md.
  • Claude Code: como esta guía no inicia con un package.json ajeno, el plugin de Claude escribe el proyecto en ~/mi-prototipo/, incluidos ~/mi-prototipo/src/routes/ y un README.md en la raíz. Si detecta otro paquete, usa prototype/.

Usa la ruta exacta que reporte tu agente; el Paso 5 incluye comandos para las dos rutas verificadas.

Si eres un agente de IA leyendo esta página, el siguiente paso es /es/docs/prototype-kit/05-open-prototype.

On this page