UI Explorer MCP Server

UI Explorer MCP Server

画面上のUI要素を探索して操作するためのツールを提供するMCP サーバーです。

機能

• UI階層の探索：画面上のすべてのUI要素をスキャンして分析します
• ハイライト付きUIスクリーンショット：境界線と階層を使ってUI要素を視覚化します
• マウスクリックの操作：座標に基づいてUI要素をクリックします
• 特定領域の探索：左上、中央など、画面の一部に焦点を当てます
• 🎬 マクロ記録：MCPとは独立して、またはMCP経由でUIワークフローを記録して再生します

🚀 クイックスタート：スタンドアロンのマクロ記録

新機能！ MCP サーバーを起動せずにUIワークフローを記録できるようになりました。

# Record a workflow
python record_macro.py --name "Login Workflow"

# Play it back
python play_macro.py --file "macros/Login Workflow.json"

Windowsユーザーはバッチファイルを使用できます：

record_macro.bat "My Workflow"
play_macro.bat "macros/My Workflow.json"

👉 2分間のチュートリアルはQUICK_START.mdをご覧ください 👉 詳細なドキュメントはMACRO_TOOLS.mdをご覧ください

記録される内容

• ✅ 正確な座標付きのマウスクリック
• ✅ スマートテキストバッファリングによるキーボード入力
• ✅ 確実な再生のためのUIコンテキスト
• ✅ 確認用のスクリーンショット
• ✅ 自然な再生のためのタイミング情報

記録の操作

• F9：記録の開始／停止
• F10：一時停止／再開
• ESC：緊急停止

インストール方法

オプション1：pipを使用（推奨）

パッケージをグローバル環境または仮想環境にインストールします。

pip install mcp-ui-explorer

オプション2：git cloneを使用

1. リポジトリをクローンします。

git clone https://github.com/modularflow/mcp-ui-explorer
cd mcp-ui-explorer

2. パッケージをインストールします。

   • 開発モードでpipを使用する場合：

   pip install -e .
   

   • または、uvを使用する場合（開発に推奨）：

   uv venv
   source .venv/bin/activate  # On Windows: .venv\Scripts\activate
   uv pip install -e .
   

MCP サーバーの設定

パッケージをインストールした後、UI Explorerサーバーを使用するようにMCPクライアントを設定する必要があります。

CursorのRoo向け

次のJSONを、以下のMCP サーバー設定に追加します。 C:\Users\<user_name>\AppData\Roaming\Cursor\User\globalStorage\rooveterinaryinc.roo-cline\settings\mcp_settings.json

{
  "mcpServers": {
    "ui-explorer": {
      "command": "uvx",
      "args": [
        "mcp-ui-explorer"
      ]
    }
  }
}

Claude Desktop App向け

次の場所にサーバー設定を追加します。 C:\Users\<user_name>\AppData\Roaming\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "ui-explorer": {
      "command": "uvx",
      "args": [
        "mcp-ui-explorer"
      ]
    }
  }
}

uvxで直接使用する場合

パッケージをインストール済みの場合（グローバル環境または仮想環境）、追加の設定を行わずにuvxを直接使ってサーバーを実行できます。

uvx mcp-ui-explorer

MCPツール

UI Explorerは、UIの自動化と探索に使える複数のMCPツールを提供します。これらのツールは、MCP サーバーインターフェースから利用できます。

使い方ガイド

1. UI構造を探索する

explore_uiツールを使って、UI要素の階層全体を取得します。

パラメーター：

• region：分析する画面領域（"screen"、"top"、"bottom"、"left"、"right"、"center"など）
• depth：分析する階層の最大深度（デフォルト：5）
• min_size：含める要素の最小サイズ（デフォルト：5px）
• focus_window：前景のウィンドウのみを分析します（デフォルト：False）
• visible_only：画面上で表示されている要素のみを含めます（デフォルト：True）
• control_type：検索するコントロールの種類（デフォルト："Button"）
• text：テキスト内容で要素を絞り込みます（任意）

2. UI要素をハイライトしたスクリーンショットを撮る

screenshot_uiツールを使って、UI要素を視覚化します。

パラメーター：

• region：分析する画面領域
• highlight_levels：階層レベルごとに異なる色を使用します（デフォルト：True）
• output_prefix：出力ファイルのプレフィックス（デフォルト："ui_hierarchy"）

3. 画面座標を指定してクリックする

click_ui_elementツールを使って、指定した座標をクリックします。

パラメーター：

• x：クリックするX座標（必須）
• y：クリックするY座標（必須）
• wait_time：クリック前に待機する秒数（デフォルト：2.0）

4. キーボード入力とショートカット

このツールでは、キーボード入力とショートカットも利用できます。詳細はMCPインターフェースのUI Explorerガイドをご覧ください。

ワークフローの例

1. まず、画面に何が表示されているかを把握するために、UI を確認します。

   explore_ui(region="screen", control_type="Button")
   

2. スクリーンショットを撮影して、要素を視覚的に確認します。

   screenshot_ui(region="screen")
   

3. クリックしたい要素の座標を確認し、その座標をクリックします。

   click_ui_element(x=500, y=300)
   

4. 必要に応じてテキストを入力するか、キーボードショートカットを使用します。

   keyboard_input(text="Hello world", press_enter=true)
   

要件

• Windows オペレーティングシステム
• Python 3.10+
• MCP 1.6.0+
• PyAutoGUI
• PyWinAuto
• Pillow
• Pydantic 2.0+