🖼️

Claude + PixelLab + Godotでドット絵のゲーム開発

に公開
AI
Godot
Model Context Protocol
Vibe Coding
zennfes2025ai
tech

はじめに

前回の記事ではAI活用して3Dモデルを試してみました。
今回の記事ではPixelLabを利用してゲーム内の絵をリッチにしていこうと思います。

前回の記事

MCPの概要や他のMCPの設定方法については前回の記事を確認してください。
https://zenn.dev/yurinchi/articles/879883dc91c3d6

PixelLabとは

PixelLab（ピクセルラボ）は、ピクセルアート生成に特化したAIツールです。主にゲーム開発者やピクセルアーティスト向けに、制作ワークフローを加速し、制御可能なAIツールを提供することを目的としています。

Claudeはコード生成に特化しており、CopilotやGeminiのように画像生成を行うことが出来ません。
Godotと連携してVibeコーディングしようとした時に画像の素材は自分で用意する必要があります。

ClaudeからCopilotやGeminiに連携する方法もありますが、その場合はCLIでの操作が必要となり無料で試すことが出来ません。
AIの生成ツールも多くなりそれぞれに課金をしていると出費がかさんできます。

PixelLabではClaudeから連携可能なリモートサーバ型のMCPサーバを無料枠で提供しているので、今回はそちらを利用して単純な図形ではないゲームを自然言語だけで作っていこうと思います。

PixelLabの登録

PixelLabを利用するには無料枠でもアカウント作成が必要なので、公式サイトからアカウントを作成します。

https://www.pixellab.ai/

アカウントを作成すると利用するためのAPIトークンが払い出されるのでメモしておきましょう。

Claude Desktopの設定

MCPサーバにpixellabを追加します。
MCPサーバの追加はclaude_desktop_config.jsonに設定を追加します。
公式が案内している設定ファイルだと現在のClaude DesktopではCommandが指定されていないためうまく動きません。そのため、npxでpixellabのmcpをインストールさせて動作させる必要があります。

npxだけだと内部のnodeコマンドのパスが解決できないため、環境変数でパスを設定しています。
ご自身の環境に合わせたPATHを指定してください。
PIXELLAB_SECRETにはPixelLabで発行されたAPIトークンを設定します。

{
  "mcpServers": {
    "pixellab": {
      "command": "npx",
      "args": ["pixellab-mcp"],
      "env": {
        "PATH": "nodeの実行ファイルのパス:/usr/local/bin:/opt/homebrew/bin:/usr/bin:/bin:/usr/sbin:/sbin",
        "PIXELLAB_SECRET": "あなたのトークン"
      }
    }
  }
}

最終的にはgodot-mcpと合わせて下記の内容を設定しています。


{
  "mcpServers": {
    "pixellab": {
      "command": "npx",
      "args": ["pixellab-mcp"],
      "env": {
        "PATH": "/Users/yurinchi/.nodebrew/current/bin:/usr/local/bin:/opt/homebrew/bin:/usr/bin:/bin:/usr/sbin:/sbin",
        "PIXELLAB_SECRET": "あなたのトークン"
      }
    },
    "godot-mcp": {
      "command": "node",
      "args": [
        "/Users/yurinchi/workspace/claude/MCP/godot-mcp/server/dist/index.js"
      ],
      "env": {
        "MCP_TRANSPORT": "stdio",
        "PATH": "/Users/yurinchi/.nodebrew/current/bin"
      }
    }
  }
}

設定ファイルが更新できたらClaud Desktopの再起動をしましょう

runningになっていることが確認できたら完了です。

Claude Desktopでゲーム開発の指示

準備が整ったらあとはいつものようにClaude Desktopでゲーム開発の指示を出していくだけです。
実践した内容は動画でも公開しているので良かった参考にしてください。

https://youtu.be/EzCnkCrmYIQ

Discussion