AIに「作りたい」を正しく伝える3つのコツ|プロンプト入門【入門3】

バイブコーディング

AIに「作りたい」を正しく伝える3つのコツ|プロンプト入門【入門3】

同じAIを使っても、「いい物がサッと出てくる人」と「何度頼んでも噛み合わない人」がいる。その差は、頭の良さではなく“頼み方”だ。バイブコーディングで一番効くスキルは「AIへの伝え方」。この記事で、未経験者がつまずく頼み方を、たった3つのコツで卒業しよう。

なぜ「作って」だけだと失敗するのか

多くの人は最初、こう打ってしまう。「家計簿アプリを作って」。すると、AIは巨大なコードを一気に吐き出し、たいてい途中で動かなくなる。原因はAIの能力ではない。こちらの注文が“ざっくりしすぎ”だからだ。曖昧な注文には、曖昧な物しか返ってこない。コツは、この逆をやることに尽きる。

人間の同僚なら「家計簿アプリ作って」でも、あなたの立場や過去の会話から「ああ、あの用途ね」と察してくれる。AIには、その背景が一切見えていない。あなたが未経験なことも、スマホで使いたいことも、書かなければ存在しないのと同じだ。「察してもらう」前提を捨てて「全部言葉にする」前提に切り替える。頼み方のコツは、突き詰めればこの1点から生まれている。

コツ1:いきなり作らせず、まず「相談」する

最初の一手は「作って」ではなく「相談」だ。AIを“作る人”の前に、“一緒に考えてくれる人”として使う。

「○○を作りたいです。プログラミングは未経験です。どんな機能が必要ですか? 初心者でも作れるように、できるだけ小さな構成を提案してください。まだコードは書かないでください。」

こう聞くと、AIは画面・機能・データの形を箇条書きで整理してくれる。ここで5分話すだけで、後から「やっぱりこうしたい」が激減する。家を建てる前に間取り図を描くのと同じだ。

コツ2:「いちばん小さな1機能」だけ頼む

相談で全体像が見えたら、その中の最小の1つだけを作らせる。「入力欄だけ」「ボタン1個だけ」で構わない。

「まずは入力欄に文字を打って“保存”ボタンを押すと、画面に一覧で表示されるだけの、いちばん小さい形を作ってください。」

小さく頼むほど、動かなかったときに「どこが原因か」がすぐ分かる。大きく頼むと、巨大な塊のどこが悪いのか誰にも分からなくなる。これがバイブコーディング最大のコツであり、シリーズ全体を貫く原則だ。

コツ3:専門用語は要らない。「ふつうの言葉」で具体的に

「APIを叩いて非同期で…」のような言葉は一切いらない。代わりに、見た目と動きを、ふつうの言葉で具体的に伝える。

  • ❌ 曖昧:「いい感じの見た目にして」
  • ⭕ 具体:「背景は白、ボタンは青、文字は大きめ。スマホでも見やすくして」

五感で思い浮かぶくらい具体的に言うほど、イメージ通りの物が返る。うまく言葉にできなければ、「こういう雰囲気にしたい」と例を見せるだけでもいい。

曖昧語の「言い換え辞書」を持っておく

コツ3の「ふつうの言葉で具体的に」は、よく使う曖昧語の言い換えを覚えておくと一気に楽になる。

  • 「いい感じに」→「背景は白、文字は黒、ボタンは角丸の青。余白を広めに」
  • 「使いやすく」→「ボタンは親指で押せる大きさに。入力欄は1画面に1つずつ」
  • 「かっこよく」→「黒背景に白文字、見出しだけ黄色。フォントは太め」
  • 「シンプルに」→「機能は追加と削除の2つだけ。設定画面は無し」

右側の言い方に正解があるわけではない。あなたの頭の中の絵を、色・大きさ・数・配置のどれかに置き換えて言う、という変換の型だけ真似てほしい。

色や大きさのほかに、「動き」も言葉にできる。「追加を押したら、新しいメモがふわっと現れる」「削除したら、すっと消える」。この一言で、アプリの触り心地まで注文が届く。慣れてきたら試すといい。

ビフォー→アフターで見る「伝わる頼み方」

