SORCERESS
Browse the wiki

Sorceress Code (AI Game Coding)

Updated July 4, 2026Open the tool

Open Sorceress Code

Sorceress Code is the AI game coding workspace in Sorceress Game Creation Suite. It brings together an AI coding agent, project explorer, code editor, live game preview, console capture, rollback checkpoints, cloud project storage, local project access, and publishing in one browser-based tool.

What it does

Sorceress Code lets you build and edit browser games by chatting with an AI coding assistant. You can ask it to create a complete game, add mechanics, fix bugs, refactor code, update UI, debug runtime errors, or explain how an existing project works.

The workspace is designed for web game projects using HTML, CSS, JavaScript, TypeScript, and related browser technologies. For smooth previewing, new games should use an index.html entry point. The AI is guided to create modular projects by default, separating HTML, CSS, and JavaScript into smaller focused files where appropriate.

Sorceress Code supports two project styles:

  • Cloud projects — stored online and usable directly in the browser.
  • Local projects — files on your computer, accessed through the Sorceress local server.

Workspace overview

The interface has three main areas:

  • Agent panel — chat with the AI assistant, switch chat sessions, attach images, use voice input, choose an AI model, view context usage, and configure API keys in the Setup tab.
  • Main editor/preview area — switch between the manual code editor and the live game preview.
  • Explorer panel — choose Local or Cloud mode, select projects, browse files, create/upload/rename/delete files and folders, push a local project to cloud, and manage cloud projects.

On smaller screens, use the mobile toolbar to open the Agent or Explorer panel.

Requirements

To use the AI coding agent, you need:

  1. A Sorceress account and to be signed in.
  2. A selected project:
    • A cloud project, or
    • A local project folder with the local server connected.
  3. At least one AI API key configured in the Setup tab.

You can still use non-agent workspace features such as browsing, editing, previewing, and managing project files depending on the current project mode and connection state.

Setting up AI models

Open the Setup tab in the Agent panel to add API keys. Keys are stored locally in your browser and are used to enable the matching models in the model selector.

Model options visible in the current UI include:

  • Claude Opus 4.6 — recommended in the UI as the strongest model for agents and coding.
  • DeepSeek Reasoner — advanced reasoning model.
  • GPT-5 Nano — budget-friendly model.
  • GPT-5.2 Codex — OpenAI coding-focused model.
  • Kimi K2.5 (NVIDIA) — multimodal agentic model with a free trial label in the UI.

The Setup tab groups keys by provider and shows whether each key is active. It also includes Get API Key links for each provider.

After you add a key, the matching model or models become available in the selector at the bottom of the chat input. If your currently selected model does not have a configured key and another model is available, Sorceress Code automatically switches to the first available model.

API keys are stored locally in your browser. They are not saved in your Sorceress account preferences.

Choosing local or cloud projects

The Explorer panel has a Local / Cloud toggle.

Local projects

Use Local when you want Sorceress Code to work with files on your computer.

  1. Make sure the Sorceress local server is running.
  2. Confirm the Local Server card shows Local Server Connected.
  3. Click the folder button to browse for a project folder, or click the displayed folder/path area to edit the path manually.
  4. Sorceress Code loads the file tree for that project.
  5. The preview serves the selected project through the local server.

Local projects support file browsing, editing, uploading, deleting, folder creation, previewing, and AI-assisted file changes. They also allow the agent to perform local command-based workflows when the local server supports them.

If the local server is offline, the Explorer shows a server offline state and a link to configure the server from Settings.

Cloud projects

Use Cloud when you want a browser-first workflow with projects stored online.

Cloud project actions visible in the Explorer include:

  • Create a new cloud project.
  • Select an existing cloud project.
  • Rename a cloud project.
  • Delete a cloud project.
  • Download a cloud project as a ZIP.
  • Upload files into the project.
  • Create files and folders.
  • Push the current local project to a new cloud project.

Cloud projects support file operations and live preview in the browser. Command execution is not available for cloud projects.

Pushing a local project to cloud

When you are in Local mode with a selected project, the cloud button in the Local Server card opens Push to Cloud.

  1. Click the cloud button beside the local project folder.
  2. Enter a cloud project name.
  3. Click Create & Upload.
  4. Sorceress Code creates a cloud project, uploads the local files, switches to Cloud mode, and selects the new cloud project.

This is useful when you start locally and later want a browser-accessible version of the project.

Using the AI coding agent

