Pixel Agents — 概要

Pixel Agents は、ターミナルで実行されている AI コーディングエージェントを、小さなオフィスで働くアニメーション化されたピクセルアートのキャラクターに変えるツールです。生のテキストがスクロールするのを見る代わりに、小さなキャラクターが机に向かって歩き、座り、ファイルを編集するときに入力し、検索するときに読み、あなたの入力を待っているときに視覚的なフラグを上げるのを見ることができます。

2 つの実行方法

同じコードベースが 2 つの形式で提供されます。

VS Code 拡張機能 — VS Code Marketplace または Open VSX からインストールできます。エージェントは VS Code ターミナルで起動します。キャラクターはターミナルの横のパネルに表示されます。
スタンドアロン CLI — プロジェクトフォルダーで npx pixel-agents を実行します。ローカルサーバーが起動し、ブラウザに同じオフィスが表示されます。tmux、リモートマシン、VS Code 以外のワークフローに便利です。

主な機能

1 エージェント、1 キャラクター — 各 Claude Code ターミナルには独自のアニメーションキャラクターが割り当てられます。
ライブアクティビティ追跡 — キャラクターは、エージェントが実際に行っているアクティビティ（書き込み、読み取り、コマンド実行）に基づいてアニメーションします。
オフィスレイアウトエディター — 組み込みエディターを使用して、床、壁、家具を備えたオフィスをデザインします。
吹き出し — エージェントが入力または許可を待っているときの視覚的なインジケーター。
サウンド通知 — エージェントがターンを終了するか、許可を要求したときのオプションのチャイム。
サブエージェントとチーム — 一時的なサブエージェントと永続的な Claude チームメイトが、チームの役割やライフサイクルの変更を含む個別のキャラクターとして表示されます。
永続的なレイアウト — オフィスのデザインは保存され、VS Code ウィンドウ間で共有されます。
共有レイアウトとアセット — レイアウトをインポート/エクスポートし、外部のキャラクター、ペット、家具パックをロードします。
エリア — オフィスに名前付きエリアをペイントし、ワークスペースフォルダーをそれらにマップすると、新しいエージェントはフォルダーにマップされたエリア内に配置されます。
多様なキャラクター — 6 つの組み込みキャラクター（JIK-A-4 の無料キャラクターパック、Metro City に基づく）。

要件

Claude Code CLI がインストールおよび構成されていること（現在サポートされている唯一の AI エージェントです。Codex、Gemini、Cursor などはロードマップにあります）。
VS Code 拡張機能: VS Code 1.105.0 以降。
スタンドアロン CLI: Node.js 20 以降。
Windows、Linux、または macOS。

仕組み（簡単に）

Pixel Agents は、2 つの経路を通じて Claude Code が何をしているかを検出します。

フックモード（デフォルト） — フックスクリプトが SessionStart、PreToolUse、PermissionRequest、Stop などの Claude イベントを受信し、認証されたイベントをアクティブな Pixel Agents サーバーに送信します。
ヒューリスティックモード（フォールバック） — フックが利用できない場合、~/.claude/projects/ の下にある Claude の JSONL セッショントランスクリプトをスキャンしてエージェントのステータスを推測します。

両方のソースは共有イベントモデルに正規化され、ランタイムは中央状態ストアを更新し、オフィスは Canvas 2D でパスファインディングとキャラクター状態機械を使用してレンダリングされます。

重要: Pixel Agents は Claude Code 自体を変更しません。そのフック構成は ~/.claude/ の下にあり、独自の永続データは ~/.pixel-agents/ の下にあります。

アーキテクチャ

コードベースは 4 つの主要部分に分かれています。

core/ — プロバイダー、アダプター、トランスポート、スキーマ、メッセージコントラクト（ランタイムの副作用なし）。
server/ — 共有 Fastify サーバー、エージェントランタイム、永続化、Claude プロバイダー、トランスクリプトスキャン、スタンドアロン CLI。
adapters/vscode/ — VS Code アダプター：ターミナル、永続化、webview ブリッジ。
webview-ui/ — React 19、Vite、Canvas 2D、および VS Code とブラウザの WebSocket クライアント向けのアダプター固有のトランスポート。

設計はエージェント非依存かつエディター非依存です。型付きの HookProvider インターフェースが統合境界を定義するため、新しい AI ツールを追加するにはコードの単一のサブディレクトリが必要です。

セキュリティに関する注意（README より）

スタンドアロン CLI は、?token= を含む URL を出力します。そのトークンはベアラー能力です。つまり、それを保持している人は、サーバーに到達可能な場所からフックのインストールを承認し、エージェントを起動できます。URL を機密情報として扱ってください。共有チャネルに貼り付けないでください。また、ブラウザの履歴に残ることに注意してください。デフォルトのバインドアドレスは 127.0.0.1 です。0.0.0.0 にバインドすると、UI と WebSocket がローカルネットワークに公開されるため、信頼できるネットワークでのみ行う必要があります。

ライセンス

MIT ライセンス。

pixel-agents-hq/pixel-agents