Ask Kiro — De vibe coding a software real

Misión 1 · Vibe Coding

Crea la app con un solo prompt

Un prompt y tienes un juego andando. Así arranca el vibe coding, con el agente Default.

Describe lo que quieres construir…

aDefault bAuto cAutopilot

aAgente. Default para chat libre; Spec, Quick Spec, Bug Fix y Plan para planificar.
bModelo. Auto elige por ti.
cAutopilot. Kiro trabaja de punta a punta.

Abre una sesión nueva y escribe directo en "Let's build".

El selector de abajo dice Default y Autopilot está activado.
Pega el prompt:

Default
Crea un juego tipo runner: el fantasma de Kiro corre, esquiva obstáculos saltando con la barra espaciadora y acumula puntaje. HTML, CSS y JS.

Kiro crea el juego y lo puedes abrir en el browser.

Quieres aprobar cada edición antes de que Kiro la aplique. ¿Qué cambias?

Más detalles

Modelo: Auto es el router de Kiro y la base de créditos (1x). Modelos como Claude Sonnet (1.3x) u Opus (2x) consumen más.
Checkpoints: cada prompt crea uno. Elige "Restore" en el chat para volver atrás el código y el contexto.
Aun en Autopilot, Kiro te pide confirmar cuando crea agentes, hooks o powers.

Si no ves el juego en el browser

Instala la extensión Live Server (Cmd+Shift+X → "Live Server"), click derecho en index.html → "Open with Live Server".
O abre el archivo directo en el browser con Cmd+O.

Guía del presentador

"Un prompt. Treinta segundos. Tenemos un juego. Pero... ¿qué pasa cuando otro dev toca este código?"

Es probable que Kiro cree carpetas, tests, package.json, etc. Déjalo — eso es justamente el problema que M2 (steering) viene a resolver. Si alguien pregunta, decir: "Exacto, eso es vibe coding sin reglas."

Mostrar la barra del chat (está ilustrada en la misión): el selector de agentes (Default, Spec, Quick Spec, Bug Fix, Plan), el de modelos (Auto por defecto) y Autopilot. Hoy arrancamos con Default.

Para ver la app: Live Server (extensión) o abrir index.html directo en el browser (Cmd+O / Ctrl+O).

Pregunta a la audiencia: "¿Quiénes ya conocen Kiro? ¿Quiénes usan otra herramienta tipo Cursor?"

~3 min

Misión 2 · Steering

Haz que Kiro siga TUS reglas

Sin reglas, cada prompt produce código distinto. El steering son reglas que Kiro lee en cada interacción.

Sin steering

src/
tests/
package.json
game.test.js
index.html sin JSDoc

Con steering

index.html
style.css
game.js con JSDoc y try/catch

Pega tus convenciones:

Default

Crea un steering file con las convenciones de nuestro proyecto:
- Proyecto simple: máximo 3 archivos (html, css, js). No crear carpetas src/, tests/, ni package.json
- No crear unit tests ni archivos de configuración
- Mensajes de error en español
- camelCase para variables y funciones
- Comentarios JSDoc en todas las funciones
- try/catch en todo
- Separar html, css y js en archivos distintos
- Color principal #9147ff y #c59eff
- Tipografía Roboto

Aparece .kiro/steering/ con un archivo de reglas.

Pide el refactor:

Default
Si no lo hiciste automáticamente, refactoriza el juego siguiendo las convenciones. Hazme un resumen de los cambios.

El juego queda en 3 archivos, con JSDoc y try/catch.

Quieres que una regla aplique solo a archivos CSS. ¿Qué modo de steering usas?

Más detalles