A typical AI workflow looks like this:

  1. Sign in.
  2. Select or create a project in the Explorer.
  3. Add an API key in Setup if you have not already.
  4. Return to the Agent tab.
  5. Choose a model from the selector near the chat input.
  6. Type your request.
  7. Press Enter or click the send button.

Example prompts:

  • “Create a simple game of Pong.”
  • “Create a Tetris game with score, next piece preview, and keyboard controls.”
  • “Add keyboard and touch controls.”
  • “Fix the collision bug in player movement.”
  • “Make the game mobile friendly.”
  • “Add a start menu, score counter, and game over screen.”
  • “Read the project and explain how movement works before changing anything.”
  • “I’m getting these errors: …”

While the agent works, the status bar shows whether it is thinking, using tools, writing, completed, or in an error state. You can see elapsed time, progress, and detailed activity inside the chat stream.

The agent activity view can show:

  • Thinking blocks and brief planning text.
  • File reads, writes, edits, searches, and other project actions.
  • Live code-writing previews while files are being generated or edited.
  • Success or error status for each action.
  • A final response or summary when the task completes.

Use Stop or press Esc to cancel a running request.

Chat features

Multiple chat sessions

The chat dropdown near the input lets you manage separate conversations for the current project.

You can:

  • Start a New Chat.
  • Switch between saved chats.
  • Rename chats.
  • Delete chats.

Chats are scoped to the selected project. A local project and a cloud project each keep their own chat history and memories.

Images

Use the image button to attach one or more images to your message. You can also paste images directly into the chat input with your clipboard.

Attached images are useful for visual references such as:

  • UI mockups.
  • Character or sprite references.
  • Error screenshots.
  • Layout examples.

You can remove pending images before sending. Sent image attachments appear in the chat message.

Voice input

If your browser supports speech recognition, the microphone button appears beside the input controls.

  1. Click the microphone button.
  2. Speak your prompt.
  3. Click stop, or let recognition end.
  4. Review or edit the transcribed text.
  5. Send the message.

If microphone permission is denied, allow microphone access in your browser settings and try again.

Continue after interruptions

Sorceress Code is designed to continue long-running coding tasks. If a connection is interrupted, the workspace may reconnect automatically and ask the agent to continue. If automatic retries are exhausted, a Continue button appears above the input.

Click Continue to resume the task and ask the agent to finish any remaining files.

Code editor

Switch to Code mode to edit files manually.

To edit a file:

  1. Select a file in the Explorer, or click its edit action.
  2. The file opens in the editor.
  3. Make your changes.
  4. Click Save when the unsaved-change indicator appears.

The editor supports common game and web project file types, including JavaScript, TypeScript, HTML, CSS, JSON, Markdown, Python, Rust, Go, Lua, XML, YAML, TOML, shell scripts, batch files, PowerShell files, and plain text.

Editor features include:

  • Syntax highlighting for supported file types.
  • Line numbers.
  • Folding.
  • Word wrap.
  • Bracket pair colorization.
  • Minimap.
  • Smooth scrolling.
  • Automatic layout resizing.

If the agent is actively writing the file you currently have open, the editor shows a Writing code… overlay. When the agent finishes, Sorceress Code reloads modified open files where possible so the editor reflects the final saved content.

Live preview

Switch to Preview mode to run the current project in an embedded browser frame.

Preview controls include:

  • Refresh — reloads the preview and clears captured console messages.
  • Stop / Run — stops the preview or starts it again.
  • Open in new tab — opens the current preview URL externally.
  • Copy preview URL — copies the current preview address.
  • Console — opens captured console messages and errors.
  • Publish — opens the publishing flow.

The preview defaults to index.html.

If a project has files but no index.html, the preview shows guidance. If HTML files are found, it offers buttons to preview them. HTML files in the Explorer also show a preview/eye action so you can open a specific page in Preview mode.

If the project is empty, Preview shows a prompt encouraging you to start by asking the AI agent to create a game.

Console and error debugging

The preview captures console output and runtime errors from your game. Open the console panel with the bug icon in Preview mode.

From the console panel you can:

  • View recent captured messages.
  • See error, warning, and log styling.
  • Clear the console.
  • Copy messages to your clipboard.
  • Send only errors to the chat input.
  • Send the full console log to the chat input.

This makes debugging with the agent much easier. A common workflow is:

  1. Run the game in Preview.
  2. Trigger the bug.
  3. Open the console panel.
  4. Click Send Errors or Send All.
  5. Add a short instruction such as “Fix these runtime errors.”
  6. Send the message to the agent.

If a generic script error appears from an external script, the console panel notes that browser developer tools may show more detail.

File explorer actions

