AIへの指示をうまく伝えるコツ——コーダー視点のプロンプト設計【AI×コーディング】

aiへの指示をうまく伝えるコツコーダー視点のプロンプト設計aiコーディング AI×コーディング

「AIにコードを書いてもらったけど、思ってたのと全然違う」「何度修正させても微妙にズレる」——そんな経験、ありませんか?

実はこれ、AIの精度の問題じゃなくてプロンプト(指示の出し方)の問題であることがほとんどです。

この記事では、WEB制作・コーディングの現場でAIをバリバリ使ってきた経験をもとに、コーダー視点でそのまま使えるプロンプト設計のコツをまとめました。ChatGPT・Claude・Cursorどれでも共通して使えます。

指示通り動けやあああああってならないで済む?かも?
自分でやってうまくいかないのよりむかつくのは私だけ?

プロンプトの精度がそのまま出力品質になる

AIは「空気を読む」ことができません。人間なら「いい感じに」という指示でなんとなく意図を汲んでくれますが、AIは書かれていないことは基本的に補完しません。

つまり、指示の質 = 出力の質です。

逆に言えば、プロンプトの書き方を少し変えるだけで、AIの回答は劇的に変わります。「AIって使えないな」と思ったとき、まず疑うべきはプロンプトです。

コーダーが押さえておきたいプロンプト設計の5つのコツ

① 言語・環境・バージョンを必ず明記する

コーディングのプロンプトで一番よくある失敗が「何で書くか」を伝えていないことです。

// ❌ あいまいな指示
スライダーを実装してください。

// ✅ 具体的な指示
WordPressテーマ(functions.php + カスタムテンプレート)でSwiperJSを使った
スライダーを実装してください。PHPのバージョンは8.1です。

AIは情報がないと「一般的な回答」を返します。使っている言語・フレームワーク・バージョンをセットで伝えるだけで、精度がぐっと上がります。

② 既存コードをそのまま貼る

「こういう感じで書いて」という説明より、実際のコードを貼ったほうが圧倒的に伝わります。

// ✅ 既存コードを渡して指示する例
以下のPHPコードにnonce処理を追加してください。

<?php
function my_ajax_handler() {
$data = $_POST[‘data’];
// 処理
}
add_action(‘wp_ajax_my_action’, ‘my_ajax_handler’);

既存のコードを渡すことで、AIはコードのスタイルや文脈を理解して出力してくれます。ゼロから書かせるより修正・追記の形で頼むほうがミスも少ないです。

③ 「何をしたいか」より「何が問題か」を伝える

バグ修正を頼むとき、やりたいことだけ伝えてもAIは原因を特定できません。

// ❌ やりたいことだけ伝える
jQueryのslideToggleが動きません。直してください。

// ✅ 状況・エラー・試したことをセットで伝える
jQueryのslideToggleをクリックで実行しようとしていますが、
初回クリック時だけ動かず、2回目以降は動きます。
コンソールエラーはありません。$(document).ready()は使っています。

「何が起きているか・何をすでに試したか」を伝えることで、AIは原因の絞り込みから始めてくれます。

④ 出力形式を指定する

「コードだけ」「コメントあり」「関数名は英語で」など、出力の形式を最初から指定しておくと、後から手直しする手間が減ります。

// ✅ 出力形式を指定した例
以下の条件でJavaScriptを書いてください。
・jQueryは使わない(Vanilla JSで)
・関数名はキャメルケース
・コメントは日本語で
・コード以外の説明文は不要

「コード以外の説明文は不要」という一言を入れるだけで、余分な解説が省かれてそのままコピペできる形で返ってきます。

⑤ 一度に全部頼まない

「このサイト全体のレスポンシブ対応をして」のような大きな指示は、AIの精度が落ちやすいです。機能単位・ファイル単位で小さく分割して頼むほうが、結果的に早く目的に辿り着けます。

// ❌ 大きすぎる指示
このWordPressテーマ全体をスマホ対応にしてください。

// ✅ 分割して指示する
まずはheader.phpのナビゲーション部分だけスマホ対応にしてください。
ハンバーガーメニューはCSSのみで実装してください。

プロンプトをさらに精度アップさせる小技

「〜しないでください」より「〜してください」で伝える

否定形の指示はAIに伝わりにくい場合があります。「jQueryを使わないで」より「Vanilla JSで書いてください」のほうが意図通りに動くことが多いです。

うまくいったプロンプトは保存しておく

「このプロンプトで良い回答が来た!」というパターンは積極的に保存しておきましょう。自分専用のプロンプト集を作っておくと、次回以降の作業がどんどん速くなります。テキストファイルでも何でもOKです。

期待どおりでなければ対話で修正する

一発で完璧な回答を求める必要はありません。「ここをこう変えて」「もう少しシンプルに」と追加指示を出しながら対話形式で詰めていくのが、実務での正しい使い方です。

躓きやすいポイント

情報を詰め込みすぎると精度が落ちる

「あれもこれも」と一つのプロンプトに盛り込みすぎると、AIが優先順位を判断できなくなります。重要な条件に絞って伝えるか、複数回に分けて指示しましょう。

AIの回答を鵜呑みにしない

プロンプトがうまくても、AIが誤ったコードを自信満々に返すことがあります(いわゆるハルシネーション)。特にWordPressの関数名やAPIの仕様は必ず公式ドキュメントで確認する習慣をつけましょう。

まとめ

  • 言語・環境・バージョンを必ず明記する
  • 既存コードをそのまま貼って文脈を渡す
  • 「何が問題か」を状況・エラー・試したこととセットで伝える
  • 出力形式(Vanilla JS・コメント日本語など)を最初に指定する
  • 大きな指示は機能単位で分割する

最初はプロンプトを考えるのが少し面倒に感じるかもしれませんが、慣れてくると「この頼み方が一番早い」というパターンが身につきます。AIはうまく使えば本当に頼もしいアシスタントになるので、ぜひ試してみてください!

AIを使ったコーディングのコツについては、こちらの記事もあわせてどうぞ。 → AIにコードレビューを頼む方法とプロンプトのコツ【AI×コーディング】

ご質問・ご依頼はお気軽に👉 お問い合わせはこちら

タイトルとURLをコピーしました