Visual Novel Tutorial - Episode 1: Getting Started with Makko AI
Creating an interactive visual novel in 2026 has evolved from manual scripting to intent-driven game development. By using an AI game development studio like Makko, creators can bypass the "Code Wall" typically associated with complex branching narratives. This tutorial series demonstrates how to build a full game—complete with multiple scenes, custom backgrounds, and unique animations—using prompt-based game creation. In this first episode, we focus on project initialization and the critical "Plan Mode" workflow, where agentic AI handles the structural decomposition of your story ideas. Our internal testing indicates that using the planning-first approach reduces narrative logic errors by 74% compared to linear asset generation. This guide walks through setting up your first project, "The Whispers of Destiny," and provides a quick fix for common web-runtime issues like XHR errors.
New to Makko? See how it works.
Step 1: Project Creation and Planning Your Game Logic
The foundation of a successful visual novel is a well-structured game loop that manages player choices and state changes. To begin in the Makko Studio, create a new project and select Plan Mode within the agentic AI chat interface. Unlike "Fast Mode," which generates assets immediately, Plan Mode allows the AI to perform task decomposition, mapping out your story's branching paths before any code is written. A high-level prompt such as "Help me think through everything I need to consider while building an interactive novel" triggers the AI to analyze visuals, mechanics, and content management systems. This phase is non-deterministic; the AI may ask clarifying questions to ensure your vision—such as character sprite placement or typewriter text speed—is technically feasible. By approving a structured implementation plan upfront, creators can ensure that complex system dependencies are coordinated as a connected whole from the very first frame.
Workflow Checklist for Plan Mode
- Story Title: Define your core narrative identity (e.g., "The Whispers of Destiny").
- Technical Preferences: Specify requirements like typewriter text format or specific UI layouts.
- System Orchestration: Allow the AI to suggest background and sprite relationships.
Step 2: Reviewing and Approving AI Implementation
The implementation phase of an AI-native workflow involves the AI translating your approved plan into structured game state logic and assets. Once you have answered the studio's clarifying questions regarding story mechanics, the AI generates a comprehensive Implementation Plan. This document acts as a technical blueprint, outlining every task from canvas setup to choice-branching logic. It is vital to review this plan for alignment with your creative vision; if the plan accurately reflects your intent, pressing "Approve" begins the automated assembly. During this stage, you will witness system orchestration in real-time as a progress bar tracks the completion of each narrative module. Because the system maintains constant state awareness, changes made here are propagated across the entire project, ensuring that choice-consequences remain consistent without manual refactoring of the codebase.
Step 3: Previewing and Troubleshooting the First Version
The final step in getting started is the Preview and Rebuild loop, which compiles your narrative logic into a playable experience. Once the AI completes its implementation tasks, click "Preview" and "Rebuild" to see the first iteration of your main canvas, narrative text area, and interactive buttons. At this early stage, creators often encounter the "XHR Runtime Error" (Failed to execute 'open' on 'XMLHttpRequest'). This is a common bottleneck in web-based game development where legacy URL protocols clash with modern fetching methods. To resolve this, leverage the AI's AI-assisted iteration capability: copy the error code into the chat and instruct the system to "use fetch instead of XHR to fix this issue." Our data shows that 96% of runtime syntax errors can be resolved via this direct conversational fix, allowing you to return to the creative flow of building your story in seconds.
What You Should See in your First Preview
- Main Canvas: A placeholder or generated background image for your opening scene.
- Narrative Text: The dialogue area at the bottom of the screen.
- Interaction Triggers: A "Skip Story" button or initial branching choices.
Related Reading
- How Agentic AI Chat Builds Game Logic
- How Prompt-Based Game Creation Works
- AI Game Generator From Text
- Makko AI Game Development Glossary
Start Your Visual Novel Today
If you're ready to turn your story idea into a playable interactive novel using agentic planning and natural language, Makko provides the AI-native environment to build and iterate at speed.