The Explorer lets you manage project files directly.

Common actions include:

  • Select a file to load it into the editor.
  • Double-click folders to expand or collapse them.
  • Use quick actions to edit files.
  • Preview HTML files directly.
  • Create new files.
  • Create new folders.
  • Upload files.
  • Refresh the file tree.
  • Rename files.
  • Delete files.

File and folder creation opens a small inline dialog where you enter the name and confirm. For cloud projects, folders behave like virtual folders and are created when files are added inside them.

Multi-select and deletion

The Explorer supports multi-select:

  • Click to select an item.
  • Ctrl/Cmd-click to toggle individual items.
  • Shift-click to select a range.
  • Press Delete to delete selected items.

Deleting multiple items opens a confirmation dialog. If folders are selected, the dialog warns that folder contents will also be removed.

Uploading files

You can upload files in two ways:

  • Click the upload button in the Explorer toolbar.
  • Drag and drop files onto the Explorer.

During drag-and-drop, the Explorer shows a drop overlay. During upload, it shows progress with the current file count. After upload, the file tree refreshes.

Checkpoints and rollback

Before the AI agent starts a task, Sorceress Code attempts to create a checkpoint of supported project files. User messages that have an available checkpoint show a Restore button when hovered.

To roll back AI changes:

  1. Hover over the user message that started the change.
  2. Click Restore.
  3. Confirm the restore.
  4. Sorceress Code restores the backed-up files.
  5. The file tree and preview refresh.

A system message appears after restore showing how many files were restored.

Checkpoints are intended as a safety net for AI-assisted changes, especially large feature requests or experiments.

Publishing

Click Publish in Preview mode to publish your game through the Sorceress publishing flow. The publish dialog uses your current project and game name.

For cloud projects, publishing uses the selected cloud project. For local projects, publishing uses the selected local project path.

In embedded WizardGenie contexts, publishing may open the games page in a new tab with project information prefilled.

Context indicator

The circular indicator near the chat controls shows current context usage for the active chat. Click it to open the token usage popup.

The popup shows:

  • Current context window usage.
  • Percentage used.
  • Maximum context size for the current session.

As conversations get longer, context grows. If the agent needs to continue after a long task or interruption, use the Continue button when it appears.

Tips for best results

  • Start with a clear goal: “Create a top-down zombie survival game with WASD movement, mouse aiming, waves, and a shop.”
  • For larger games, ask for a specific scope first, then iterate.
  • Keep index.html as the main entry point so Preview works immediately.
  • Use the console panel to send exact errors to the agent.
  • Ask the agent to read and explain an existing project before making risky changes.
  • Prefer focused follow-up requests after a large game is generated.
  • Use cloud projects for a browser-only workflow.
  • Use local projects when you need local filesystem access or command-oriented workflows.
  • If an edit fails, ask the agent to re-read the file and retry the targeted change.
  • Use checkpoints before experimenting with big changes, and restore if the result is not what you wanted.

Troubleshooting

“API Key Required”

Add a key in the Setup tab for the provider used by your selected model. After adding the key, return to the Agent tab and try again.

The model I want is not in the selector

Only models with a configured API key appear in the selector. Add the matching key in Setup. If another model is available and the selected model is not, Sorceress Code may automatically switch to an available model.

“Please select a local project folder”

You are in Local mode without a project path. Use the folder button in the Local Server card to browse for a folder, or edit the project path manually.

“Please select a cloud project”

You are in Cloud mode without a selected project. Choose an existing cloud project or create a new one in the Cloud Projects section.

Local server offline

Local projects require the Sorceress local server. Confirm the server is running and that the Local Server card shows connected. You can also open Settings from the Explorer to check the local server URL.

Preview shows an empty or missing page

Make sure the project has an index.html, or preview another HTML file using the preview prompt or the eye icon in the Explorer.

Console shows “Script error” without details

This may come from an external script or cross-origin browser limitation. Open your browser’s developer tools for more detail, then send any useful errors back to the agent.

The agent stopped before finishing

If Sorceress Code detects an interruption, it may reconnect automatically. If a Continue button appears, click it. You can also send “continue” and ask the agent to finish the remaining files.

A file edit failed

The agent may have tried to edit text that no longer matches the file. Ask it to re-read the file and retry the change with the exact current content.

Cloud project command execution unavailable

This is expected. Cloud projects support file operations and previewing, but not terminal command execution. Use a local project if your workflow needs commands.

I accidentally accepted bad AI changes

Use the Restore button on the user message that started the change, if a checkpoint is available.