一文を打ち込めば絵が返ってくる場所が欲しかった。そのうち、その絵を動かしたくなった。
それが AI Media Studio の誕生の全経緯です。プレーンテキストのプロンプトを受け取り、Google の Gemini 画像モデルと Veo 動画モデルを使って、画像か短い動画クリップを返すWebアプリ。ノードグラフはなし。スライダーが12本並ぶコントロールパネルもなし。プロンプト欄と、いくつかのまともなつまみと、ギャラリーだけ。
この記事は、何ができて、どう作られているかのフィールドノートです。
できること
コアのループはわざと退屈にしてあります。プロンプトを書き、モデルを選び、形を選び、生成を押す。
画像は3つの Gemini 画像モデルで動きます。「Nano Banana」ファミリーというあだ名をつけました。
- Nano Banana（
gemini-3.1-flash-lite-image）：速くて軽い。まだ何が欲しいか分からない段階のスケッチに向く。 - Nano Banana 2（
gemini-3.1-flash-image）：バランス型のデフォルト。ディテールが増えて、それでも速い。 - Nano Banana Pro（
gemini-3-pro-image）：遅いが高忠実度。軽いモデルだと潰れてしまう込み入ったコンセプト向け。
動画は Veo（veo-3.1-lite-generate-preview）で動きます。動画生成は一瞬では終わらないので、アプリはステータスをポーリングして、ジョブがどこまで進んだかを見せます。生きているのか死んでいるのか分からないスピナーを眺めさせたりはしません。
どちらの経路も同じコントロールを共有します。
- アスペクト比：正方形 1:1、ワイド 16:9、スマホ向け縦長 9:16、それに 4:3 と 3:4。
- トグル：プロンプト強化、セーフティフィルター、解像度。
珍しいものは何もありません。この一握りの選択肢で、実際に作りたいもののほぼ全部をカバーできる、というのがポイントです。
プロダクトらしくした部分
空っぽのプロンプト欄は、人が思うよりずっと威圧的です。そこでアプリには、スタイル別に整理した厳選プロンプト集を同梱しました。フォトリアル、デジタルアート、サイバーパンク、建築、シネマティック。ランダムなプロンプトを欄に放り込むシャッフルボタンもあります。
どちらの機能も技術的には面白くありません。でもこの2つが、「開いてすぐ閉じた」と「開いて6枚作った」の分かれ目になります。
もうひとつがギャラリーです。生成した画像と動画はタブ分けされたグリッドに並びます。何かをクリックするとライトボックスが開き、フル解像度の結果、ズーム、そして後で効いてくるメタデータが見られます。プロンプト、モデル、アスペクト比、生成日時。そこから PNG、JPEG、MP4 をワンクリックでダウンロードでき、プロンプトをコピーして手を加えることもできます。
このメタデータが、結局いちばん使う機能になりました。生成メディアの仕事の半分は、うまくいったときに何を打ったかを覚えておくことです。
どう作ったか
賢いことは何もしていません。それが好みです。
- Next.js 15（App Router）と React 19。
- スタイリングは Tailwind CSS。メニュー、ダイアログ、トグルの下には Radix UI のヘッドレスコンポーネント。
- モデル呼び出しは
@google/genai。これらはサーバー側の API ルートに置いています。画像生成、動画ステータスのポーリング、ダウンロードをブラウザへストリーミングで返すもの、の3本。モデルの API キーはクライアントに一切触れません。 - ルート遷移や、メディアアプリをフォームっぽく見せないための小さな動きは Framer Motion。
- アイコンは Lucide。
ダークテーマとライトテーマはどちらも一級市民です。ヘッダーは上部に固定され、長いギャラリーをスクロールしてもモデルとアスペクト比のコントロールに手が届きます。
学んだこと
モデル選択はドロップダウンであるべきで、意思決定であってはならない。 初期には3つの画像モデルの違いを UI で説明しようとしました。誰も読みません。今は名前自体がヒントを持ち（lite、デフォルト、pro）、同じプロンプトを2つのモデルで生成してみれば、みんな自分で理解します。
ポーリングは UX の機能。 動画では、「生成中…」と「生成中、5ステップ中3、あと約40秒」の差が、信頼と閉じられたタブの差です。
キーはサーバーに置く。 当たり前ですが、言っておく価値はあります。Gemini や Veo へのすべての呼び出しは API ルートを経由します。ブラウザは認証情報を一度も目にせず、レート制限とログを一箇所でまかなえます。
メタデータがプロダクト。 プロンプト、モデル、比率、タイムスタンプを表示するライトボックスは半日で作れて、他の何よりも使われています。
試してみる
image-video-factory.ai.studio で公開中です。何かばかげたことを打ち込み、16:9 を選んで、Nano Banana 2 が「夜明けのサイバーパンクな麺屋台、濡れたアスファルト、ネオンの反射」をどう描くか見てみてください。それから Veo に動かしてもらいましょう。
いいものができたら、プロンプトをコピーしておくこと。未来の自分が欲しがります。