はじめに

こんにちは。DX開発事業部の鹿嶋です。ねこ、吸ってますか？
11月も中旬に差し掛かり、今年も残りわずかとなってまいりましたが、いかがお過ごしでしょうか。
少々早いですが、私は今日ここまでを振り返ると、プロジェクトマネージャー（PM）として、今年は数多くのプロジェクトを推進するために、最前線でひたすら走り続けてきたなと感じています。
12月も、もちろん来年もこの調子で走っていけるよう、自己研鑽を積んでいければと思います！

さて、そんな中で Gemini 3 Pro モデルの preview が発表されましたね！

https://blog.google/technology/developers/gemini-3-developers/

以前の2.5 Pro モデルから全体的な性能向上が行われているとのことで、その進化を徐々に感じていきたいところですが、今回はその中でも「Vibe Coding の性能向上」に対してスポットを当ててみようと思います。

なぜかといえば、PM にとってどうしても避けられないのが言葉だけの議論、いわゆる「空中戦」です。
以前 PM 向けの外部研修に参加させていただいた際、講師の方の言葉で印象に残ったのは、「IT の分野は他分野と比較しても圧倒的に要件定義の難易度が高い」という事実でした。
確かに、「言った言わない」や「なにかイメージと違う」といった認識のズレをいかに素早く、どう埋めるかという点は、私自身も常々課題と感じていました。

例えば交通インフラであれば、「トンネルを掘り始めてから開通先を変える」ということもないですし、「ここに駅を作ろう」となっても、細かな形は違えどほぼ同じ見た目を想像することができるかと思います。
しかし IT 分野においては、「見やすく使いやすい管理画面」「迷わない UI」「今風のモダンなデザイン」などなど、人によって感想が大きく異なる要因が多分に含まれていることから、言葉・文字のみでのコミュニケーションでは空中戦が発生しやすい状況となっています。

この「空中戦」を終わらせる最も確実な方法は、できるだけ早い段階で「動く画面（モノ）」を真ん中に置いて議論することです。
これまではそのとりあえずの画面を作るのにも、エンジニアのリソースや時間が必要でしたが、今回の Gemini 3 はどこまで意図を汲み取った目線合わせができる画面を作ってくれるのか、検証してみたいと思います。

そもそも Vibe Coding とは？

生成 AI に対して自然言語で指示を出し、対話しながらコードの生成や修正を行う新しい開発手法です。
従来のプログラミングのように厳密な文法を覚える必要がなく、「なんとなくこんな感じ」や「もっとカッコよく」といった「雰囲気（Vibe）」や「フィーリング」を伝えるだけで、AI が意図を汲み取って形にするため、プロトタイプ開発のスピードを劇的に向上させることができます。

実際に試してみた

今回は比較のため、Flash モデルにも同じプロンプトを与えて、アウトプットがどれだけ変わっているのかを含め確認してみます。

与えたプロンプトは以下のとおりです。

前提:
React と Tailwind CSS を使って、架空の『宇宙旅行予約サイト』の検索結果画面を作ってください。

要件:
・カード型レイアウト: 各惑星（火星、木星など）のカードには、写真（プレースホルダーで可）、価格、飛行時間、そして「残り座席数」を表示すること。
・動的なフィルター機能: 左側に「価格帯」「飛行時間」で絞り込めるサイドバーを配置し、実際に動作するようにしてください。
・デザイン: SF映画のような、ダークモード基調でネオンカラーを使った没入感のあるモダンなデザインにしてください。
・レスポンシブ: スマホでも崩れないようにしてください。

それでは結果を見ていきましょう。

Flash モデル

まずは Flash モデルの結果ですが、これだけでも十分に議論のたたき台として使える画面が生成されました。

注目すべきは、Gemini が気を利かせてくれた点で、プロンプトでは座席数の配色までは指定していなかったのですが、残り座席数が多い箇所を緑に、少ない箇所を赤く表示しています。
おそらく「こうしてユーザーを焦らせる演出が必要だろう」と、ビジネス的な意図を汲み取ってくれたものと思います。

デザイン面でも、「惑星名」と「価格」を大きく目立たせるなど、情報の見せ方にメリハリがあり、目線を合わせるためのベースとなる要素はきちんと含まれているように感じます。

Gemini 3

パッと見ただけで、先ほどと比べて「詳細に指示を出していない部分」に対する力の入り具合が違います。

例えばフィルター機能は、Flash モデルは標準的なラジオボタンを選択したのに対し、Gemini 3 は「価格や期間ならスライダーの方が使いやすいですよね？」とでも言うかのように、リッチなレンジスライダーを実装してきました。

また、施設名の命名やキャッチコピー（概要）の表示、さらには「初心者向け」「ラグジュアリー」といったタグ付けやレビュー評価、ログイン用の導線まで、「指示はされていないが予約サイトには必要だろう」という機能を自律的に補完しているように思います。これは、UI/UX への深い理解と提案力が Flash モデルと比較して高くなっていると感じました。

もちろんこれが正解ではありませんが、これをベースに議論を行うことで、ふわっとした言葉だけでのイメージのすり合わせは不要になり、本当に使いやすいかという中身の議論（地上戦）に、最初から全力を注げるようになります。

おわりに

今回、Gemini 3 での Vibe Coding を検証してみて、改めて進化のスピードと性能の高さに驚かされました。

やはり、頭の中にあるふわっとしたイメージを目に見える形にするだけで、議論のステージを不毛な「空中戦」から建設的な「地上戦」へと移すことができますし、
それを行間や背景を踏まえて一瞬で作り上げられるという点も、認識のズレを埋めるためのコストを劇的に下げてくれるはずです。

注意点として、生成されたコードがそのまま完成品になるわけではなく、あくまで目線を揃えるためのものであることは共通認識として持つ必要があります。
しかし、その点を差し引いても、議論の質とスピードを底上げしてくれるというメリットは計り知れません。
要件定義でより価値ある議論に時間を割けるように、私自身もこの手法による現場での試行錯誤を続けていこうと思います。

今年も残りわずかですが、Gemini 3 と共に、12月もそして来年も、プロジェクトの成功に向けて全力疾走していきます！