Modos: always (por defecto), fileMatch, auto (cuando tu pedido coincide con su descripción) y manual (con #nombre en el chat).
Kiro también lee AGENTS.md automáticamente.
También puedes crear steering desde el panel Steering → +.

Si Kiro no sigue las reglas

Revisa que el archivo esté en .kiro/steering/ y que su frontmatter diga inclusion: always.

Guía del presentador

"No le repetí las reglas. Las leyó solo. Para siempre, para todo el equipo."

Mostrar que el steering aparece en .kiro/steering/ y en el panel lateral. Destacar el contraste con M1: "¿Recuerdan las carpetas, los tests, el package.json? Ahora el steering dice 'máximo 3 archivos, sin tests'. Kiro lo reorganiza solo."

Pregunta: "¿Qué convenciones pondrían ustedes? ¿Arquitectura? ¿Seguridad? ¿Patrones de diseño?"

~5 min

Misión 3 · Specs

Planifica antes de codear

El vibe coding es rápido pero impredecible. Un spec escribe el plan antes que el código.

.kiro/specs/vidas-y-dificultad/requirements.md

# Requirements

## 1. Vidas

User story: Como jugador, quiero 3 vidas, para no perder al primer choque.

Acceptance criteria

WHEN la partida empieza THE SYSTEM SHALL mostrar 3 vidas
WHEN el fantasma choca con un obstáculo THE SYSTEM SHALL restar 1 vida
WHEN las vidas llegan a 0 THE SYSTEM SHALL mostrar game over

Qué debe hacer el juego, en criterios EARS que se pueden testear.

.kiro/specs/vidas-y-dificultad/tasks.md

# Tasks

1. Agregar estado de vidas al juego
- 1.1 Iniciar con lives = 3
- 1.2 Dibujar las vidas en pantalla
2. Restar una vida al chocar
3. Subir la velocidad cada 100 puntos
4. Guardar el high score en localStorage
5. Pantalla de game over con reiniciar

Run all Tasks

Pasos con checkbox. Run all Tasks los ejecuta en orden.

Abajo en el chat, cambia el agente a Quick Spec.

¿Bug? Bug Fix ¿Feature clara? Quick Spec ¿Ambigua o crítica? Spec ¿Sin documentos? Plan

El selector dice Quick Spec.

Pega el prompt y responde sus preguntas.

Quick Spec

Agrega un sistema de vidas y dificultad progresiva al juego. El jugador empieza con 3 vidas, pierde una al chocar, y la velocidad aumenta cada 100 puntos. Guardar el high score en localStorage. Mostrar pantalla de game over con opción de reiniciar.

Aparecen requirements.md, design.md y tasks.md en .kiro/specs/.

En tasks.md, haz clic en Run all Tasks.

Las tareas se marcan y el juego tiene vidas, high score y game over.

Tu feature es clara y la quieres rápido. ¿Qué agente usas?

Más detalles

Spec pausa para que apruebes cada documento. Elige Requirements-First si sabes el comportamiento o Design-First si ya tienes la arquitectura.
Bug Fix genera bugfix.md (comportamiento actual, esperado y el que no debe cambiar) y el análisis de la causa en design.md.
También puedes crear specs desde el panel Specs → +. kiro.dev/docs/specs

Si al spec le falta algo

¿Faltó algo? Edita requirements.md y en tasks.md usa Sync Files: crea las tareas que faltan.

Guía del presentador

"No es un prompt que espero que funcione. Es un plan escrito que puedo revisar antes de que exista una línea de código."

Usar el árbol de decisión: esta feature es clara, por eso Quick Spec (mucho más rápido que el Spec estándar, que pausa para aprobar cada fase). Abrir los 3 documentos: requirements con criterios EARS, design con arquitectura, tasks con checkboxes.

Los .md se pueden editar a mano o pidiéndolo en el chat; después, Sync Files en tasks.md actualiza las tareas.

Pregunta: "¿Cuántas líneas de código nueva hemos escrito? Cero. Estamos refinando."

~10 min (con el agente Spec y sus aprobaciones, 15-20)

Misión 4 · Hooks

El IDE que vigila por ti

Un hook es una regla automática: cuando pasa algo, Kiro actúa sin que se lo pidas.

Kiro edita ejemplo.jsun cambio del agente

HookFile Save · archivos .js

Kiro avisa"sumar() no tiene JSDoc"

Otros eventos: File Create · Prompt Submit · Agent Stop · Session Start · Pre Tool Use

Panel Agent Hooks → + → "Ask Kiro to create a hook", y pega:

Crear hook
Cuando el agente cree o modifique un archivo JavaScript, revisa si hay errores o funciones sin documentación JSDoc y avísame en el chat.

Un hook nuevo en el panel, con evento File Save.
Pruébalo: pide un archivo y después un cambio.

Default
Crea un archivo ejemplo.js con una función sumar() sin JSDoc. Después agrégale una función restar(), también sin JSDoc.

Cuando Kiro guarda el cambio, avisa en el chat que falta JSDoc.

Quieres buscar secretos cada vez que el agente termina. ¿Qué evento usas?

Más detalles

Los eventos de archivo (File Save, File Create, File Delete) solo responden a cambios que hace el agente: guardar a mano en el editor no los dispara.
Otros eventos: Prompt Submit, Agent Stop, Session Start, Pre/Post Tool Use y Pre/Post Task Execution.
Pre Tool Use sirve para frenar una acción antes de que ocurra, por ejemplo un comando peligroso. kiro.dev/docs/hooks

Si el hook no se dispara

En el panel Agent Hooks, revisa que el hook esté habilitado (icono del ojo).
Confirma que el evento sea File Save y que el patrón cubra los archivos .js.
Recuerda: tiene que ser un cambio del agente. Si editaste a mano, pídele a Kiro que haga el cambio.

Guía del presentador

"No corrí ningún comando. El IDE reaccionó solo."

Pedirle a Kiro en el chat que cree ejemplo.js y después lo modifique, y mostrar cómo se dispara el hook cuando el agente guarda el cambio. Aclarar que los eventos de archivo solo los disparan cambios del agente, no un guardado manual. Repasar los eventos: File Save, File Create, File Delete, Prompt Submit, Agent Stop, Session Start, Pre/Post Tool Use y Pre/Post Task Execution. No hay evento de git commit.

Pregunta: "¿Qué hooks les serían útiles? ¿Buscar secretos cuando el agente termina (Agent Stop)? ¿Bloquear comandos peligrosos antes de que se ejecuten (Pre Tool Use)? ¿Revisar que el README esté actualizado?"

~5 min

Misión 5 · Agents

Tu senior dev personal

Un custom agent es un especialista: tiene sus propias instrucciones y solo las herramientas que le das.

	Default	revisor
Leer archivos
Editar archivos
Usar la terminal
Criterio propio

Crea el agente:

Default
Crea el archivo .kiro/agents/revisor.md para un custom agent llamado "revisor": un senior developer estricto que solo puede leer archivos (tools: ["read"]). Solo aprueba código con manejo de errores explícito y funciones documentadas con JSDoc.

Kiro te pide confirmar y aparece .kiro/agents/revisor.md.
Úsalo:

Default
Usa el agente revisor para revisar el código JavaScript del juego y dime si lo aprobarías para producción.

Responde APROBADO o RECHAZADO con motivos, sin tocar archivos.

¿Qué puede definir un custom agent que el steering no?

Más detalles

También puedes elegirlo en el selector de agentes, abajo en el chat donde dice "Default".
Kiro puede lanzar varios agentes como subagentes en paralelo (seguridad, UI, arquitectura) con una sola instrucción.
El frontmatter define name, description, tools y permissions; el cuerpo es su system prompt.

Si el agente no aparece

Los agentes del workspace solo se cargan si el workspace es de confianza.
Revisa que el archivo sea .kiro/agents/revisor.md con frontmatter válido.

Guía del presentador

"Tiene el criterio de tu equipo y solo las herramientas que necesita. No es una IA genérica, es TU senior dev."

Mostrar .kiro/agents/revisor.md: el frontmatter define name, description, tools y permissions; el cuerpo es su system prompt. Diferencia clave: el steering influye en cómo piensa Kiro; un agente además controla qué herramientas puede usar.

Pregunta: "¿Qué agentes crearían? ¿Seguridad? ¿Arquitectura? ¿Un agente que revise contra la documentación de una API interna?"

~5 min

Misión 6 · Web Search

Busca sin salir del IDE

Necesitas un dato actual y no quieres abrir cinco pestañas. Kiro busca en internet desde el chat.

web_search

Para un buen game feel: gravedad más fuerte al caer, coyote time de ~100 ms y un buffer de salto…

developer.mozilla.orgweb.devgamedeveloper.com

Pregunta y pide que busque:

Default
¿Cuáles son las mejores prácticas para hacer un juego runner en el browser con buen game feel? Busca en internet.

La respuesta trae enlaces a sus fuentes.

¿Cuándo conviene pedirle a Kiro que busque en internet?

Más detalles

Kiro usa sus herramientas integradas web_search y web_fetch (para leer una página).
Puedes ser intencional: "busca en internet" o "investiga en la documentación oficial".

Guía del presentador

"No abrí ninguna pestaña. El dato llegó al chat."

Mostrar que la respuesta cita fuentes: Kiro usó su herramienta integrada web_search (y web_fetch para leer páginas). Útil para documentación, buenas prácticas y datos que el modelo no tiene en su entrenamiento.

~2 min

Misión 7 · Workflows

Arma un equipo de agentes

Un workflow es un equipo de agentes con un plan. Cada paso corre en su propia sesión, con contexto limpio.

Investigaweb search Implementasigue el steering Revisortu agente de la M5 Listo

Activa Workflows en Workspace Configuration → Workflows y abre una sesión nueva.

Arriba del chat aparece el panel Workflows.

Pide el trabajo en equipo:

Default

Quiero agregar power-ups al juego (escudo e imán). Arma un workflow: un agente investiga en internet buenas prácticas de power-ups en juegos runner, otro los implementa siguiendo el steering, y el agente revisor revisa el resultado. Si el revisor rechaza, vuelve a implementar.

Kiro propone los pasos y los ejecuta. Puedes abrir cada paso en su pestaña.

Tienes que renombrar una variable. ¿Usas un workflow?

Más detalles

Las recetas reutilizables viven en .kiro/workflows/ (o ~/.kiro/workflows/) en JSON o YAML.
Kiro trae recetas de fábrica como investigate, feature-pipeline y publish-pr (pueden variar según tu cuenta y versión).
Workflows es nuevo (Kiro IDE 1.2, septiembre 2026) y viene apagado.

Si no aparece el panel Workflows

Actívalo también desde Settings con kiroAgent.workflows.enabled y abre una sesión nueva.
Si sigue sin aparecer, puede que aún no esté disponible para tu cuenta.

Guía del presentador

"No es un agente haciendo todo: es un equipo con un plan, y cada paso arranca con la cabeza limpia."

Mostrar el panel Workflows: seleccionar un paso para abrirlo en su pestaña y, si pasa, mostrar el loop cuando el revisor rechaza. Contar que es nuevo (Kiro IDE 1.2, septiembre 2026) y opcional. Une todo lo anterior: web search en la investigación, steering al implementar, el agente revisor al final.

Pregunta: "¿Qué proceso de su equipo podría ser un workflow? ¿Investigar un incidente? ¿Feature, tests y PR?"

~7 min

Misión 8 · Skills

Dale expertise a Kiro

El steering son reglas fijas. Una skill es conocimiento que Kiro carga solo cuando lo necesita.

SteeringSiempre presente"camelCase y JSDoc"

SkillBajo demanda"física de juegos 2D"

AgentCon sus herramientas"revisor de solo lectura"

Crea tu propia skill:

Default
Investiga en internet cómo se crean skills en Kiro. Luego crea una skill llamada "game-physics" que sepa sobre gravedad en juegos 2D, curvas de dificultad, hitboxes y game feel.

Aparece .kiro/skills/game-physics/SKILL.md.
Pruébala:

Default
El salto del personaje se siente flotante. ¿Cómo hago que se sienta más responsivo y satisfactorio?

Kiro usa la skill y sugiere gravedad variable, coyote time o input buffering.
Importa una skill de otros: panel Agent Steering & Skills → + → Import a skill y pega la URL de la carpeta.

Anthropic · frontend-design Dirección estética, tipografía y diseño que no se ve genérico.

URL de la skill
https://github.com/anthropics/skills/tree/main/skills/frontend-design

AWS · launch-with-aws Lleva una app web hecha con vibe coding a AWS, del análisis al deploy.

URL de la skill
https://github.com/aws/agent-toolkit-for-aws/tree/main/skills/core-skills/launch-with-aws

Default
Usa la skill frontend-design para rediseñar la pantalla de inicio del juego, respetando los colores y la tipografía del steering.

La pantalla de inicio del juego cambia de estilo.

¿Cuándo carga Kiro el contenido completo de una skill?

Más detalles

También puedes llamarla a mano con /game-physics.
Las skills siguen el estándar abierto Agent Skills: el mismo SKILL.md que usa Claude Code.
Las globales viven en ~/.kiro/skills/; las del workspace ganan si tienen el mismo nombre.

Si la skill no aparece

El name del frontmatter tiene que coincidir con el nombre de la carpeta.
Lee una skill antes de importarla: algunas traen scripts que Kiro puede ejecutar.
Si importaste global, búscala en ~/.kiro/skills/.

Guía del presentador

"Kiro supo cuándo necesitaba ese conocimiento. No se lo tuve que decir."

Mostrar .kiro/skills/game-physics/SKILL.md: frontmatter con name y description; Kiro solo carga la description al inicio y el resto cuando tu pedido coincide (también se puede llamar a mano con /game-physics). Diferencia: steering = convenciones siempre presentes (el qué), skills = conocimiento bajo demanda y portable (el cómo), agents = herramientas y permisos (el especialista).

Mostrar que la skill de Anthropic funciona tal cual: es el mismo formato SKILL.md que usa Claude Code.

Probar un salto en el juego para mostrar que ahora se siente mejor físicamente.

Pregunta: "¿Qué conocimiento de dominio tiene su negocio que podría ser una skill? ¿KPIs? ¿Modelos de datos? ¿APIs internas?"

~7 min

Misión 9 · MCP

Conecta con AWS en tiempo real

Un MCP conecta a Kiro con fuentes externas en tiempo real, como la documentación oficial de AWS.

Kiro pregunta"¿cómo hago deploy?"

Servidor MCPaws-documentation

Docs oficialesrespuesta con fuentes

Hay MCPs de GitHub · Atlassian · Figma · bases de datos · cerca de 100 de AWS

Instala el MCP con el botón Install Kiro en github.com/awslabs/mcp, o pídelo:

Default
Instala el MCP de AWS Documentation a nivel workspace en .kiro/settings/mcp.json, con la configuración oficial de awslabs.

Existe .kiro/settings/mcp.json con el servidor de AWS Documentation.
Pregúntale a la documentación:

Default
Busca en la documentación oficial de AWS cuál es la mejor forma de hacer deploy de esta app a hosting estático.

La respuesta cita docs.aws.amazon.com y compara opciones.

¿Dónde configuras un MCP para que lo use todo el equipo?

Más detalles y JSON manual

Si existen el de workspace y el global, gana el de workspace.

.kiro/settings/mcp.json

{
  "mcpServers": {
    "awslabs.aws-documentation-mcp-server": {
      "command": "uvx",
      "args": ["awslabs.aws-documentation-mcp-server@latest"],
      "env": {
        "FASTMCP_LOG_LEVEL": "ERROR",
        "AWS_DOCUMENTATION_PARTITION": "aws"
      },
      "disabled": false,
      "autoApprove": []
    }
  }
}

Si el servidor no arranca

Lo más común es que falte uvx: pídele a Kiro que instale uv.
En Windows usa la configuración alternativa del README del servidor.

Guía del presentador

"Un clic en GitHub. Documentación oficial, leída en tiempo real, aplicada a tu proyecto."

Abrir github.com/awslabs/mcp y mostrar el botón "Install Kiro". Recomendar AWS Documentation como primer MCP. Mostrar la alternativa manual con el JSON para quienes prefieran copiar.

Si el servidor no arranca, lo más común es que falte uvx: pedirle a Kiro que instale uv.

Pregunta: "¿Los MCP son solo de AWS? No. Hay de Atlassian, GitHub, bases de datos... Son conectores universales."

~5 min

Misión 10 · Powers

Empaqueta todo en un clic

Un Power empaqueta skills, MCPs y steering para que otro dev lo instale en un clic.

Viaja en el Power

steering (en dev.kiro/)
skills/
mcp.json

Se comparte por el repo

hooks/
agents/
workflows/

Panel de Powers (fantasma con rayo) → busca Power Builder → Install.

Power Builder aparece instalado.

Pide el paquete:

Default

Quiero crear un Power que empaquete lo que hicimos: el steering de convenciones, la skill de game physics y el MCP de AWS Documentation. Usa el Power Builder con el formato Agent Plugins.

Una carpeta con plugin.json, skills/, mcp.json y dev.kiro/.

Un compañero quiere tu hook de revisión. ¿Cómo se lo pasas?

Más detalles

Otro dev lo instala desde Powers → Add Custom Power → Import power from GitHub (o desde una carpeta).
Kiro activa cada Power solo cuando tu pedido coincide con sus keywords.
Ejemplo para probar: kiro-game-dev-toolkit (formato anterior POWER.md, sigue funcionando).

Si Kiro se detiene a pedir confirmación

Kiro IDE 1.2 pide confirmar antes de escribir archivos de powers, hooks o agentes, aun en Autopilot.

Guía del presentador

"Con MCP conectaste la IA a una herramienta. Con Powers le diste el manual completo."

Instalar el Power Builder primero. Mostrar la estructura que genera: plugin.json (nombre, versión, keywords que lo activan), skills/, mcp.json y dev.kiro/ con el steering. Los Powers viejos con POWER.md siguen funcionando. Explicar que esto se sube a un repo y cualquiera lo instala.

Si hay tiempo: crear una carpeta nueva, instalar el power desde URL y mostrar cómo la experiencia cambia completamente.

Pregunta: "¿Qué powers crearían para su equipo? ¿Uno de seguridad? ¿De arquitectura? ¿De onboarding para devs nuevos?"

~5 min

Ask KiroDe vibe coding a software real

Crea la app con un solo prompt

Haz que Kiro siga TUS reglas

Planifica antes de codear

El IDE que vigila por ti

Tu senior dev personal

Busca sin salir del IDE

Arma un equipo de agentes

Dale expertise a Kiro

Conecta con AWS en tiempo real

Empaqueta todo en un clic

Misión cumplida

Ayuda

Cómo funciona

¿Reiniciar progreso?