Playwright MCPが起こす静かなるAIエージェントによるローカルPCの支配

# はじめに
[株式会社PROMPT-X](https://www.prompt-x.jp/profile)の天辰です。
MCPがリリースされてそこそこ時間が経ち、いろんな事例やMCPサーバが次々とリリースされていますね。

### 振り返り
私も昨年末に1本Qiita書いてます。

https://qiita.com/amatatsuk/items/4303f6bedd441c8a2588

この`Filesystem`も結構便利で、自分の業務やその後のイベントとかでも活用しています。

https://note.com/amatatsuk/n/nd8a82c1737c8

AIエージェントというとなんだかスゴイのがやってきそうですが・・・実際はこういうのからやってくるという話しです。

# 誰でも分かるMCPのおさらい
スゴくわかりやすく色んな技術的な話しを丸っと省いて説明します。
前回の高知生成AIラボで使ったスライドの再掲ですが、インターネットサービスであるClaude（Anthropic_APIではなく）がローカルPCにインストールされたアプリを経由してローカルPCの様々なリソースやアプリにアクセスする仕組みです。（あ、ChatGPTもMCP対応するみたいですね）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351028/865c1d72-2cb9-4d81-845e-2146e535cd60.png)

## こう変わる！Claudeの使い方
Claudeに限って言えばになりますが・・・既に業務でClaudeを業務にお使いの方も多いと思います。
ただ、こんなお悩みもあるのでは？

 - Claudeってインターネット検索できない
 - Claudeってドキュメント連携が面倒くさい（Projectぐらいしかない）
 - Claudeって社内情報との連携が面倒

これがまるっと解決していまうのがMCPの破壊力です。

## 安全性について
元々かなりClaudeは企業ユースに気を使って「学習しません」とかになってますが、そもそもClaudeは`クラウド例外`が適用され、委託型のサービスなので安全且つ安心して利用デキているハズです。
このMCPを使えば、ローカルPC上のClaudeアプリを経由して社内のローカルPCからあらゆるデータにアクセス出来ることになります。

# 本命ブラウザMCPサーバ来る
様々な便利系MCPがリリースされる中、遂にMicrosoftが**playwright**をMCP対応させてきました。

https://github.com/microsoft/playwright-mcp

このリリースが主に`オフィスオートメーション`に与えるであろうインパクトについて実例を交えながら記事にまとめてみます。

## playwrightとは
Playwright（プレイライト） は、Microsoft が開発した Webブラウザの自動操作ライブラリ です。
開発・テスト・スクレイピング・RPA（業務自動化）など、幅広く使われています。
主要ブラウザ「Google Chrome（Chromium）・Mozilla Firefox・Apple Safari（WebKitベース）」を全てサポートしているので同じコードでテストに留まらずRPAといった使い方までデキてしまいます（ま、RPAはもともと画面テストツールですしね）。

## 実際にインストールしてみる
既にMCPとplaywrightのインストール方法については様々な記事が書かれていますが、正直どれも上手く行かない手順ばかりでお困りの皆さんも多いハズ！
そんな時はこちらの手順を試してみて下さい。私はコレで上手くできました。

https://zenn.dev/magurotuna/articles/playwright-mcp-setup-in-wsl

WSLで動かすというのは盲点でした。記事を書いてくださった`magurotuna`様に大変感謝しています。

# ブラウザMCPがもたらすインパクト
単純な話し`社内Webシステムにアクセス`できるようになります。今や殆どの社内システムはWebベースになっているハズです。SaaSも利用していたりするのも全部Webシステムですよね？

## 社内システムにもたらすインパクトの整理
Claude DesktopのPlaywright MCPを使うことで、以下のようなことが可能になります。

1. **社内システムへのアクセス**
   - イントラネット上のダッシュボードや管理画面の分析
   - 社内のデータ可視化ツールの内容理解
   - 社内Wikiや情報システムの参照

2. **セキュリティの観点**
   - ローカルで動作するため、機密データが外部サーバーに送信されない
   - 企業のファイアウォール内でのアクセスが可能

3. **業務効率化**
   - 社内システムの情報を基にした意思決定支援
   - 複数システムからのデータ統合と分析
   - 社内文書やマニュアルの検索・要約

外部サイトだけでなく社内システムにもアクセスできるってちょっとした革命ですね。

## Playwright MCPによって浸食される可能性のあるアプリ・サービス

