App や SaaS を出荷するとき、デザインカレンダーが最も詰まるのは 3 種類のビジュアル：スプラッシュ / 起動画面、機能訴求カード、空状態イラスト です。Figma のコンポーネントは揃っているのに、ストアスクリーンショットや Onboarding 用のビジュアルが足りない。外注は 1 ラウンド 1 週間、コピー改稿のたびに追いつかない。
Image 2 には、こうしたニーズを UI ビジュアルスロット生産ライン として扱う方が合います——ブランドカラーとタイプ階層を先に固定し、スプラッシュ → Onboarding → 機能カード → 空状態 → 設定モック → ストアフレームの順で出す。本記事では 6 組の実測 image-2 プロンプトで、レビューに出せる App / UI 画面 を一括生成する方法を共有します。
プロダクトデザインのプレイブックとして使う：1 フレーム 1 ジョブ、コピーは verbatim、書き出し前にボタンとタイトルのスペルを確認。
📌 以下のプロンプトは英語中心（Image 2 は構造化英語と画面内テキストが安定）。UI コピー、商標、アクセシブルなコントラストは人手で校正してください。最終仕上げは Figma で 8pt グリッドと実コンポーネントに合わせるのが望ましいです。
1. Image 2 が「App / UI 画面」向きな理由
汎用イラストモデルに運任せするより、Image 2 が勝るのは次の点です：
-
画面内テキストが読みやすい — スプラッシュ見出し、3 行の機能カード、空状態 CTA——公開ベンチマーク約 99% の文字レンダリングは、「生成してから PS で文字を貼る」より AI 界面図 納品に合います。
-
多ラウンド編集でコピー差し替え、レイアウトは崩さない — PM が Onboarding の 1 行を変えたら、チャットでその行だけ置換し、イラストとボタン形状は維持——Image2 の会話型編集がここで光ります。
-
スタイル制約をデザインシステムのフィールドにできる — ブランド HEX、角丸、シャドウ強度、イラストスタイル（flat / soft 3D）を各 prompt に書けば、シリーズ全体が 1 つの Design System に見えます。
プロダクトとデザインの協業者にとって、UI ビジュアル資産は情報アーキテクチャから生成できる——イラストカレンダーを待つ必要はありません。
2. 標準ワークフロー（5 ステップ）
-
UI ビジュアルスロットを列挙 — 最低 6 つ：① スプラッシュ/起動 ② Onboarding ページ ③ 機能訴求カード（3 点）④ 空状態 ⑤ 設定/プロフィールモック ⑥ App Store / ストアスクリーンショットフレーム。1 枚にフル操作可能な App を詰め込まない。
-
ブランドとタイプ制約を書く — プライマリ/セカンダリカラー、ライト/ダーク背景、タイトル文字数上限。商標付き OS クロームの偽造は避ける（汎用ステータスバーで十分）。
-
1 フレーム 1 ジョブ + verbatim コピー — 各フレームは 1 つのユーザー疑問に答える：初回起動の印象は？なぜ残る？データがないときは？ストアではどう見せる？
-
アスペクト比を統一 — スプラッシュ/ストアは 9:16 が多い；機能カードは 1:1 または 4:5；セット内は 1 つの比率ファミリーに揃える。
-
Figma 前の 3 チェック — スペル、コントラスト、角丸と DS のズレ——Image 2 の多ラウンド編集で直し、フル再抽選は避ける。
3. 6 組の実測 UI プロンプト（コピペ可）
例示プロダクト：架空の生産性 App「FlowDay」。名前とベネフィットは自社に差し替え。各 prompt にブランドアクセントを固定（例：#4F46E5 indigo）。
スロット 1：スプラッシュ / 起動画面
シーン：コールドスタートのブランド印象——中央マーク + 短いタグライン。
App splash / launch screen mock with Image 2 for mobile UI.
Vertical 9:16, clean modern iOS-like frame (generic status bar, no trademarked icons).
Centered app mark: simple indigo rounded-square icon with white "F" monogram.
Headline exactly: "FlowDay"
Subline exactly: "Plan less. Finish more."
Background: soft indigo-to-white gradient, subtle geometric glow, ample padding.
Sharp legible type, Image2 text accuracy, premium SaaS look.
Do not clutter with fake notifications. No watermark.
結果：レビューに出せる App スプラッシュ ビジュアル。
スロット 2：Onboarding 単一ページ
シーン：初回起動の価値ページ——コピー + イラスト。
Mobile onboarding screen UI mock using Image 2.
Vertical 9:16, light mode, generous bottom padding for a primary button.
Top illustration: soft 3D calendar and checkmarks, brand color #4F46E5 accents.
Title exactly: "Your day, in one timeline"
Body exactly: "Drag tasks into focus blocks. FlowDay keeps priorities visible."
Primary button label exactly: "Continue"
Keep layout airy, 8pt rhythm feel, Image 2 commercial UI quality.
Do not invent extra menus. Do not misspell.
結果：Onboarding のコピーとアートが 1 ユニット——A/B 文案の高速テスト向け。
スロット 3：機能訴求カード（3 点）
シーン：サイトの機能行やペイウォール上部の 3 等分カード。
App feature benefit cards board with Image 2 (UI marketing).
1:1 or 4:5, white background, three equal cards in a row with soft shadow.
Card icons in #4F46E5. Exact English labels:
Card1 title: "Focus Blocks" / line: "Timeboxed deep work"
Card2 title: "Smart Reminders" / line: "Nudge only what matters"
Card3 title: "Weekly Review" / line: "See progress at a glance"
Modern SaaS marketing UI, crisp type, Image2 text accuracy.
No fake App Store badges. No overcrowded icons.
結果：構造化された 機能カード——文字精度が最も効く 1 枚。
スロット 4：空状態画面
シーン：タスク/通知なし——「壊れた」ではなく、フレンドリーなガイド。
Empty-state mobile screen with Image 2 for product UI.
Vertical 9:16, light gray background, large friendly illustration center:
soft 3D empty inbox with a single indigo plus badge.
Title exactly: "Nothing here yet"
Body exactly: "Create your first focus block to start the day."
Secondary text button exactly: "Create task"
Clean, calm, accessible contrast, Image 2 UI illustration quality.
Do not make it look like an error. No scary red alerts.
結果：空状態が空白ではなく、アクション可能になる。
スロット 5：設定 / プロフィールモック
シーン：ステークホルダーに IA を見せる——非インタラクティブで可。
Settings / profile screen mock with Image 2 (non-interactive UI visual).
Vertical 9:16, light mode list UI, rounded group cells.
Header: avatar circle + name "Alex Chen" + plan chip "Pro".
List rows with exact labels: "Notifications" / "Calendars" / "Appearance" / "Export Data".
Accent switches and chevrons in #4F46E5, generous spacing, SF-like but generic typography.
Image2 clean UI mock quality. Do not copy real iOS glyphs trademarked details.
No tiny unreadable text.
結果：会議に十分な設定モック。タップ可能なふりはしない。
スロット 6：ストアスクリーンショットフレーム（デバイス付き）
シーン：リスティング素材——端末フレーム + 主要 UI + 上部キャプション。
App Store screenshot composition with Image 2.
Vertical 9:16 marketing frame: large caption on top, phone device mock below.
Caption exactly: "Focus blocks that actually stick"
Inside the phone: a clean task timeline UI using brand #4F46E5, legible list titles.
Soft studio shadow under device, light gray backdrop, premium DTC style.
Image 2 commercial ASO visual. Exact text, no gibberish.
Do not invent fake star ratings. Do not overcrowded stickers.
結果：ASO 方向フレーム；後で Figma で実スクリーンショットに差し替え。
4. 汎用穴埋めテンプレート
スロットごとにジョブ行と画面内コピーのみ変更：
Image 2 App / UI visual slot.
Brand lock: primary #[HEX], [light|dark] mode, [flat|soft-3D] illustration style.
Frame job (ONE only): [splash / onboarding / feature cards / empty state / settings mock / store screenshot].
Aspect: [9:16 | 1:1 | 4:5].
On-image copy exactly: "[titles/buttons]" — verbatim, no extra claims.
Do not: [fake OS trademarks / unreadable microcopy / cluttered chrome].
Output: review-ready UI visual, Image2 quality.
5. 外注イラスト vs Image 2 UI スロット vs アイコンコラージュ
| 観点 | 外注イラスト一式 | Image 2 UI スロットライン | アイコン / スクリーンショットコラージュ |
|---|---|---|---|
| コピー改稿速度 | 遅い（再描画） | 速い（多ラウンド 1 行） | 速いが安っぽい |
| デザインシステム一貫性 | Brief 次第 | HEX / スタイルフィールドで固定 | ドリフトしやすい |
| 最適な段階 | ブランド大型バージョン | 週次イテレ、レビュー、ASO 初稿 | 社内ドラフトのみ |
| 主なリスク | スケジュール | タイポとグリッドの人手校正必須 | コンバージョン / 仕上げギャップ |
6. 誰がこの方法を使うべき？
✅ PM / プロジェクトリード
レビュー前に Image 2 でスプラッシュ、空状態、ストア方向を埋める——「空白のまま」のスライドを減らす。
✅ UI / UX デザイナー
image-2 をビジュアル探索レイヤーとして：色とタイプを固定し、生成後 Figma で実コンポーネントに合わせる。
✅ インディー開発者 / 小規模チーム
専任イラストレーターがいなくても、1 系統の prompt で統一感のある App スプラッシュ と機能カードが作れる。
✅ グロース & ASO オペレーション
ストアキャプションは頻繁に変わる——多ラウンド編集は端末フレーム全体の作り直しより速い。
7. よくある 3 つの失敗パターン
-
❌ 1 枚でフル操作可能な App を偽装 — Image 2 は UI のスープ化する。スロットで分割；インタラクションプロトタイプは Figma/コードへ。
-
❌ 「some feature text」のような曖昧コピー — タイポのドリフトが UI デザイン 納品を殺す。タイトルとボタンは
exactly: "..."必須。 -
❌ 商標 OS 詳細の偽造 + コントラスト未チェック — 汎用ステータスバーで十分；書き出し前にライトオンライトのアクセシビリティを確認。
8. まとめ
App / UI ビジュアル向け Image 2 は「もっと派手な 1 枚を抽選」ではなく、ブランド固定 → UI スロット → verbatim コピー → 多ラウンド仕上げ → Figma 完成 です。
次にスプラッシュ、機能カード、空状態が足りないとき、ストック素材のコラージュは避けてください。Image2 ワークベンチを開き、本記事の 6 スロットを実行——統一感があり読める AI 界面 セットが、レビュー、イテレ、ストアフレームの起点として使えます。
スプラッシュがブランドを立て、カードが価値を語り、空状態が次の一歩を示す——それが image-2 のプロダクトデザインループです。
実践メモ；プロンプトは自由にコピー・改変可。出荷前にコピー、商標、ストアスクリーンショット規約を確認してください。
