> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://documentation.celestory.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# L'Aide à la Création & Le Vibe Coding avec l'IA

# 🤖 Tutoriel Détaillé : L'Aide à la Création & Le Vibe Coding avec l'IA
Celestory repense totalement la relation entre le concepteur logique et l'intelligence artificielle. Celle-ci n'est plus traitée comme une option décorative de fin de projet, mais comme un véritable co-pilote embarqué tout au long du processus, du design à l'expérience du joueur. 🚀
Cette synergie repose sur deux grands piliers : l'Aide à la création (Vibe Coding) pour le designer 👨‍🎨, et l'IA interactive (In-Game) pour l'utilisateur final 🎮.
---
## 1. ✨ Qu'est-ce que le "Vibe Coding" dans Celestory ?
Le "Vibe Coding" est une philosophie de conception moderne où le créateur "dirige" l'environnement de développement non plus en cherchant laborieusement des menus ou en écrivant une grammaire complexe, mais en s'exprimant naturellement, par l'intention (la vibe). 🌊
Dans Celestory Creator, cela se traduit par une suite d'outils interconnectés capables de transformer une simple intention (texte) en réalité structurelle ou visuelle instantanée.
### A. 🏗️ Génération structurelle (Workflows & Logique)
Grâce aux modèles de langage intégrés au cloud Celestory, plutôt que de placer vingt blocs à la main pour « créer un système de dialogue génératif lié à une base de données », l'IA peut construire et câbler les blocs fondamentaux pour vous. 🪄
- Les templates vivants : Vous gagnez des heures d'architecture, l'IA se chargeant de la plomberie technique (s'assurer que JSON sortant du LLM correspond bien à ce qui est attendu par votre base documentaire).
- L'IDE embarqué : pour les rares endroits nécessitant du code pur (manipulation complexe d'un objet JSON, CSS sur mesure, page HTML5), Celestory ouvre l'éditeur Monaco — celui de Visual Studio Code — directement dans la fenêtre d'édition du bloc : coloration syntaxique, numérotation des lignes, auto-fermeture des accolades. 💻
### B. 🎭 Prototypage et Maquettes (Dummy Data)
Créer une application sans contenu est difficile. Lors des phases de wireframes :
- Le créateur peut utiliser l'IA embarquée pour générer des jeux d'essais (Placeholder text & images) ultra-réalistes en quelques mots ("Génère moi 5 fiches personnages fantastiques au format JSON", ou "Génère 3 images d'arrière-plan de forêt peinte"). 🖼️
- Le module devient ainsi immédiatement jouable et testable à l'écran, bien avant que vos graphistes ou scénaristes finaux ne fournissent les assets définitifs.
---
## 2. 🎨 L'IA Embarquée pour le Créateur : Gérer ses Assets
La fenêtre **Génération IA** (`Cmd+Shift+G`) est l'atelier d'artiste du concepteur : quatre onglets — **Texte, Image, Vidéo, Audio** — et un historique de vos **Générations**. Sous le capot, le texte passe par **OpenRouter** (qui donne accès à de nombreux modèles : Mistral, OpenAI, Anthropic…) et les médias par **Fal**, réputé pour sa latence très faible. 🖌️
### ⚡ Génération Visuelle Rapide
- Finies les recherches interminables sur des banques d'images. Formulez une consigne textuelle (« Héros cyberpunk, néon, réaliste 8k ») et l'image arrive directement dans votre projet. 🏎️💨
🔺 Les générations consomment des **crédits IA** : la fenêtre affiche votre consommation du mois. 🔺 L'étoile ⭐ dans la liste des blocs n'indique pas spécifiquement une consommation IA : c'est un badge générique réservé aux offres Organisation, partagé avec des blocs non-IA (Requête HTTP, MCP, Caméra…).
- Cette souplesse garantit de maintenir le "flow" (l'état de concentration) du créateur, qui n'a pas à sortir du logiciel pour chercher la bonne pièce du puzzle. L'image finit synchronisée automatiquement dans le Google Cloud Storage du projet. ☁️
---
## 3. 🎮 L'IA In-Game : Expérience Dynamique pour l'Utilisateur Final
Au-delà de l'aide en coulisses pour le développeur nocode, l'IA devient un acteur majeur dans l'expérience que vivra votre utilisateur (joueur, collaborateur, apprenant). 🌟
### A. 💬 Les Blocs Requête IA (Texte et Générateurs)
Il existe des blocs natifs spécialisés (comme le Bloc Requête IA texte), dotés eux-mêmes de ports d'entrées et de sorties. Ces blocs transforment Celestory en un orchestrateur d'API LLM (Large Language Model) puissant.
- Scénario Dynamique : Au lieu d'écrire chaque embranchement d'une histoire (Blocs Choix), envoyez la réponse libre de l'utilisateur à un LLM avec des instructions cachées (le System Prompt : "Tu es un garde méfiant, tu dois décider si tu laisses passer le joueur selon son excuse."). Le LLM analyse, et Celestory oriente le Graphe en fonction de son accord ou refus. 🕵️‍♂️
- Formatage Structuré : Avec le soutien du No-Code, Celestory peut exiger d'un LLM qu'il réponde exclusivement avec du JSON. Ce JSON structure une donnée (ex: {humeur: "triste", degats_pris: 20}) qui vient ensuite impacter les variables mathématiques de l'application. 📊
### B. 🌅 Les Blocs d'Imagerie à la Volée (Génération In-Game)
L'outil ne s'arrête pas au texte. Des blocs de Génération Multimodale offrent une fonction fascinante : modifier le monde du jeu ou l'application pendant que l'utilisateur s'en sert. ✨
- Requête IA Image : un joueur décrit un sortilège fantaisiste ou l'apparence de sa créature. Le bloc intercepte le texte de l'utilisateur, l'envoie à l'IA d'image, et, 2 secondes plus tard, Celestory applique l'image générée en tant qu'avatar ou fond d'écran ! 🧙‍♂️
- Magie de l'Instantanéité : ce genre de requête s'effectue côté serveur, pour une sécurité totale des clés d'API et une latence minime, et révolutionne les interfaces web classiques en les rendant "réactives" à 100% à l'imaginaire du public. 🔮
---
## 4. 🤖 L'Assistant qui Construit le Graphe
Le « Vibe Coding » ne s'arrête pas à la génération de contenu : depuis l'onglet **Texte** de la fenêtre Génération IA, vous pouvez **demander à l'assistant de construire votre graphe**.
- Décrivez ce que vous voulez (« ajoute un dialogue d'accueil qui demande le prénom, puis deux choix »), et l'assistant crée les blocs, les relie, nomme les variables et pose les dialogues.
- **Les actions sont montrées, pas cachées** : chaque outil appelé s'affiche dans la conversation, et les blocs apparaissent sous vos yeux dans le canevas.
- Un bouton discret sous votre message permet de **revenir à l'état d'avant le tour**, si le résultat ne vous convient pas.
🔺 **Tous les modèles ne savent pas faire cela.** Si le modèle sélectionné ne gère pas les outils, un bandeau vous prévient : il répondra dans la conversation sans jamais toucher au graphe. Choisissez un modèle compatible pour que l'assistant construise réellement.
🔺 L'assistant travaille sur le projet **ouvert dans votre éditeur**. Pensez à sauvegarder (`Cmd+S`) ce qui compte avant de lancer un tour ambitieux.
---
## Conclusion : 🤝 L'Équipe Maker + Machine
Dans Celestory, l'intelligence artificielle n'est plus un appel d'API final optionnel : c'est le ciment qui accélère drastiquement la composition visuelle en début de projet (Vibe Coding), garantit un flux d'inspiration constant au Designer, et offre une rejouabilité ou une personnalisation littéralement infinie au consommateur final du module. 🚀