Claude Desktop Setup
Set up the ASCII Motion MCP server with Claude Desktop for AI-powered ASCII art creation.
Prerequisites
- Claude Desktop installed
- Node.js 18+ installed
Installation
Step 1: Install the MCP Server
npm install -g ascii-motion-mcpVerify installation:
ascii-motion-mcp --helpStep 2: Configure Claude Desktop
Open your Claude Desktop configuration file:
macOS:
code ~/Library/Application\ Support/Claude/claude_desktop_config.jsonWindows:
%APPDATA%\Claude\claude_desktop_config.json
Add the ASCII Motion MCP server with live mode enabled:
{
"mcpServers": {
"ascii-motion": {
"command": "ascii-motion-mcp",
"args": ["--live", "--project-dir", "/Users/yourname/ascii-projects"]
}
}
}The --live flag enables real-time sync with the ASCII Motion browser editor. Without it, the MCP tools have no visual output.
Step 3: Restart Claude Desktop
Completely quit and reopen Claude Desktop for the configuration to take effect.
Step 4: Verify Installation
Open a new conversation in Claude and ask:
"What ASCII Motion tools are available?"
Claude should list the available tools. If you see them, you're ready to go!
Connect the Browser
The MCP server works with the ASCII Motion browser editor for real-time visual feedback.
Step 1: Get the Auth Token
After restarting Claude Desktop, ask Claude:
"What is the MCP auth token?"
Claude will return a token like abc123def456.
Step 2: Open ASCII Motion
- Go to ascii-motion.app
- Click the hamburger menu (☰) in the top-left corner
- Select MCP Connection
- Paste the auth token into the input field
- Click Connect
You should see a green "Connected" status. Now every edit Claude makes appears instantly in the browser!
Example Prompts
Try these prompts to get started:
Create Art
"Create a 30x15 canvas and draw a simple house with a door and two windows using ASCII characters"
Import an Image
"Import the image at ~/Pictures/logo.png and convert it to ASCII art using block characters"
Animate
"Create an 8-frame animation of a bouncing ball"
Apply Effects
"Apply a digital rain effect with green characters falling downward"
Export
"Export the current animation as a GIF file called my-animation.gif"
CLI Export
"Export this as a React Ink component for my CLI application"
Troubleshooting
Claude doesn't see the tools
- Check that your
claude_desktop_config.jsonis valid JSON - Ensure Node.js is installed and
npxis in your PATH - Try using the full path:
"command": "/usr/local/bin/npx" - Restart Claude Desktop completely (Cmd+Q on macOS)
"Project directory doesn't exist"
Create the directory first:
mkdir -p /Users/yourname/ascii-projectsConnection issues with live mode
- Make sure port 9876 is not in use by another application
- Check that your firewall allows localhost connections
- Try specifying a different port:
--port 9877
Next Steps
- Example Prompts - More prompt ideas
- Tool Reference - Complete tool documentation
- Live Sync Guide - Advanced live mode options