JSON:Nano Banana Proで完璧な画像を構築する方法

AI研究
この記事は約11分で読めます。

Nano Banana ProにおけるJSON活用の革新性を解説する動画である。従来の自然言語プロンプトとは異なり、JSONという構造化された形式を用いることで、AIモデルに対して機械可読なパラメータを明示的に与えることができる。この手法は、マーケティング画像やUI設計など、高度な正確性が求められる用途において特に有効である。Nano Banana Proは「バイブマシン」ではなく精密な「レンダラー」として機能し、JSONスキーマを通じて複数のビジュアル文法(写真、図表、UI)を横断的に扱える点が最大の特徴となっている。構造化されたパラメータにより再現性とバージョン管理が可能となり、プロフェッショナルな制作環境においてNano Banana Proをツールとして活用する道が開かれる。

JSON: How I Build Perfect Images in NanoBanana Pro
My site: Story w/ Prompt:

JSONプロンプティングの秘密

皆さんに秘密を教えましょう。私はNano Banana ProをJSONプロンプティングと組み合わせて使っており、素晴らしい結果を得ています。ネイト、JSONって何なのと思うかもしれませんね。JSONは単にパラメータを定義するコンピュータ言語です。私がやっているのは、モデルに機械可読なパラメータを与えているだけなのです。

そして私はプロンプトを書きました。つまり、Nano Banana用のJSONを書くためにJSONを知っている必要はないということです。欲しいものを平易な英語で説明すれば、私が書いた翻訳機がそれをJSONに変換してくれます。それによってNano Bananaに多くの構造を与えることができるのです。

でも、なぜそうするのか。ネイト、これは万能なプロンプト手法なのかと思われるかもしれません。答えはノーです。万能なプロンプト手法ではありません。その理由は、プロンプトの仕様化は自分が何を望んでいるかが確実な場合にのみ機能するからです。

JSONが適さない場合もある

モデルを使う多くのケースでは、実際に私たちが望んでいるのはモデルに創造的になる余地を残すことです。そのような状況ではJSONは積極的に悪影響を及ぼします。また、JSONがモデルをプロンプトする唯一の正しい方法だというのは客観的に真実ではありません。一部のTwitterハイプスターがそう主張しているのを見たことがありますが、それは単に事実ではないのです。

モデルは非常に多くの言語で訓練されています。様々な方法でうまくプロンプトできます。JSONが有用なのは、重要な提案について自分が何を望んでいるかを明確にする場合です。つまり、特定の外観を持つ飲料缶が必要で、モデルが特定のものを身につけていなければならず、照明も特定の方法でなければならないマーケティング画像が必要な場合、それはJSONプロンプトなのです。

おかしく聞こえるかもしれませんが、それがJSONなのです。UIがあって、それを非常に具体的に定義し、色を正確に正しくしたい場合、それはJSONプロンプトです。だからこそNano Banana ProがJSONで非常に興味深いのに、私たちはそれについて十分に話していないのです。なぜならNano Banana Proはレンダラーだからです。バイブマシンではありません。

レンダラーとしてのNano Banana Pro

Midjourneyはバイブマシンです。ネオンのサイバーパンクなスキーマが欲しいと言えば、Midjourneyはそれをバイブで表現します。Nano Banana Proは自分が何をしているかを考え、非常に精密です。正確性によって成り立っているのです。JSONはそれに正確性を与えます。明確性を与えるのです。

Nano Bananaを最も強力にしているものの一つは、そのコンポジション制御です。同じシーンの周りでカメラをピボットさせることができます。異なるテーマ、異なるレイアウト、異なる表記法を使うことができます。JSONはそのすべてを明示的にするため、シーン周りのカメラを制御するために変更できる実際の人間が読めるプロパティが存在するのです。

これにより画像内の各重要なものに安定したハンドルが与えられます。環境とは異なる被写体を持つことができます。UIの中で独特のコンポーネントIDを持つことができます。そしてこれらのハンドルが存在すると、それが実際にJSONスキーマが提供するすべてなのですが、再生成してくださいと言えます。ただしこの一つだけを触ってくださいと。

