1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Claude Code × Playwrightで企業サイトの問い合わせを増やす方法|SI・受託開発向け実践プロンプト

1
Last updated at Posted at 2026-04-04

Gemini_Generated_Image_3zon203zon203zon.png

企業サイトを改善したいと思っても、
「どこを直せば問い合わせが増えるのか」が分からず、手が止まることは多いです。

本記事では、Claude Code × Playwrightを使って、企業サイトを実際に操作しながら
CTA・導線・訴求・フォーム到達までの改善点を優先度つきで洗い出す方法を整理します。

対象は、SI・受託開発企業のサイト改善です。
特に、企業の決裁者からの問い合わせを増やしたいケースを想定しています。

記事内では、すぐ試せるコピペ用プロンプトと、
AIの出力をそのまま使わず実務で使える改善案に絞る考え方までまとめます。

結論

やることはシンプルです。

適切なプロンプトを投げること。

ただし、プロンプト設計を間違えると、抽象的で使いにくい改善案しか出ません。

今回のゴール

  • 問い合わせ(営業)を増やす
  • 対象:企業の決裁者
  • ビジネス:SI・受託開発

使用するプロンプト

① 問い合わせCV特化版(最重要)

この分析では Playwright MCP を使ってください。
<対象サイトURL> を巡回し、企業の決裁者からのSI・受託開発の問い合わせ(営業)数を増やす観点で改善点を特定して、CTA・導線・訴求・フォーム到達までを中心に、優先度つきで具体的な改善案を出してください。
PC表示とiPhone 13相当での表示の両方を確認し、離脱しやすい箇所、分かりにくい箇所、クリックや表示の不具合をチェックしてください。モバイル対応状況は推測で断定せず、確認できた事実ベースで評価してください。

② UI/UX総点検版(補助)

この分析では Playwright MCP を使ってください。
<対象サイトURL> を巡回し、企業サイトとしてのUI/UX全体を点検して、導線、情報設計、視認性、iPhone 13相当での表示、リンク切れ、表示崩れ、Console error を含めた改善点を、優先度つきで具体的に整理してください。
主要ページを実際に操作した上で、ユーザー視点で使いにくい箇所とその改善案をまとめてください。モバイル対応状況は推測で断定せず、確認できた事実と問題箇所を明示してください。

③ 採用導線特化版(必要な場合のみ)

この分析では Playwright MCP を使ってください。
<対象サイトURL> を巡回し、採用応募を増やす観点で改善点を特定して、新卒・中途への導線、情報設計、訴求、応募までの流れを中心に、優先度つきで具体的な改善案を出してください。
PC表示とiPhone 13相当での表示の両方を確認し、応募意欲を下げる箇所、迷いやすい箇所、クリックや表示の不具合をチェックしてください。モバイル対応状況は推測で断定せず、確認できた事実ベースで評価してください。

今回の主目的が営業問い合わせの増加であれば、優先度は次の通りです。

  1. 問い合わせCV特化版
  2. UI/UX総点検版
  3. 採用導線特化版

なぜこのプロンプト設計が重要なのか

抽象的な依頼だと精度が落ちる

例えば次のような依頼です。

サイトを改善してください

これでは、出てくる内容が曖昧になりやすくなります。

  • 表面的なUI改善
  • 一般論
  • 優先順位の弱い提案

制約を明確にすると、出力が実務寄りになる

今回のように、以下を明示します。

  • 誰からのCVを増やしたいのか
  • 何の問い合わせを増やしたいのか
  • どのビジネスモデルなのか

具体的には、次の条件です。

  • 企業の決裁者
  • SI・受託開発の問い合わせ
  • 問い合わせ導線の改善

これにより、出力内容が次の方向に寄りやすくなります。

  • 実績の見せ方改善
  • 信頼性の強化
  • 課題ベースの訴求
  • CTA設計の最適化

つまり、売上に近い改善案が出やすくなります。

実務での使い方

Step 1. まずは問い合わせCV特化版を実行する

営業問い合わせを増やすのが目的なら、最初に使うべきはこれです。

この分析では Playwright MCP を使ってください。
<対象サイトURL> を巡回し、企業の決裁者からのSI・受託開発の問い合わせ(営業)数を増やす観点で改善点を特定して、CTA・導線・訴求・フォーム到達までを中心に、優先度つきで具体的な改善案を出してください。
PC表示とiPhone 13相当での表示の両方を確認し、離脱しやすい箇所、分かりにくい箇所、クリックや表示の不具合をチェックしてください。モバイル対応状況は推測で断定せず、確認できた事実ベースで評価してください。