| カテゴリ | 浸食されるアプリ・サービス | 浸食の影響 |
|---------|------------------------|----------|
| **自動化ツール** | • RPA（Robotic Process Automation）<br>• マクロ・スクリプト自動化<br>• テスト自動化ツール | 事前にシナリオを組む必要がなく、自然言語の指示だけで複雑な操作が可能になる |
| **情報収集・分析** | • データスクレイピングツール<br>• ダッシュボード分析サービス<br>• レポート作成支援ツール | 複数システムからのデータを統合し、文脈を理解した分析が自動で可能に |
| **マニュアル・ドキュメント** | • 業務マニュアル作成サービス<br>• システム操作ガイド<br>• 研修資料作成 | AIが直接システムを操作して最新の画面で解説を生成、常に最新状態を維持 |
| **社内サポート** | • ヘルプデスク業務<br>• FAQシステム<br>• 操作トレーニング | 実際のシステムにアクセスしてリアルタイムでの問題解決が可能に |
| **情報統合サービス** | • 社内ポータル<br>• 情報キュレーションツール<br>• ナレッジベース | 複数の情報源を横断して最新情報を収集・整理・要約する能力 |
| **データ入力業務** | • フォーム入力代行<br>• データ移行サービス<br>• 情報転記作業 | AIが直接システム間のデータ転記や入力を担い、人的ミスを削減 |
| **システム間連携** | • データ連携ミドルウェア<br>• API開発<br>• システム統合サービス | システム間の連携をUIレベルで実現し、バックエンド統合のコストを削減 |

これらのサービスやツールは多かれ少なかれビジネス領域を浸食されてしまうでしょう。ただ、完全に置き換わるというよりも、人間とAIとの新たな連携モデルへと進化していくでしょう。AIが単純作業を担い、人間はより創造的・戦略的な業務に集中するという構図の中で最適化される感じですかね？

# RealBoardのダッシュボードを理解させてみる
最後に[RealBoard(ノーコードより簡単でパワポ感覚で画面が作れます)](https://products.prompt-x.jp/realboard)で実現している製造現場のリアルタイム監視画面をClaudeに分析してもらいました。

## 射出成形工場のリアルタイムモニタリング
RealBoardのダッシュボード機能では、この「SimFactory - FABKG2_射出成形工場監視」のように製造現場のリアルタイムデータを視覚的に分かりやすく表示できます（小一時間あれば誰でもつくれます）。このダッシュボードは電力系統（63.51 kW）、冷却水系統（15.7 ℃）、エアー系統（0.71 MPa）の状態から、MLD1号機・MLD2号機の稼働状況、在庫数、完成品数まで、工場全体の状況を一目で把握できるよう設計されています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351028/7823ef81-870c-433a-a270-bcad56ef50d4.png)

特に注目すべきは各設備の詳細パラメータ（サイクル時間、金型温度、圧力など）がリアルタイムで表示され、右側のグラフでは時系列での推移や品質不良データの傾向も確認できる点です。こうした複雑な工場モニタリング画面も、RealBoardならノーコードで直感的に作成可能です。データポイントをドラッグ＆ドロップするだけで、現場エンジニアが自らの手で必要な監視画面を簡単に構築できるのが大きな魅力です。

## 現場データの文字起こしが実現
ClaudeがPlaywright MCP経由でRealBoardにアクセスしてくれました。

### 解析をお願い

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351028/0a425453-5385-4fdd-a5d6-4db2658ab136.png)

### 続きは次回！
今日はここまで・・・現場データの文字起こし結果については次回の記事で報告しますね。


# まとめ
ここまで「どうやってAIエージェントがローカルPCを支配」するかについて書いてきましたが？ご感想は如何だったでしょうか？
ちょっと刺激的なタイトルでしたが、具体的はところがご理解いただけたのでは？
次回は、[RealBoard](https://products.prompt-x.jp/realboard)を例にとって「工場のリアルタイム監視をAIにさせてみ」という感じで書いてみます。

# PROMPT-Xについて
東京・鹿児島・高知の3拠点で、商用時系列データベースCLOUDSHIPと可視化ソフトRealBoardを軸としたIoTプラットフォーム向けソフトウェアの開発・販売を行うメーカーです。IoT関連の開発支援サービスやソリューション開発も提供しています。鹿児島・高知での[開発エンジニア採用](https://www.prompt-x.jp/recruit)を強化中で、PROMPT-Xで働きたいと思える情報発信に努めています。