agent-arcade

# Agent Arcade

**Visualize your Claude Code agents as pixel art characters in a virtual office.**

Each Claude Code terminal becomes an animated character that walks around a pixel art office, sits at a desk, and visually reflects what the agent is doing: typing when writing code, reading when searching files, walking when switching tasks.

Built for teams using Claude Code who want a fun, at-a-glance view of what their agents are up to.

## Features

- **One agent, one character**: every active Claude Code session gets its own animated pixel art character
- **Live activity tracking**: characters animate based on real-time transcript parsing (typing, reading, thinking, idle)
- **Sub-agent visualization**: when an agent spawns sub-agents via the Task tool, child characters appear linked to their parent with dashed connection lines
- **Spawn agents from the office**: click "+ Agent" to open a new Claude Code terminal, optionally with a task prompt
- **Click to inspect**: click any character to see model, branch, task summary, elapsed time, and sub-agent info
- **Wave goodbye**: when an agent finishes, its character waves, walks to the door, and fades out
- **6 diverse characters**: Metro City pixel art sprites with full 4-directional walk, typing, and reading animations
- **Dark pixel art aesthetic**: sharp corners, hard shadows, monospace fonts: the way pixel art should look

## Requirements

- VS Code or Cursor 1.85.0+
- [Claude Code CLI](https://docs.anthropic.com/en/docs/claude-code) installed and configured

## Installation

### From VSIX (recommended for teams)

```bash
# Clone and build
git clone https://github.com/mshadmanrahman/agent-arcade.git
cd agent-arcade
npm install
npm run compile

# Package
npx vsce package --no-dependencies

# Install in VS Code / Cursor
code --install-extension agent-arcade-0.1.0.vsix
# or
cursor --install-extension agent-arcade-0.1.0.vsix
```

### From source (development)

```bash
git clone https://github.com/mshadmanrahman/agent