毎週WordPressにブログを投稿して、同じ内容をnoteにも転記。画像を差し替えてカテゴリを選び、メタ情報も埋める。これだけで1時間以上かかる。ブラウザの中で完結する業務は、人の手で繰り返されがちですが、時間も気力も確実に削っていきます。API連携ができないサービスや、ログインが必要な管理画面ほど、この「手作業ゾーン」が分厚くなります。
この問題を丸ごと解きほぐすのが、Claude CodeのPlaywright連携です。Anthropic公式CLIであるClaude CodeにPlaywright MCPを組み合わせると、AIがブラウザを自分で開き、ログインし、フォーム入力や投稿操作まで一貫して処理できます。RPAのような画面録画は不要で、日本語で「管理画面に入って新規記事を公開して」と指示するだけで動きます。
この記事では、Playwright連携の仕組みと中小企業での活用法、非エンジニアでも始められる4ステップを解説します。
目次
Playwright連携とは？ブラウザ業務がAIに任せられる理由中小企業で効果が出るPlaywright活用5選業種別 活用シーン非エンジニアでもできる導入4ステップ導入前に知っておくべき注意点よくある質問導入サポートのご案内
1. Playwright連携とは？ブラウザ業務がAIに任せられる理由
Playwrightはもともとブラウザテスト用のオープンソースツールで、マイクロソフトが開発しています。Claude CodeはPlaywright MCP（Model Context Protocol）を通じてこのブラウザエンジンを呼び出し、AIが自律的にページを操作できる状態を作ります。ページを開く、要素をクリックする、文字を入力する、スクリーンショットを取る。これらをすべて自然言語の指示から実行します。
従来の自動化ツールとの違い
外部連携は提供側が対応していなければ使えないが、Playwrightは人が見ているブラウザ画面ごと操作できるRPAは画面座標や操作手順を事前録画する必要があるが、PlaywrightはAIが画面構造を読み取って動的に判断する画面デザインが多少変わっても、AIが要素を探し直して処理を続けられる
MCPやHookとの相性
Playwright MCPは単体でも強力ですが、他のMCPと組み合わせると真価を発揮します。たとえばNotionで承認された記事をWordPressに自動投稿、受注メールを検知したら管理画面に在庫登録といった部門横断の業務を、Claude Codeが一気通貫で処理できるようになります。
外部連携とPlaywright連携の違い
項目外部連携Playwright連携対応サービス提供ありのみブラウザで使える全サービス導入コストトークン発行や審査が必要ログイン情報があれば開始可能画面変更への耐性影響なしAIが構造を読み直して追従ログイン必須サービス不可のケース多いログインごと自動化できる
2. 中小企業で効果が出るPlaywright活用5選
(1) WordPress・オウンドメディアの自動投稿
ブログ記事の本文・タイトル・カテゴリ・アイキャッチ画像・SEO設定を、管理画面を開いて入力するところまで自動化できます。毎週の投稿作業が1時間から数分に短縮され、しかも投稿漏れや設定ミスもなくなります。記事原稿をClaude Codeが書き、そのままPlaywrightで管理画面に流し込む一気通貫フローが実現します。
(2) SNS投稿・予約投稿の代行
note、各種ブログサービス、SNSの投稿画面は、外部連携が限定的なものが多い領域です。Playwright連携なら、ログインから本文入力、ハッシュタグ設定、公開ボタンのクリックまで任せられます。複数プラットフォームへの横展開もワンコマンドで完了し、担当者の転記作業がなくなります。
(3) 予約管理・顧客管理サービスへの登録
予約台帳、顧客管理システム、問い合わせフォーム、通販サイトの商品登録など、ブラウザで完結する中小企業向けサービスはほとんどがPlaywrightで操作可能です。問い合わせ受付から顧客データ登録までの流れを自動化すれば、スタッフは一次対応や接客といった人にしかできない業務に集中できます。
(4) 競合調査・リサーチのスクリーンショット収集
競合サイト、検索結果、口コミサイトなどを定期巡回し、ページ内容とスクリーンショットを自動取得します。週次や月次でレポート化すれば、営業や企画部門の調査作業を大幅に削減できます。Claude Codeが取得結果を要約してくれるため、見るだけのレポートから判断に使えるレポートに進化します。
(5) 勤怠・経費申請などの社内業務自動化
勤怠システムの打刻、経費精算の申請、交通費計算、出張予約など、定型化された社内業務を丸ごと代行できます。社員が開いて打つのをやめれば、月単位で数十時間の可処分時間が生まれます。Hookと組み合わせれば、出社検知や業務開始の合図で自動的に打刻する流れも作れます。
3. 業種別 活用シーン
業種主な活用シーン美容・サロン予約サイトへの空き枠同期、口コミ返信の下書き登録、SNS投稿の自動化飲食・小売グルメサイト・ビジネスプロフィールの更新、通販サイト商品登録士業・コンサルオウンドメディアへの自動投稿、セミナー予約サイトの申込確認処理人材・教育求人媒体への同時投稿、受講者管理画面の登録・更新不動産・工務店ポータルサイトへの物件情報掲載、内見予約の自動受付
4. 非エンジニアでもできる導入4ステップ
ステップ1：自動化したいブラウザ業務を洗い出す
毎週・毎日繰り返しているブラウザ作業を紙に書き出します。最初はWordPressの投稿、予約サイトの更新、SNSの定期投稿など、月10時間以上かかっている業務に絞ると費用対効果が出やすくなります。業務フローを図にすると、Claude Codeへの指示も作りやすくなります。
ステップ2：Claude CodeにPlaywright MCPを追加する
Claude CodeにPlaywright MCPをインストールします。コマンド一行で完了し、インストール後はブラウザを開いて、ログインしてといった日本語指示がそのまま動くようになります。必要に応じてログイン情報は安全な設定ファイルに格納し、AIから直接見えないように管理します。
ステップ3：1業務ずつ手順書をAIに読ませる
自動化したい業務の操作手順を日本語で書きます。管理画面にログイン、新規作成ボタンを押す、タイトルに◯◯を入力といった粒度で十分です。この手順書をClaude Codeに渡し、実際にPlaywrightで動かしてみて、うまくいかない箇所を修正していきます。2〜3回の往復で安定稼働に入るケースが多いです。
ステップ4：スラッシュコマンドやHookに組み込む
動くようになった自動化フローを、スラッシュコマンド化して一行呼び出しにします。さらにHookと組み合わせれば、メール受信や業務開始のタイミングで勝手に走らせることもできます。ここまで組み込めば、ブラウザ業務はやるから動いている状態に変わります。
5. 導入前に知っておくべき注意点
利用規約の確認：対象サービスが自動操作を明示的に禁止していないか、事前に規約を確認するログイン情報の管理：共有端末に直接パスワードを書かず、環境変数や専用の鍵管理ツールに格納する二段階認証の設計：認証コードが必要なサービスは、運用設計段階で扱い方を決めておく例外時の人の確認：重要操作（削除・決済など）は、実行前に人が確認するステップを残す画面変更時の再テスト：対象サービスが大幅リニューアルしたら、手順書を見直す
6. よくある質問
Q1. プログラミング経験がなくても使えますか？
使えます。日本語の手順書さえ書ければ、Claude Codeが内部のコードを自動生成します。手順書は操作の流れを言葉で並べたメモでよく、エンジニア的な記述は不要です。
Q2. ログイン情報をAIに渡すのは安全ですか？
環境変数や設定ファイルに保管し、AIが直接読み書きできない形にするのが基本です。Claude Codeはログイン処理の際に必要な値だけを参照する構成にできるため、設計次第で安全性を確保できます。
Q3. どのブラウザで動きますか？
Playwrightは3系統のブラウザエンジンに対応しており、macでもWindowsでも動作します。ほとんどの業務は標準のブラウザエンジンで十分ですが、特定ブラウザでしか動かない画面は別エンジンを選ぶとよいです。
Q4. 他の自動化ツールと併用できますか？
併用できます。外部の自動化サービスで起動トリガーを作り、最終的な画面操作をPlaywrightに任せる構成も有効です。既存の自動化資産を捨てずに拡張できます。
Q5. 導入にどれくらい時間がかかりますか？
1業務であれば、打ち合わせから初回稼働まで2〜3時間程度が目安です。複数業務を横展開する場合は、1業務追加ごとに1時間前後で済むことが多いです。
7. 導入サポートのご案内
ブラウザ業務の自動化を、まずは1業務から
Claude Code × Playwright連携で毎週のWordPress投稿、SNSへの同時投稿、予約サイトの更新などを自動化したい中小企業の方へ。対象業務の棚卸しから初回稼働までを一緒に進める、Claude Code導入サポート（¥3,000〜）をご用意しています。ご興味のある方はココナラのメッセージ機能からお気軽にご相談ください。購入画面に進むボタンからそのままご依頼いただけます。
ブラウザの中で終わる業務は、裏を返せばAIに代わってもらいやすい業務でもあります。月100時間の手作業が、半日のセットアップでゼロに近づく。Playwright連携は、その現実的な一歩を用意してくれます。まずは一番気になっているブラウザ業務を書き出すところから始めてみてください。
