DES FICHIERS LOCAUX. DES ÉTAPES REPRODUCTIBLES.

Installez les outils.
Gardez la main.

Le site public présente le projet. Studio est une application locale distincte, dans laquelle vous pouvez modifier les ressources et les comportements. Commencez par Git, Node et le navigateur ; ajoutez les autres outils selon votre objectif.

1. Installer le nécessaire

Installez Git et Node 24, puis rouvrez le terminal. VS Code est recommandé. Pour le pont MCP, installez uv et Python 3.12. Pour créer de nouveaux rendus, installez Blender ; pour éditer le projet moteur, installez Cocos Dashboard puis Creator 3.8.8.

Git · Node.js · VS Code · uv · Blender · Cocos Creator

2. Ouvrir l’espace local

Exécutez ces commandes depuis le dossier choisi. Gardez le terminal actif et ouvrez http://127.0.0.1:4780. Pour arrêter le serveur, utilisez Ctrl+C. Sous PowerShell, npm.cmd évite les blocages des scripts .ps1.

git clone https://github.com/Adnen-Ben-Abdelaali/ai-games-studio.git
cd ai-games-studio
npm ci
npm run demo
npm start

3. Connecter Codex par MCP

Remplacez le chemin de l’exemple ci-dessous par votre chemin réel. Cette commande nécessite la CLI Codex. Sans elle, ajoutez uniquement l’entrée Studio de docs/mcp.example.toml à votre configuration existante. Reconnectez le client et gardez Studio actif. Le pont expose 12 outils ; Studio n’intègre pas lui-même une conversation Codex.

uv python install 3.12
codex mcp add ai-games-studio -- uv run --python 3.12 --with "mcp==1.30.0" python /absolute/path/to/ai-games-studio/tools/studio_mcp.py

4. Relier diagrammes, code et comportements

Les cartes, les six projections (états, activité, séquence, temps, classe, objet) et le littéral studioBehavior représentent le même modèle. Enregistrez les cartes ; utilisez Update diagram & code depuis une action, ou Apply code après une modification du littéral. Dans VS Code, le fichier doit ensuite être importé ou appliqué par Codex avec update_behavior_code. Une modification HTML ou Cocos arbitraire n’est pas automatiquement convertie en UML.

4. Relier diagrammes, code et comportements

5. Préparer les sprites dans Blender

Installez et activez le module MCP for Blender, puis son serveur local. Dans Studio, essayez la bouteille originale, glow-turn-glow, 24 images de 192 pixels à 8 images/s. Prepare with Blender crée une scène et produit des PNG transparents, un atlas et un aperçu. Vérifiez les droits d’un modèle tiers avant son usage et sa redistribution.

uvx mcp-for-blender==2.2.6 install-addon
codex mcp add blender -- uvx mcp-for-blender==2.2.6

6. Modifier et exporter dans Cocos

Importez examples/cocos-native dans Creator 3.8.8. Ouvrez assets/StudioGame.scene et attendez la fin des imports avant de vérifier les types dans VS Code. Prévisualisez, puis Project → Build → Web Mobile ou Web Desktop. Le squelette exporté par Studio est distinct de cet exemple natif. Testez les navigateurs et appareils ciblés.

7. Publier le site statique

Le build copie les pages EN/FR/AR, les images, le jeu et la vidéo avec ses pistes de sous-titres dans website/dist. Déployez tout son contenu sur le VPS, puis vérifiez HTTPS, les routes et la lecture vidéo. Ne publiez pas le serveur local Studio, .studio-data ou les ports MCP.

npm run build:site
npm run check:site

Lire la passation de déploiement ↗

Ouvrir le guide français complet ↗