> For the complete documentation index, see [llms.txt](https://docs.decentraland.org/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.decentraland.org/creator/content-creator-es/escenas-sdk7/primeros-pasos/vibe-coding.md). # Vibe Coding con IA Crea escenas de Decentraland describiendo lo que quieres. Un asistente de IA maneja por ti el código de SDK7, la arquitectura ECS y la estructura del proyecto. Tanto si eres un creador principiante como un desarrollador experimentado, el "vibe coding" asistido por IA te permite pasar de una idea a una escena en ejecución en minutos en lugar de horas. {% hint style="info" %} **💡 Consejo**: No necesitas saber TypeScript para empezar. Los asistentes de IA pueden generar código funcional de escenas a partir de descripciones en lenguaje natural. {% endhint %} ## ¿Qué es el Vibe Coding? Vibe coding significa construir escenas teniendo una conversación con un asistente de IA en lugar de escribir a mano cada línea de código. Tú describes lo que quieres — "una taberna medieval con puertas clicables y música de fondo" — y la IA escribe código de SDK7 correcto y desplegable. Este enfoque funciona en cualquier nivel de habilidad: * **Principiantes y no desarrolladores** — Pasa de cero a una escena funcional sin escribir código manualmente. * **Desarrolladores con experiencia** — Omiten el boilerplate. Deja que la IA maneje la sincronización multiplayer, la estructura de la UI y la configuración de despliegue mientras tú te centras en las decisiones creativas. * **Equipos y estudios** — Prototipa conceptos de escena rápidamente antes de comprometer recursos completos de desarrollo. ## Combina un editor de código con IA Usa un editor de código de IA de uso general como [Cursor](https://www.cursor.com/) o VS Code con GitHub Copilot o Claude AI. Decentraland proporciona una carpeta de contexto para que estas herramientas entiendan el SDK. 1. Abre Creator Hub y crea o abre una escena. 2. Haz clic en el botón **< > CODE** para abrir tu editor de código. 3. Usa el asistente de IA integrado del editor (el chat de Cursor, Copilot, etc.) para generar o modificar código. ## Instala Skills para cualquier agente de IA Las Skills son conjuntos de instrucciones listos para usar que enseñan a tu agente de IA cómo trabajar con el SDK de Decentraland. Cada skill cubre un tema específico, como crear escenas, añadir modelos 3D o configurar multiplayer, de modo que la IA ya conoce los patrones, APIs y restricciones correctos sin que tengas que explicárselos. Instalar skills significa menos errores y mejores resultados desde el primer prompt. ```bash # Elige qué skills de Decentraland instalar desde un selector interactivo npx skills add decentraland/sdk-skills # O instala todas las skills de Decentraland npx skills add decentraland/sdk-skills --all # O elige skills específicas npx skills add decentraland/sdk-skills --skill create-scene # Instalar globalmente (disponible en todos los proyectos) npx skills add decentraland/sdk-skills -g ``` Esto copia los archivos de skill en la configuración de tu agente para que conozca los patrones y restricciones de Decentraland. ## Actualización de Skills Con el tiempo se añaden nuevas skills y las existentes se mejoran. Para obtener las últimas versiones, vuelve a ejecutar el comando de instalación con `--all`: ```bash # Actualiza cada skill instalada y descarga cualquier nueva npx skills add decentraland/sdk-skills --all ``` Ejecutar `add` de nuevo vuelve a obtener el repositorio, así que actualiza las skills que ya tienes e instala las que se hayan añadido desde tu primera instalación. Si instalaste skills globalmente, añade `-g` también a este comando. {% hint style="warning" %} **📔 Nota**: No uses `npx skills update` para esto. Solo actualiza las skills que ya están en tu máquina, así que cualquier skill añadida al repositorio después de tu última instalación se omite en silencio. Usa siempre `npx skills add decentraland/sdk-skills --all` en su lugar. {% endhint %} ## Skills de IA disponibles Cuando instalas skills en tu agente, están disponibles las siguientes capacidades: | Skill | Qué hace | | ---------------------- | -------------------------------------------------------------------------------------- | | `sdk-scenes` | Punto de entrada con directrices para el agente e índice de todas las skills temáticas | | `create-scene` | Generar desde cero un nuevo proyecto de escena de SDK7 | | `migrate-sdk6-to-sdk7` | Portar una escena heredada de SDK6 a SDK7 | | `add-3d-models` | Añadir modelos 3D (`.glb`/`.gltf`) con posicionamiento, escalado y colliders | | `add-interactivity` | Eventos de puntero, triggers, raycasts | | `build-ui` | UI de pantalla 2D con React-ECS — HUDs, menús, diálogos | | `animations-tweens` | Animaciones de modelos GLTF con Animator, tweens de SDK | | `multiplayer-sync` | Multiplayer entre pares usando networking CRDT | | `authoritative-server` | Headless Multiplayer Server para escenas validadas por servidor (BETA) | | `audio-video` | Efectos de sonido, música, streaming de audio y reproductores de video | | `audio-analysis` | Datos en tiempo real de amplitud y frecuencia para escenas reactivas al audio | | `deploy-scene` | Desplegar escenas en Genesis City (basado en LAND) | | `deploy-worlds` | Desplegar escenas en Worlds (espacios 3D personales) | | `optimize-scene` | Optimización del rendimiento, límites de escena, mejores prácticas | | `camera-control` | Detección de modo de cámara, cámara cinematográfica, cámaras virtuales | | `composites` | Referencia del formato de archivo Composite para contenido estático de escena | | `lighting-environment` | Iluminación dinámica, sombras, skybox, niebla, ajustes de entorno | | `particle-system` | Efectos de partículas — fuego, humo, chispas, nieve, fuegos artificiales | | `npcs` | Personajes no jugadores — biblioteca del NPC Toolkit y enfoques manuales | | `player-avatar` | Posición del jugador, perfil, personalización del avatar, attachments | | `player-physics` | Fuerzas de física — impulsos, knockback, fuerzas continuas | | `nft-blockchain` | Visualización de NFT e interacciones con blockchain/crypto | | `advanced-rendering` | Billboard, TextShape, materiales PBR, materiales de video | | `advanced-input` | Polling de entrada a nivel de System y control del movimiento del jugador | | `scene-runtime` | APIs de runtime transversales — trabajo asíncrono, HTTP, mensajería | | `script-components` | Clases de script component para Creator Hub | | `game-design` | Patrones de diseño de juegos, límites de escena, presupuestos de rendimiento | | `unity-explorer-mcp` | Controla un Explorer en ejecución para probar y verificar una escena dentro del mundo | Nota: Algunas de estas skills implican obtener modelos 3D u otros assets de catálogos de assets gratuitos. El agente de IA siempre debe obtener confirmación del usuario antes de descargar cualquier asset nuevo a un proyecto de escena. ## Deja que la IA vea tu escena dentro del mundo Normalmente la IA escribe código y *tú* ejecutas la preview, la miras y reportas qué está mal. El cliente de escritorio de Decentraland puede cerrar ese ciclo: incluye un **MCP server** opcional que permite a un agente de IA ver y controlar directamente el Explorer en ejecución. El agente toma sus propias capturas de pantalla, lee la salida de consola de la escena, mueve al jugador, hace clic en objetos y comprueba si la escena realmente hace lo que se le pidió construir — luego corrige lo que encuentra y vuelve a mirar. Esto convierte el vibe coding de "describir, esperar, revisar" en un ciclo que el agente puede ejecutar casi por sí solo. {% hint style="info" %} **💡 Consejo**: Instala la skill `unity-explorer-mcp` antes de probar esto. Le enseña al agente todo el flujo de trabajo — cómo lanzar el cliente, cómo encuadrar capturas de pantalla útiles, cómo contrastar lo que ve con el estado real de la escena y cómo recuperarse cuando la escena deja de cargar. ```bash npx skills add decentraland/sdk-skills --skill unity-explorer-mcp ``` {% endhint %} ### Lo que necesitas * El **cliente de escritorio de Decentraland** instalado (el mismo que Creator Hub lanza para las previews). * Un agente de IA que pueda conectarse a MCP servers por HTTP — Claude Code, Cursor, Cline, VS Code con una extensión compatible con MCP, y otros. * Un SDK actualizado en tu escena: ejecuta `npm i @dcl/sdk@latest` si la bandera `--mcp` de abajo se rechaza como una opción desconocida. ### 1. Lanza la escena con el MCP server habilitado Desde la carpeta de tu escena: ```bash npm run start -- --mcp ``` Esto hace lo mismo que `npm run start` siempre hace — sirve tu escena en `http://127.0.0.1:8000` y la recarga automáticamente cada vez que guardas un archivo — y además lanza el cliente de escritorio con el MCP server escuchando en `http://127.0.0.1:8123/unity-explorer-mcp`. Inicia sesión cuando se abra el cliente. El agente solo puede empezar a trabajar una vez que hayas pasado la pantalla de inicio de sesión y el mundo haya cargado. ### 2. Conecta tu agente de IA al servidor En **Claude Code**, regístralo una vez: ```bash claude mcp add --transport http --scope user explorer http://127.0.0.1:8123/unity-explorer-mcp ``` En **cualquier otro cliente MCP**, añade el servidor de la forma en que lo documenta ese cliente, usando estos detalles: | Ajuste | Valor | | ------------- | ----------------------------------------------------------------------------------------------------------------- | | Transporte | Streamable HTTP (no stdio — no hay ningún comando que ejecutar, el servidor vive dentro del cliente en ejecución) | | URL | `http://127.0.0.1:8123/unity-explorer-mcp` | | Autenticación | Ninguna | | Nombre | `explorer` | Muchos clientes usan un archivo de configuración JSON para esto (`.cursor/mcp.json`, `mcp.json`, y similares — consulta la documentación de tu cliente para los nombres exactos de las claves): ```json { "mcpServers": { "explorer": { "type": "http", "url": "http://127.0.0.1:8123/unity-explorer-mcp" } } } ``` Reinicia o recarga tu cliente de IA después de registrar el servidor, para que detecte la conexión. Si el agente dice que las herramientas de Explorer no están disponibles, la causa habitual es que el cliente no estaba en ejecución cuando el agente se inició — vuelve a conectar el servidor (en Claude Code, ejecuta `/mcp`) con Explorer abierto. {% hint style="info" %} **¿Es esto seguro?** El servidor solo se ejecuta mientras lanzas el cliente con `--mcp`, solo acepta conexiones desde tu propia máquina (`127.0.0.1`), y rechaza solicitudes que provienen de páginas web. No se expone nada a Internet, y está completamente desactivado en un lanzamiento normal del cliente. {% endhint %} ### 3. Pide lo que quieres y deja que lo verifique Con el servidor conectado, pídele trabajo como lo harías normalmente — la diferencia es que ahora el agente puede comprobar sus propios resultados: > "Añade un cofre del tesoro en el centro del parcel que se abra al hacer clic, luego camina hasta él y haz clic para confirmar que la tapa se anima." > "El letrero de neón parece demasiado tenue. Toma una captura de pantalla, ajusta la intensidad emisiva y muéstrame un antes y después." > "Algo va mal con el ascensor. Sube a la plataforma, observa los logs y dime por qué no se mueve." Detrás de escena, el agente puede: * **Ver** — tomar capturas de pantalla, leer la `console.log` salida y los errores de la escena, comprobar si la escena cargó o se bloqueó, listar las entities de la escena e inspeccionar sus components, y leer la posición del jugador y de la cámara. * **Controlar** — mover y teletransportar al jugador, caminar en una dirección mediante colisiones reales, apuntar la cámara, colocar una cámara libre para una toma específica, cambiar de modos de cámara, hacer clic en objetos de la escena, enviar mensajes de chat y `/commands`, activar emotes y recargar la escena. * **Medir** — leer recuentos en vivo del contenido de la escena (triangles, entities, textures, materials y más) frente a los límites de Decentraland, clasificar qué modelos 3D contribuyen más a esa carga desde cualquier punto de vista y muestrear la tasa de fotogramas real que experimenta el jugador en cualquier lugar. ### Úsalo para optimizar tu escena Como el agente puede medir además de ver, puedes encargarle directamente trabajo de rendimiento. Puede comprobar tu escena frente a los [límites de la escena](/creator/content-creator-es/escenas-sdk7/optimizacion/scene-limitations.md), identificar qué modelos 3D son los más pesados, medir la tasa de fotogramas en lugares específicos y, lo más importante, volver a medir después de hacer cambios para demostrar que ayudaron: > "Comprueba si mi escena está dentro de los límites de contenido de Decentraland y dime qué presupuesto está más cerca del máximo." > "La escena se siente entrecortada cerca de la fuente. Ponte ahí, mide la tasa de fotogramas y dime qué modelos cuestan más desde ese punto." > "Optimiza la escena: encuentra qué está reduciendo la tasa de fotogramas, arréglalo y muéstrame mediciones antes y después." Para obtener mejores resultados, instala la skill `optimize-scene` junto con `unity-explorer-mcp`, para que el agente también conozca las mejores prácticas de optimización de Decentraland. Consulta [Optimización del Rendimiento](/creator/content-creator-es/escenas-sdk7/optimizacion/performance-optimization.md#optimize-with-ai) para saber más sobre este flujo de trabajo, incluido cómo combinarlo con el Blender MCP server para automatizar correcciones en los propios modelos 3D. ### Consejos * **Pide pruebas, no afirmaciones.** "Verificar con una captura de pantalla" o "confirmar en los logs" es lo que hace que este flujo de trabajo merezca la pena. Un buen agente contrasta ambas cosas: los píxeles pueden verse bien mientras el estado subyacente está roto, y viceversa. * **Las capturas de pantalla consumen tokens.** Cada captura de pantalla que el agente mira consume parte de su contexto. Si quieres un barrido visual largo — una animación a lo largo del tiempo, un recorrido por muchos lugares — pídele que capture fotogramas en archivos y que solo lea los que importan. La skill `unity-explorer-mcp` incluye un script que hace exactamente esto. * **Guarda una vez, no cinco veces seguidas.** Guardados rápidos y sucesivos pueden hacer que el cliente cargue un bundle a medio escribir y abandone la escena por completo, lo que requiere reiniciar el cliente para recuperarla. Pídele al agente que agrupe sus ediciones en un solo guardado. * **Mantén el cliente abierto.** Si lo cierras, la conexión se pierde y el agente se queda sin ojos. Volver a lanzarlo con el mismo comando lo trae de vuelta. * **Los teleports se comportan de forma diferente en el desarrollo local de escenas.** Moverse entre parcels con `/goto` está deshabilitado allí, así que el agente debería reposicionar al jugador dentro de la escena en lugar de teletransportarlo. ## Consejos para redactar prompts de forma efectiva Obtener los mejores resultados de la IA consiste en dar prompts claros y específicos. Aquí tienes algunos consejos: ### Sé específico sobre lo que quieres En lugar de: > "Haz que mi escena sea mejor" Prueba con: > "Añade una puerta en la posición (8, 0, 8) que se abra con una animación de rotación al hacer clic y reproduzca un efecto de sonido de chirrido" ### Referencia elementos existentes > "Haz que el botón rojo de la mesa active que el ascensor suba" ### Pide una cosa a la vez Divide las solicitudes complejas en pasos: 1. "Añade una UI de marcador en la esquina superior derecha" 2. "Añade un contador que aumente cuando el jugador haga clic en el objetivo" 3. "Muestra el valor del contador en el marcador" ### Itera y refina Después de cada cambio: 1. Previsualiza la escena (haz clic en **Preview** en Creator Hub, o `npm run start` en la línea de comandos) 2. Comprueba qué funciona y qué no 3. Dile a la IA qué ajustar: "Mueve el NPC 2 metros a la izquierda y haz que mire al jugador" ### Prompts de ejemplo Para ejecutarse sobre una copia nueva de [sdk7-scene-template](https://github.com/decentraland/sdk7-scene-template/). #### Ejemplo de prompt 1 ``` Quiero que elimines el código actual de la escena y hagas un pequeño juego de laberinto simple, en 1 parcel; las paredes pueden ser cubos y deben tener collision. El juego debe empezar cuando el jugador entre realmente en el laberinto por el punto A y terminar cuando salga por el punto B (la única salida del laberinto). Quiero que añadas 3 puertas diferentes en el laberinto, que tengan que interactuarse con el input de puntero para abrirlas y pasar. Debes verificar que el jugador realmente puede jugar y ganar ``` #### Ejemplo de prompt 2 ``` Quiero que elimines el código actual de la escena y construyas un juego de plataformas simple. Tienes que verificar que el juego se puede ganar antes de considerarlo terminado. ``` ## En qué puede ayudar la IA * Generar nuevas escenas a partir de una descripción * Añadir y posicionar modelos 3D * Escribir manejadores de clic e interactividad * Construir UI (HUDs, menús, diálogos) * Configurar la sincronización multiplayer * Configurar el Multiplayer Server para anti-cheat * Añadir audio, video y streaming * Crear animaciones y tweens * Optimizar el rendimiento de la escena * Preparar escenas para el despliegue * Depurar problemas en código existente * Probar y verificar visualmente una escena en un Explorer en ejecución (ver [Deja que la IA vea tu escena dentro del mundo](#let-the-ai-see-your-scene-in-world)) ## Limitaciones Aunque las herramientas de IA son potentes, ten esto en cuenta: * **Previsualiza siempre** — el código generado por IA puede no verse exactamente como esperas. Ejecuta una preview para verificarlo. * **Los límites de la escena siguen aplicando** — la IA no puede saltarse los [límites de la escena](/creator/content-creator-es/escenas-sdk7/optimizacion/scene-limitations.md) (cantidad de triangles, tamaños de archivo, límites de parcel). * **Lógica de juego compleja** — Para mecánicas de juego intrincadas, puede que necesites guiar a la IA paso a paso o refinar su salida manualmente. * **Modelos 3D personalizados** — La IA puede referenciar assets gratuitos existentes o cargar los modelos que le proporciones, pero no puede crear modelos 3D desde cero (a menos que uses al mismo tiempo otras herramientas como Blender official MCP server). ## Siguientes pasos * [Inicio rápido de SDK](/creator/content-creator-es/escenas-sdk7/primeros-pasos/sdk-101.md) — Aprende los fundamentos de SDK7 * [Combinar con código](/creator/content-creator-es/scene-editor/ampliar-con-codigo/overview.md) — Mezcla edición visual con código * [Multiplayer Server](/creator/content-creator-es/escenas-sdk7/networking/authoritative-servers.md) — multiplayer con autoridad del servidor * [Ejemplos de escenas](https://studios.decentraland.org/resources?sdk_version=SDK7) — Explora escenas de ejemplo para inspirarte * [Recursos útiles](/creator/content-creator-es/escenas-sdk7/primeros-pasos/useful-resources.md) — Más herramientas de IA, bibliotecas de assets y add-ons para acelerar tu flujo de trabajo --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.decentraland.org/creator/content-creator-es/escenas-sdk7/primeros-pasos/vibe-coding.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.