AIに「動かない」とだけ伝えてない？期待と実際をセットで相談しよう
メニューが開かない、画像が表示されない、スマホだけレイアウトが崩れる。AIに「動かないので直して」と相談しても、見当違いの修正案が返ってくることがあります。
そんなときに足したいのが、「期待した動き」と「実際の動き」です。目指す状態と今の状態を並べると、何を問題としているのか伝えやすくなります。Web制作の不具合相談で、地味に役立つ書き方です。
「動かない」を、観察した事実にする
例えば「スマホメニューが変です」より、「ボタンを押すとメニューが開くはずなのに、アイコンだけ変わり、メニュー項目は見えません」と伝えます。「何も起きない」と「一部は動く」では、確認する場所も変わりますよね。
ここで「JavaScriptが壊れています」と原因まで決めつける必要はありません。まずは、どんな操作をして何が起きたかを、そのまま書いてみましょう。
そのまま使える相談テンプレート
次の角括弧の部分を、自分の環境や症状に置き換えて使ってください。コードやエラー文は、必要な箇所を末尾に追加します。
Webページの不具合を切り分けたいです。
【環境】
[OS、ブラウザとバージョン、画面幅など]
【再現する操作】
1. [どのページを開くか]
2. [どの操作をするか]
【期待した動き】
[その操作で、どうなるはずか]
【実際の動き】
[画面で確認できた変化。動く部分も含めて書く]
【エラー・関連コード】
[エラー文と、関係するHTML・CSS・JavaScript]
[未確認の項目は「未確認」と書く]
原因をまだ断定せず、最初に確認する項目を3つまで挙げてください。
各項目に「確認方法」と「結果によって次に見る場所」を付けてください。
判断に必要な情報が足りなければ、追加で必要なものを示してください。「試したこと」があれば、その結果も添えます。例えば「別ブラウザでも同じ」「ページを再読み込みしても変化なし」など。まだ試していないことを、試したように書かないのが大切です。
一度に直すより、一つずつ確かめる
この頼み方は原因を必ず当てる魔法ではありません。AIの回答は仮説として扱い、確認結果を返しながら進めましょう。複数の修正を一度に入れると、どの変更が効いたのか分かりにくくなります。
変更前のコードを残し、まずローカル環境や検証環境で一つずつ試すと、戻すときも安心です。相談に貼るログやコードには、パスワードやAPIキーなどを含めないようにしてください。
参照：OpenAI「ChatGPT Enterprise Prompting Guide」（2026年10月31日確認）。背景、タスク、条件を明確にする考え方を、不具合相談に応用したこの記事独自のテンプレートです。