3つのコツを、1つの実例に落とし込んでみる。題材は「読書記録アプリ」。

❌ ビフォー:「読書記録アプリを作って。いい感じにして。」

これだと、AIは機能を推測で盛り、巨大なコードを一気に出してくる。3つのコツを効かせると、こうなる。

⭕ アフター:「プログラミング未経験です。読んだ本のタイトルと一言感想を記録する、自分用のアプリを作りたいです。まずコードは書かずに、必要な機能と一番小さい構成を提案してください。画面は、入力欄2つ(タイトル・感想)と『記録する』ボタン、その下に記録の一覧、というシンプルな形をイメージしています。」

違いは3つ。①いきなり作らせず相談から入っている。②「入力欄2つとボタン1つ」まで絞っている。③見た目をふつうの言葉で描写している。同じ題材でも、返ってくる物の精度がまるで変わる。

返事が「長すぎて読めない」ときの返し方

頼み方が良くても、AIの返事が専門用語だらけで長い、ということはよく起きる。そこで読むのを諦めず、返事にもう一言返す。

  • 「今の説明を、中学生にも分かる言葉で3行にまとめてください」
  • 「選択肢が多すぎます。初心者向けのおすすめを1つだけ選んで、理由を1行で教えてください」

会話は一往復で終わりではない。分からなければ、分かるまで噛み砕かせる。それができるのがチャット形式の強みだ。

逆に、AIに質問させる

ここまでは「こちらが上手に伝える」話だった。実は、その逆向きの手もある。足りない情報をAIの側から聞き出させるのだ。

「◯◯を作りたいです。作り始める前に、あなたが知っておくべきことを私に質問してください。全部答えたら、提案を始めてください。」

こう頼むと、AIは「誰が使いますか?」「データは残す必要がありますか?」「スマホとパソコンどちらで使いますか?」と、まさに設計に必要な質問を並べてくる。自分では思いつかなかった観点が質問の形で出てくるので、答えているうちに要件が固まっていく。伝え方に自信が持てないうちは、この「質問させる型」が一番の近道になる。作る物が複雑になるほど自分の見落としも増えるので、この型は2本目・3本目と進むほど効いてくる。

そもそも「作りたい物」が決まらないとき

頼み方以前に、題材が浮かばない人もいる。そのときは、AIに題材ごと相談してしまえばいい。

「プログラミング未経験です。練習として最初に作る小さなアプリを探しています。私は(例:料理が趣味/子どもの習い事の送迎が多い/読書記録をつけたい)です。私の生活に合った、1時間くらいで作れそうな題材を3つ提案してください。」

括弧の中身を自分の生活に差し替えるだけで、あなた専用の候補が返ってくる。作りたい物は、探すものというより、日々の「ちょっと面倒くさい」の中に落ちている。それを拾い上げる相談から始めれば、題材選びで止まらない。

会話が噛み合わなくなったら「仕切り直す」

何往復かするうちに、話がこじれてくることがある。修正の修正を重ねて、AIも自分も何が最新か分からなくなる状態だ。そうなったら、こじれた糸をほどこうとせず、一度リセットする。

「一度整理させてください。今までの案はいったん忘れて、要件を言い直します。作りたいのは◯◯で、機能は△△だけ。この条件で、最初から提案し直してもらえますか?」

人間相手なら失礼になりかねない仕切り直しも、AIには一切気を使わなくていい。「ここまでの流れに引きずられているな」と感じたら早めに言い直す。粘るより速い。仕切り直しの見極めは「3往復直しても近づかないか」を目安にすると、ずるずる粘らずに済む。

そのまま使える「最初のひと言」テンプレ

迷ったら、これをコピーして自分の作りたい物に書き換えるだけでいい。

「プログラミング未経験です。【作りたい物】を作りたいです。
① まずコードは書かず、必要な機能と一番小さい構成を提案してください。
② そのあと、いちばん小さい1機能だけを作ってください。
③ 専門用語は避けて、初心者にも分かるように一歩ずつ進めてください。」

頼み方さえ身につけば、もう半分は作れたようなものだ。次はいよいよ、この頼み方で“動くアプリ”を1本完成させる。