そしてそこでNano Bananaが輝くのです。シーン全体を再びモデルに渡すのではありません。Nano Bananaが理解するコンピュータスキーマを通じて、非常に範囲を限定した変更を求めているだけなのです。

複数のビジュアル文法への対応

Nano Bananaはまた多くの多くのビジュアル文法にまたがっており、スキーマを使えばそれらの文法を本当にクリーンに交換できます。つまりNano Bananaは単なる写真アプリではありません。単なるUIアプリでもありません。複数の文法にまたがっています。写真であったり、図表であったり、UIであったりできます。

これらのビジュアル文法はそれぞれ、表面レベルの語彙をほとんど共有していませんが、パターンは共有しています。各ドメインには一連のコアエンティティと、それらのエンティティが関係する厳格な方法があります。そしてJSONスキーマは、マーケティング画像や図表やUIの基礎となるビジュアル文法を特定するのに役立ちます。

言い換えれば、これら三つすべてが、名前付きフィールドを持つ構造化されたブロブを取得し、あなたの仕事はそれらのフィールドを尊重することだという考えに応答するのです。Nano Bananaはそれを使って写真を作成できます。それを使って図表を作成でき、それを使ってUIを作成できます。

特に価値があるのは、Nano Banana Proが実質的に正確性をレンダリングするこの能力を使って、これらすべてのドメインにわたって機能できることです。そしてJSONを使えば、あなたもこれらすべてのドメインにわたって作業できます。私はJSONを使ってクールなマーケティング画像を作成できます。クールなマーケティング画像を作成できるとは思っていませんでしたが、どうやらできるようです。なぜなら私はNano Bananaの管理方法を理解しているからです。

ツールとしてのNano Banana Pro

スキーマは基本的にNano Banana Proをおもちゃではなくツールに変えます。Nano Banana Proがデザインツールやコード生成を伴う本当に真剣な製品スタックの内部に位置するなら、再現性が必要です。つまり、まったく同じ画面を再び出してくださいということが可能である必要があります。

差分が必要です。つまり、V3とV4の間でこのプロンプトで何が変わったかを見せてくださいということです。プロンプトが信頼できる再現可能な方法で機能したかどうかを実際にテストする能力が必要です。それがJSONスキーマが提供するものです。なぜなら、JSONをバージョン管理して、JSONにこの一つを追加しましたと言えるからです。

前回の実行とこの実行の間で何が異なったかを見てください。このUIのタップターゲットを44ピクセル未満に減らさないでくださいといったルールを強制できます。それがJSONスキーマの一部になります。アクセシビリティのようなものを実際にJSONスキーマにエンコードできるのです。

Nano Bananaは実質的に、デザイナーがプロンプトを入力して素敵な画面を作りましたと推論し統治できるものになります。見栄えの良い何かがあると思いますが、誰もなぜかわからないという状況ではなくなります。より決定論的な仕様のセットを持ちたいのです。そして正確性を重視する画像レンダラーであるNano Banana ProとJSONスキーマの組み合わせが、そこに到達するのを助けてくれます。

実際のワークフローの例

実際のフローがどのように見えるかをお見せしましょう。人間は何か乱雑なことを言います。ダークテーマのモバイル習慣トラッカーアプリが必要で、頭の中に三つの画面とカレンダービューがあります。NotionとDuolingoが出会ったような感じにしたいのです。

ここで私が構築しているようなプロンプトがあれば、LLMがそれを解釈します。あなたのデザイン慣習を適用します。画面、コンポーネント、トークン、レイアウトプリミティブを含むJSONスキーマを埋めます。そしてそれをレビューさせてくれます。

それを見て、ああ、そうですね、これは良さそうだと言えます。そしてそれをNano Banana Proに渡してレンダリングできます。そしてそのすべての詳細がNano Banana Proが拾い上げるためにそこにあります。変更が必要な場合は、一度に一つのフィールドを交換するだけです。

このアプローチの美しい点の一つは、JSONに慣れていない人々が、世界で最も価値のあるスキルの一つだと私が信じているもの、つまり疑似コードを読むことを学ぶのを助けることです。このJSONブロブのような疑似コードは本当のコードではありません。単にコードのように見えるだけです。それはAIが読んで理解し真剣に受け止めることができる洗練されたリストに過ぎません。