Step 2. 出力をそのまま採用しない

ここが重要です。

AIから出てきた改善案は、そのまま全部採用するのではなく、絞り込みが必要です。

Step 3. この3条件でフィルタする

改善案は次の3つで絞ると使いやすくなります。

  • 問い合わせに直結するか
  • 決裁者の不安を減らすか
  • すぐ実装できるか

Step 4. TOP5だけ実装する

改善案を10個も20個も同時に実装すると、効果検証が難しくなります。

そのため、まずはTOP5だけ実装するのが現実的です。

SI・受託開発サイトで効きやすい改善

これは一般論ではなく、SI・受託開発型の企業サイトで比較的効きやすい方向です。

1. ファーストビューで対象顧客と解決課題を明示する

訪問直後に、次が伝わる必要があります。

  • 誰向けの会社か
  • どんな課題を解決できるか

「技術力があります」だけでは弱く、
「どのような課題に対して、どのような支援ができるか」が必要です。

2. 実績から問い合わせへ自然につなぐ

実績紹介の役割は、単なる紹介ではなく不安の解消です。

そのため、実績の直後に次のような導線があると強くなります。

  • 同様の課題について相談する
  • この領域の開発を相談する
  • 類似案件の支援について問い合わせる

3. 選ばれる理由を明確にする

SI・受託開発の問い合わせでは、次の不安が発生しやすいです。

  • 任せて大丈夫か
  • 類似案件の経験があるか
  • コミュニケーション面で問題ないか

このため、次のような情報は強い訴求になります。

  • 対応領域
  • 実績
  • 支援体制
  • 継続支援の可否
  • 得意な案件の特徴

Playwrightを使うメリット

従来の人手レビューと比較すると、次の差があります。

項目 従来 Playwright活用
視点 主観に寄りやすい 実操作ベース
再現性 低い 高い
テスト 手動中心 手順化しやすい
改修後確認 面倒 再実行しやすい

つまり、改善して終わりではなく、改善後の確認まで回しやすいのが強みです。

まとめ

本記事のポイントは以下です。

  • プロンプト設計が重要
  • 「誰の」「何のCV」を増やしたいかを明示する
  • 営業問い合わせが目的なら、問い合わせCV特化版を最優先に使う
  • 出力はそのまま使わず、TOP5に絞って実装する
  • 公開記事では実在URLは伏せる

本質は次の一文に尽きます。

AIに広く考えさせるより、目的と制約を先に定義した方が、実務で使える出力になりやすい。

付録:コピペ用プロンプト集

問い合わせCV特化版

この分析では Playwright MCP を使ってください。
<対象サイトURL> を巡回し、企業の決裁者からのSI・受託開発の問い合わせ(営業)数を増やす観点で改善点を特定して、CTA・導線・訴求・フォーム到達までを中心に、優先度つきで具体的な改善案を出してください。
PC表示とiPhone 13相当での表示の両方を確認し、離脱しやすい箇所、分かりにくい箇所、クリックや表示の不具合をチェックしてください。モバイル対応状況は推測で断定せず、確認できた事実ベースで評価してください。

UI/UX総点検版

この分析では Playwright MCP を使ってください。
<対象サイトURL> を巡回し、企業サイトとしてのUI/UX全体を点検して、導線、情報設計、視認性、iPhone 13相当での表示、リンク切れ、表示崩れ、Console error を含めた改善点を、優先度つきで具体的に整理してください。
主要ページを実際に操作した上で、ユーザー視点で使いにくい箇所とその改善案をまとめてください。モバイル対応状況は推測で断定せず、確認できた事実と問題箇所を明示してください。

採用導線特化版

この分析では Playwright MCP を使ってください。
<対象サイトURL> を巡回し、採用応募を増やす観点で改善点を特定して、新卒・中途への導線、情報設計、訴求、応募までの流れを中心に、優先度つきで具体的な改善案を出してください。
PC表示とiPhone 13相当での表示の両方を確認し、応募意欲を下げる箇所、迷いやすい箇所、クリックや表示の不具合をチェックしてください。モバイル対応状況は推測で断定せず、確認できた事実ベースで評価してください。
1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?