Claude Desktop Setup

Set up the ASCII Motion MCP server with Claude Desktop for AI-powered ASCII art creation.

Prerequisites

Installation

Step 1: Install the MCP Server

bash
npm install -g ascii-motion-mcp

Verify installation:

bash
ascii-motion-mcp --help

Step 2: Configure Claude Desktop

Open your Claude Desktop configuration file:

macOS:

bash
code ~/Library/Application\ Support/Claude/claude_desktop_config.json

Windows:

text
%APPDATA%\Claude\claude_desktop_config.json

Add the ASCII Motion MCP server with live mode enabled:

json
{
  "mcpServers": {
    "ascii-motion": {
      "command": "ascii-motion-mcp",
      "args": ["--live", "--project-dir", "/Users/yourname/ascii-projects"]
    }
  }
}
Live Mode Required

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

  1. Go to ascii-motion.app
  2. Click the hamburger menu (☰) in the top-left corner
  3. Select MCP Connection
  4. Paste the auth token into the input field
  5. 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

  1. Check that your claude_desktop_config.json is valid JSON
  2. Ensure Node.js is installed and npx is in your PATH
  3. Try using the full path: "command": "/usr/local/bin/npx"
  4. Restart Claude Desktop completely (Cmd+Q on macOS)

"Project directory doesn't exist"

Create the directory first:

bash
mkdir -p /Users/yourname/ascii-projects

Connection 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