それを読むことを学べば、AIが重視する構造化された入力の種類を読むことができる人になります。ご想像の通り、それは最近のキャリアに役立ちます。しかし、ワークフローの観点からのより大きな価値は、あなたが人間として現在の好みを保持できることです。

作業を説明するために段落を書くのが好きなら、それができます。箇条書きが好きなら、それができます。そしてそれを私が構築したJSON変換プロンプトを持つLLMに渡すことができ、実際にJSONがそこにある完全な出力を得ることができます。そしてそれを読むことができます。修正できます。モデルに直接渡すこともできます。

エイリアンUIの実践例

さて、ネイト、これはすべてどう機能するのか、例を見せてくれるかと思われるかもしれません。あなたはただカメラに向かって話しているだけです。はい、できます。私が非常に非常に短いテキストをどのように変えたかをお見せしましょう。通常使うよりも短いものを、本当に興味深い新しいクリエイティブなインターフェイスに変えました。

さあ、ここにいます。これは実際のJSONスキーマです。私が与えたのは、エイリアンについての非常にクリエイティブなUIのための埋められたJSONテンプレートで応答してくださいということだけです。JSONのみで応答してください。それはUIについて私が通常与えるものよりもはるかに少ない、8トークンのようなものです。通常はもっとずっと多く与えるのですが、それを追加するだけでどれだけの力があるかをお見せしています。

そしてJSONテンプレートを与えると、それは長いJSONテンプレートです。延々と続きます。お分かりいただけると思います。完全なJSONテンプレートで応答します。すべて埋められています。エイリアンUIがどのように見えるかを想像しています。もっと具体的にしたかったら、ここにもっと具体的なものを埋めたでしょう。

しかし、これらすべてが何のためにあるかについて非常に明確であることがわかります。そして最後まで行って、完了ですと言います。そしてこれが私が最初に得たものです。実際にお見せします。初回を通じて、これについてどう思いますかと言いました。

ちなみに、私がファーストコンタクトを開始すると言ったか、JSONがそう言ったことにお気づきでしょう。まさにそこにあります。これは非常に忠実な表現であり、モデルは実際にそれを非常に忠実で完璧に指示に沿っていると評価しました。もっと良くできると思いました。

Google AI Studioに行ってこれを貼り付け、このJSONに忠実に従ってこのデザインの構築可能なワイヤーフレームを作成してくださいと言いました。なぜなら、角度が傾いているのは実際には私が望んでいたものではないと思い、プロフェッショナルであることを思い出させたかったからです。それは私が上に少し指示を追加しているのですが、まったく同じJSONです。

非常に素晴らしい忠実なJSON応答が得られる様子をご覧ください。これをすべて読みます。長い応答です。それを考え抜き、今や完璧な高忠実度を与えてくれました。これはまさにそれがどのように見えるかという再現可能なワイヤーフレームです。

この再現性をご覧ください。これは本質的にまったく同じ画像です。単にプロフェッショナルなワイヤーフレームとして前傾して行われているだけです。再現性が得られます。これらの両方で非常に非常に簡単にファーストコンタクトを開始できます。

私のポイントはエイリアンのユーザーインターフェイスを構築することではありません。私のポイントは、JSONを使用し、それをツールとして真剣に受け止めれば、Nano Banana Proのプロフェッショナルユースケースでさらに前進できるということです。なぜなら、それは精度に応答し、正確性を重視するからです。

JSONツールの提供

ですから私はこのJSON部分、JSON翻訳機に踏み込んだたくさんのプロンプトをSubstackに掲載します。なぜなら、あなた自身でこれができるようにしたいからです。写真、マーケティング写真、他の種類の写真でこれができるようにしたいのです。ユーザーインターフェイスでこれができるようにしたいですし、図表でこれができるようにしたいのです。

私たちが与えられたツールを実際に使用できることが重要だと思います。そしてその一部は、それらがどのように機能するかを発見することです。そして私は、JSONがNano Banana Proにとって過小評価されている付加価値だと思います。ですから飛び込んでください。コードを恐れないでください。本当のコードではありません。疑似コードです。そしてLLM翻訳機があなたを大いに助けてくれます。乾杯。

コメント

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