← Back to Arcade

The Technical Manual

Arcade Workshop & AI Companion

Master the art of rapid prototyping. The Arcade Workshop is a professional-grade sandbox where natural language meets real-time execution. Use the local AI Companion to build, debug, and publish applications instantly.

System Architecture

Understanding how the AI interacts with your system is key to mastering the workflow.

Local LLM Bridge

The companion connects to a local AI server (running Llama 3 or Qwen) on your PC. This ensures your code and data remain private and secure while providing low-latency intelligence.

Desktop Controller

The "Desktop Bridge" (Node.js) allows the AI to execute PowerShell commands, control Spotify/YouTube, and perform file-system operations safely within the workshop sandbox.

Secure Sandbox

Workshop games run in isolated environments. The AI uses a [FILE_EDIT] protocol to patch your code without the risk of breaking unrelated files or system configurations.

Advanced Slash Commands

Commands are the fastest way to communicate intent. Each command triggers a specialized AI agent optimized for that specific task.

/edit Surgical

The primary tool for incremental development. Use this to describe a feature or change you want in the currently open file. The AI will look for the most relevant lines and replace them with updated code.

Example: "/edit add a scoring system that gives 10 points for every blue circle collected"
/fix Autonomous

Triggers an "Audit & Repair" cycle. The AI analyzes your entire file for syntax errors, logical bugs, or performance bottlenecks and attempts to apply a patch automatically.

Example: "/fix my character is getting stuck in the walls on the left side"
/publish Sync

Deploys your project to the Signal Share Cloud. It automatically bundles your HTML, CSS, and JS files, assigns a unique ID, and makes your game playable in the global Library.

Example: "/publish I'm done with the Space Shooter v1.0"
/clear

Wipes the AI's "short-term memory" for the current session. Use this if the AI becomes confused or if you want to switch to a completely different task without previous context interference.

Prototyping Masterclass

How to go from an idea to a playable game in under 5 minutes:

1
Define the Boilerplate

Ask the AI for a basic template: "Create a simple HTML5 canvas game with a player that moves with WASD keys."

2
Iterative Styling

Apply the Signal Share aesthetic: "Use /edit to make the background a dark midnight gradient with a subtle starfield effect using particles."

3
Passive Telemetry

The system is smart. If you use a variable named score or kills, the global leaderboard system will automatically detect it. You don't need to write any backend code.

Game Logic Recipes

Quick formulas to prompt the AI for complex game mechanics:

Recipe: Screen Shake
"Add a function to shake the screen for 200ms whenever the player takes damage."
Recipe: Parallax Background
"Create 3 layers of stars that move at different speeds to create a 3D depth effect."
Recipe: State Management
"Implement a simple state machine with 'START', 'PLAYING', and 'GAMEOVER' states."
Recipe: Procedural Generation
"Write a function to generate random platforms that never overlap and are always reachable by the player jump height."

Media & System Control

The companion isn't just for coding—it's your PC's command center.

> "Pause Spotify and skip to the next track"
> "Check if the YouTube media bridge is connected"
> "What song is currently playing on my PC?"
> "Set system volume to 20%"

Pro Tip: You can use these commands while your game is running to change the vibe of your development session without leaving the Arcade.

Advanced Prompt Engineering

The quality of the AI's code depends on the precision of your request. Follow these rules for the best results:

1. Be Surgical

Instead of "Fix the movement", say "/edit increase the player movement speed by 50% and add a small bounce effect when hitting walls."

2. Define the Stack

If you want a specific style, tell the AI: "Use CSS variables for colors and ensure all animations use requestAnimationFrame for smoothness."

3. The "Chain of Thought" Trick

Ask the AI to think before coding: "First, explain how you will implement the inventory system, then use /edit to add the code."

4. Multi-File Workflow

The AI can see all files in your workshop. You can say: "Look at the styles in theme.css and update index.html to match that color scheme."

AI Optimization & Performance

The Arcade Companion is designed to run efficiently even on consumer-grade hardware by using advanced "VRAM Lifting" and "Surgical Retrieval" techniques.

VRAM Lifting

To preserve your GPU memory, the system uses an aggressive idle-unload protocol. If you haven't chatted for 15 minutes, the LLM is automatically flushed from VRAM. Additionally, vision-based attachments are compressed to 512px on the fly.

Surgical Retrieval

For large files, the system sends a lightweight "Skeleton Index" instead of the full code. The AI then uses the [FIND] protocol to retrieve only the specific blocks it needs, keeping the context window clean and fast.

Smart Editor Search
The AI is now a literal search engine for your code. You can use /find <text> or simply ask: "Where is the movement logic?" to have the companion automatically locate and highlight code in the editor.

🚀 View the AI Performance Deep-Dive →

Troubleshooting & FAQ

"Bridge Unreachable"

This means the web app cannot see the Node.js server on your PC. Ensure setup-companion.bat is running and your firewall allows connections on port 3000.

"LLM Connection Timeout"

If the AI takes more than 30 seconds to respond, it may be struggling with a very large file. Try breaking your code into smaller modules or use /clear to reset the context window.

"Surgical Edit Failed"

The AI tries to match your code exactly. If your file has non-standard indentation or hidden characters, the match might fail. Try using /fix to let the AI normalize the file first.

"Leaderboard Not Updating"

Ensure your score variable is global or stored in localStorage. The Signal Share Telemetry Bridge monitors localStorage changes for keys like 'score', 'points', or 'highScore'.