Image Tool
ビジュアルを構築する前に AI と方向性をすり合わせ、製品画像を生成してそのままコードベースに保存します
Image Tool を使えば、製品づくりのプロセスに画像を組み込めます。コードを書く前に AI とデザインの方向性をすり合わせ、複数のバリエーションを展開して最適なものを選び、プロジェクトに必要な最終的な製品画像とアセットを生成できます。生成された画像はすべて適切なカテゴリのもとでリポジトリに保存されるため、ビジュアルはそれを使うコードのすぐ隣に置かれます。
Image Tool でできること
- 構築前にデザインをすり合わせる。 実装を始める前に、AI と一緒に参照モックアップを作成し、チームでビジュアルの方向性に合意します。
- 複数バージョンを生成してから選ぶ。 同じプロンプトに対して複数のバリエーションをリクエストし、最初の結果に飛びつくのではなく並べて比較します。
- 製品画像とアセットを生み出す。 方向性が固まったら、同じ会話をアイコン、ヒーロー画像、イラスト、OG カード、マーケティングビジュアルの供給源に変えられます。
- 整理した状態でコードベースに保存する。 Verdent は生成した各画像を、カテゴリ分けされたフォルダのもとでリポジトリに保存するため、長期的な管理がすっきり保たれます。
使い方
必要なものを伝える
チャットで Verdent に必要な画像を伝えます。例えば 「料金ページ用のヒーローイラストを3案、フラットスタイルで、ブルー／バイオレットの配色で作って」 のように。参照画像、スクリーンショット、既存のロゴを添付して AI に活用させることもできます。
バリエーションを生成してすり合わせる
Verdent は複数のバージョンを並べて返します。構図、配色、トーンを比較します。「#2 はそのままで、背景を明るくして」 のように調整を依頼して反復し、チームで方向性が合うまで進めます。
方向性を固めてアセットを生成する
勝ち案を選んだら、それを参照として再利用し、製品画像のフルセットを生成します。アプリアイコン、バナー、アプリ内イラスト、OG 画像、ソーシャルクリエイティブ。セット全体でスタイルが一貫します。
コードベースに保存する
保存先を確認、または上書きします。Verdent は画像をカテゴリ分けされたフォルダのもとでリポジトリに書き込むため、コードと一緒に出荷され、バージョン管理下に保たれます。
別のパネルを開く必要はありません。チャットで画像を依頼するだけで、Verdent が自動的にリクエストを Image Tool に振り分けます。
保存と整理
Image Tool は生成した画像を、ブラックボックスのギャラリーではなくプロジェクトに直接保存します。Verdent はプロンプトからカテゴリを推測して保存先フォルダを選ぶため、アセットを長期的に見つけやすく、管理しやすくなります。
デフォルトのレイアウト
your-project/
└── assets/
└── images/
├── drafts/ # Early alignment drafts and explorations
├── icons/ # Product icons and glyphs
├── illustrations/ # In-app illustrations and empty states
├── marketing/ # Social, ads, OG images
└── references/ # Uploaded reference images- 自動カテゴリ分け。 Verdent はプロンプトからカテゴリを推測します。例えば 「…用のアプリアイコン」 →
icons/、「ランディングのヒーロー…」 →marketing/。 - 生成ごとの上書き。 パスを明示的に指定すれば — 「
public/og/に保存して」 — Verdent はそれに従います。 - バージョン管理対応。 保存された画像はリポジトリ内の通常のファイルです。他のアセットと同じようにコミット、差分確認、レビューができます。
- 再オープン可能。 保存された各画像は作成に使ったプロンプトと設定を保持するため、後から同じ方向性を再開できます。
プロジェクトごとに別のデフォルトフォルダを使いたいですか？一度 Verdent に伝えるだけで — 「これ以降、画像はすべて src/assets/img/ のもとに保存して」 — 今後の生成のために記憶します。
ヒント
大規模に生成する前にすり合わせる。 最初に3〜4案のドラフトを短く検討しておくと、フルアセットセットの制作を始めてからの手戻りを大きく減らせます。
勝ち案を参照として再利用する。 承認済みのドラフトを参照として戻すことで、すべての新しいアセットがそれと視覚的に一貫します。
サイズとユースケースを具体的に指定する。 「1024×1024 のアプリアイコン、透明背景、フラットスタイル」 は 「アイコン」 よりはるかに良い結果を生みます。