👉 前へ: 【入門2】道具をそろえる ・ 次へ: 【入門4】はじめての“動くアプリ”を1本作る記事一覧

バイブコーディングの始め方|AIツールの選び方と最初のセットアップ【入門2】バイブコーディングの始め方|AIツールの選び方と最初のセットアップ【入門2】前のページ

はじめての“動くアプリ”を1本作る|メモ帳をステップバイステップで【入門4】次のページはじめての“動くアプリ”を1本作る|メモ帳をステップバイステップで【入門4】

ピックアップ記事

  1. Claude Mission Control の作り方 — Tauri+Pyth…

  2. New Eden Intelligence Hub の作り方 — EVE Onl…

  3. 高精度OCRデスクトップアプリの作り方 — PaddleOCR-VLとPyIns…

  4. 競艇予想AIの作り方 — LightGBMで「当たる順位」を学習させる実装ガイド…

関連記事

  1. 都市開発シミュを作る④|4度つまずいて座標系ごと作り直した話 — 真のアイソメグリッド移行【Aurum City制作】
  2. 背景除去アプリを作る④|BiRefNetをONNXでローカル推論する — モデル別前処理とDirectML→CPUフォールバック【背景除去Studio制作】
  3. 都市開発シミュを作る⑥|静的ビルドをWordPressへ公開+連載総括【Aurum City制作・完結】

    アプリの作り方

    都市開発シミュを作る⑥|静的ビルドをWordPressへ公開+連載総括【Aurum City制作・完…

    完成した都市開発シミュを、バックエンド無しの静的ビルドにしてWordP…

  4. 壊れないようにアプリを育てる|機能追加・役割分け・動作確認の習慣【入門6】

    バイブコーディング

    壊れないようにアプリを育てる|機能追加・役割分け・動作確認の習慣【入門6】

    機能を足すたび別の場所が壊れる“もぐら叩き地獄”を抜ける3つの習慣。1…

  5. エラーが出たらどうする?AIへの聞き方とデバッグの基本【入門5】

    バイブコーディング

    エラーが出たらどうする?AIへの聞き方とデバッグの基本【入門5】

    赤いエラー、真っ白な画面、反応しないボタン。ここで多くの人が止まる。エ…

  6. 都市開発シミュを作る③|需要・成長・経済の決定論シミュレーション(MVP完成)【Aurum City制作】

    アプリの作り方

    都市開発シミュを作る③|需要・成長・経済の決定論シミュレーション(MVP完成)【Aurum City…

    需要・成長・経済で街を動かす決定論シミュレーションの作り方。種から回す…

注目

AIで、ここまで作れる

AIで作った2D RPGを、ブラウザでそのまま遊べます。その「作り方=最後まで完成させる進め方」も実例つきで公開中。

▶ ゲームを遊ぶやり方を読む

PR

ロリポップ!レンタルサーバー(PR)

レンタルサーバ:ロリポップ!(本サイトの稼働環境・PR)

  1. 背景除去アプリを作る⑥|QGraphicsViewズーム・スポイト・QThread非同期・D&D一括処理【背景除去Studio制作】

    アプリの作り方

    背景除去アプリを作る⑥|QGraphicsViewズーム・スポイト・QThrea…
  2. Claude API が会話途中の system メッセージに対応 — キャッシュを壊さず方針を差し替える

    AI・テック動向

    Claude API が会話途中の system メッセージに対応 — キャッシ…
  3. Anthropic「Reflect」— AI利用の可視化を自動化の材料にする

    AI・テック動向

    Anthropic「Reflect」— AI利用の可視化を自動化の材料にする
  4. Kimi K3 のウェイト公開 594GB — 「オープンウェイト=手元で動く」が成り立たない規模をコストで見る

    AI・テック動向

    Kimi K3 のウェイト公開 594GB — 「オープンウェイト=手元で動く」…
  5. AIに「作りたい」を正しく伝える3つのコツ|プロンプト入門【入門3】

    バイブコーディング

    AIに「作りたい」を正しく伝える3つのコツ|プロンプト入門【入門3】
PAGE TOP

TAG CLOUD

ドラッグで回転・クリックでそのタグの記事一覧へ