UI デザイン向け GPT Image 2.6 プロンプト。

[ランニングアプリ] のリアルなモバイルアプリ UI を作ってください。戻ってきたランナー向けのホーム画面：あいさつ「おはよう、Sam」、「18.4 / 25 km」を示す週間距離のリング、「ランを開始」のプライマリボタン、ルートマップのサムネイルとペース、タイムを載せた前回のランのカード、そして下部タブバー：ホーム、プラン、アクティビティ、プロフィール。すっきりした白い UI、エネルギッシュなオレンジのアクセント 1 色、明快なタイポグラフィ。iPhone の画面、端末のフレームはなし。

リアルなモバイルバンキングアプリの UI を作ってください。残高カード「$4,280.55」、クイックアクション「送金」「請求」「支払い」「チャージ」、そして店舗のロゴ、日付、金額が並ぶ最近の取引リスト。落ち着いたネイビーと白の配色、角丸のカード、ゆったりした余白。実際にリリースされているアプリのように見せてください。iPhone の画面、フレームはなし。

リアルなフードデリバリーアプリのホーム画面を作ってください：住所バー「お届け先：ヒル通り 24」、検索欄、カテゴリーチップ（ピザ、寿司、サラダ、デザート）、評価と配達時間付きのおすすめレストランのカード、そして「近くで人気」のリスト。温かく食欲をそそる写真、白い背景、赤のアクセント 1 色。iPhone の画面、フレームはなし。

[瞑想アプリ] のモバイルのオンボーディング画面を 3 枚、横に並べて作ってください：1) 穏やかなイラストと「1 日 5 分で、もっと上手に呼吸を」のウェルカム画面、2) 選べるチップで目標を選ぶ画面、3) タイムピッカーでリマインダーの時刻を選ぶ画面。一貫したやわらかいラベンダーの配色、角丸のボタン、進捗ドット。端末のフレームはなし。

リアルなメッセージアプリの会話画面を作ってください：オンライン表示付きの連絡先名「Maya」、本物らしい短いメッセージが交互に並ぶ吹き出し、共有された写真、波形付きのボイスメッセージの吹き出し、添付と送信のアイコン付きのメッセージ入力欄。ライトテーマ、青のアクセント。iPhone の画面、フレームはなし。

[メモアプリ] のリアルな iOS 風の設定画面を作ってください：アカウント、同期、表示、通知、プライバシー、ヘルプのグループ化されたリストで、右側に現在の値を表示し、iCloud 同期とリマインダーにはトグル、一番下に赤い「サインアウト」の行。ネイティブの iOS の見た目、ライトモード。iPhone の画面、フレームはなし。

タスクがひとつもないときの [タスク管理アプリ] のモバイルの空の状態の画面を作ってください：シンプルで親しみやすいイラスト、見出し「リストは空っぽです」、補足のテキスト 1 行、プライマリボタン「最初のタスクを追加」。ミニマルで、余白をたっぷり。iPhone の画面、フレームはなし。

[音楽プレーヤー] のダークモードのモバイル UI を作ってください：アルバムアート、曲名「Night Drive」、アーティスト名、時間表示付きのプログレスバー、再生コントロール、歌詞のプレビュー。深いチャコールの背景（真っ黒ではない）、ネオンシアンのアクセント 1 色、コントラストの高い文字。iPhone の画面、フレームはなし。

[プロジェクト管理 SaaS] のデスクトップ向けランディングページのヒーローを作ってください：上部にロゴとナビゲーション、見出し「進捗会議なしで、プロジェクトを出荷しよう」、サブ見出し、「無料で始める」と「デモを予約」の 2 つのボタン、その下にカンバンボードの大きなプロダクトのスクリーンショット。すっきりした白いレイアウト、バイオレットのアクセント 1 色、16:9、ブラウザのフレームはなし。

「Lena Ortiz」という名前のプロダクトデザイナーの、デスクトップ向けポートフォリオのトップページを作ってください：大きなエディトリアルな見出し、短い自己紹介、カバー画像とタイトル付きの 6 つのプロジェクトカードのグリッド、連絡先のリンク。オフホワイトの背景、黒のセリフ体の見出し、ミニマルでギャラリーのような雰囲気。16:9。

[陶器のコーヒーマグ] のリアルな EC 商品ページを作ってください：左に商品写真のギャラリー、右にタイトル、価格「$32」、カラーの見本、数量の選択、「カートに追加」ボタン、配送情報、レビューの概要「4.8（212 件のレビュー）」。温かみのあるニュートラルな配色。デスクトップ、16:9。

3 つのプランの料金セクションを作ってください：Free「$0」、Pro「$12/月」（「一番人気」として強調）、Team「$29/月」。各プランにチェックマーク付きの機能を 5 つずつ並べ、ボタンを付けます。「20% お得」と表示する月払い／年払いの切り替えも入れてください。すっきりした白い UI、グリーンのアクセント 1 色。16:9。

デスクトップ向けのブログ記事ページを作ってください：タイトル「ビルド時間を 70% 短縮した方法」、著者のアバターと日付、横長のヘッダー画像、中央のカラムに読みやすい本文、コードブロック、右側に目次。エディトリアルなスタイル、ゆったりした行間。16:9。

地元のレストラン「Olive & Ember」のトップページを作ってください：店名を載せた全幅の料理写真のヒーロー、営業時間、「席を予約」ボタン、価格付きの短いメニューのプレビュー、地図付きの所在地。温かく素朴で、上品なタイポグラフィ。デスクトップ、16:9。

2 分割のサインアップページを作ってください：左側はメールアドレス、パスワード、「アカウントを作成」ボタン、「Google で続ける」のフォーム、右側は短い推薦の声を添えたプロダクトのイラスト。すっきりと信頼感があり、青のアクセント。デスクトップ、16:9。

[AI ライティングアプリ] のモバイル向けランディングページを作ってください：見出し、サブ見出し、「無料で試す」ボタン、小さな UI プレビュー付きの 3 つの機能ブロック、推薦の声、フッター。幅 390 px、縦に長いスクロールのレイアウトを全体表示し、フレームはなし。

[旅行予約サイト] の親しみやすい 404 ページを作ってください：迷子のスーツケースの遊び心あるイラスト、見出し「このページは別の便に乗ってしまったようです」、検索欄、ホーム、目的地、ヘルプへのリンク。ブランドに合ったティールのアクセント、たっぷりの余白。デスクトップ、16:9。

リアルなアナリティクスダッシュボードを作ってください：左のサイドバーのナビゲーション、期間の選択、4 つの KPI カード（訪問者 48,210、登録 1,284、コンバージョン 2.7%、売上 $38.4k）、日別訪問者の折れ線グラフ、チャネル別の棒グラフ、上位ページの表。ライトテーマ、落ち着いた青の配色、本物のインターフェース要素。16:9。

「リード」「見込みあり」「提案」「受注」の列がある CRM の営業パイプラインボードを作ってください：会社名、金額、担当者のアバター、そのステージでの経過日数を載せた商談カード。上部に検索と「新規商談」ボタンのバー。すっきりしていて、情報量は多くても読みやすく。デスクトップ、16:9。

管理画面のユーザーテーブルを作ってください：検索、ロールとステータスのフィルター、「名前」「メール」「ロール」「ステータス」「最終アクティブ」の列、ステータスのバッジ（有効、招待中、停止中）、行ごとの操作、ページネーション。ニュートラルなグレーの UI、インディゴのアクセント 1 色。デスクトップ、16:9。

週表示のカレンダー Web アプリの画面を作ってください：左に月のミニカレンダーとカレンダーの一覧、メインに色分けされた予定が入った月曜から日曜までのグリッド、「作成」ボタン、そして 1 つの予定に開いた予定詳細のポップオーバー。ライトテーマ。16:9。

3 ペインのメールクライアントを作ってください：左にフォルダ、中央に差出人、件名、プレビュー、時刻が並ぶメッセージ一覧、右に返信ボタン付きの開いたメール。すっきりと見慣れた雰囲気、青のアクセント。デスクトップ、16:9。

デスクトップの AI アシスタントアプリを作ってください：チャット履歴のある左サイドバー、ユーザーの質問と、箇条書きとコードブロックを含む長い整形済みの回答が並ぶメインの会話、添付とモデル選択の付いたメッセージ入力欄。ミニマルでニュートラルな UI。16:9。

アプリのタブバー用のシンプルな線画アイコン 6 個のセット：ホーム、検索、ライブラリ、統計、プロフィール、設定。2px で統一した線、丸い線端と角、単色、文字なし、1 列に等間隔で並べる。

SaaS の Web サイト用の 2 色調の機能アイコン 8 個のセット：スピード、セキュリティ、連携、分析、コラボレーション、自動化、サポート、モバイル。同じグリッドと角の半径、2 トーンの青、文字なし。

[習慣トラッカー] のモダンなアプリアイコン：シンプルなチェックマークと炎の形を組み合わせ、コーラルからオレンジへのやわらかいグラデーションの角丸の正方形の中央に配置。フラットですっきりしていて、小さなサイズでも見分けがつき、文字なし。

同じスタイルの、シンプルな空の状態のイラスト 4 点のセット：メッセージなし、検索結果なし、ファイルなし、タスクすべて完了。フラットな図形、2 色、やわらかい影、親しみやすくミニマル、背景は透明。

「North Canvas」というデザインスタジオのミニマルなロゴ：幾何学的な北向きの矢印と四角いフレームを組み合わせ、横にすっきりしたサンセリフ体のワードマーク「North Canvas」を配置。単色で、明るい背景にも暗い背景にも合うもの。

[家計簿アプリ] の App Store 用スクリーンショットを 3 枚、横に並べて作ってください。それぞれアプリの UI を表示したスマートフォンの画面と、その上に大きなキャプション：「お金の行き先が見える」「本当に達成できる目標を」「使いすぎる前にお知らせ」。明るく一貫したブランドカラー、1290×2796 の比率。

[デザインツール] の「Canvas 2.0 登場」を告知するプロダクトのローンチバナー。傾けたアプリ UI のスクリーンショット、短いサブ見出し、「今すぐ試す」ボタン付き。すっきりしたグラデーションの背景、モダンなテック系のスタイル、16:9。

[メモアプリ] の新機能「ダークモードが登場」を告知する正方形の SNS 投稿。ライトとダークのアプリ UI を斜めの分割で並べて見せる。大胆な見出し、ブランドカラー、1:1。

「AI で UI をデザインする方法」というタイトルのブログ記事用の Open Graph 画像。左に大きな文字でタイトル、右にアプリ画面の小さなコラージュ。すっきりした背景、ブランドのアクセントカラー、1200×630。

[UI デザインプラグイン] の Product Hunt ギャラリー画像：見出し「コーディングエージェントの中でデザインする」、複数のアプリ画面が横に並んだキャンバスの大きなスクリーンショット、短いメリットのラベル 3 つ。すっきりとしてコントラストが高く、1270×760。

すっきりしたデバイスモックアップのシーン：明るいデスクの上のノートパソコンとスマートフォンに、それぞれ [自社アプリのダッシュボードとモバイルのホーム画面] を表示。やわらかい自然光、最小限の小物、プロダクトのマーケティング写真風、16:9。

モバイルの「カートに追加」ボタンがタップされる短いループアニメーション：少し縮んで緑に変わり、チェックマークが表示されたあと、元に戻る。フラットな UI スタイル、白い背景、余計な文字はなし。

カードのリストが読み込まれるループアニメーション：グレーのスケルトン表示が左から右へきらめき、その後アバターとテキスト付きの本物のカードがフェードインする。すっきりしたライトな UI。

設定のトグルがオフからオンに切り替わるループアニメーション：つまみが右にスライドし、トラックが緑で満たされ、小さなラベルが「オフ」から「オン」に変わる。ミニマルな UI、白い背景。

モバイルのフィードで引っ張って更新するループアニメーション：リストが下に引っ張られ、スピナーが現れて回転し、その後新しい項目が上からスライドして入ってくる。すっきりしたライトな UI。

画像 1 は現在のアプリ画面です。画像 2 はスタイルの参考です。画像 2 の色、タイポグラフィ、角の半径を使って、画像 1 のスタイルを変えてください。画像 1 のレイアウト、内容、文字はまったく同じに保ってください。

丸で囲んだボタンだけを変えてください。濃い緑のベタ塗りの背景に白いラベル「続ける」の、プライマリのスタイルにしてください。画面のそれ以外はすべてまったく同じに保ってください。

丸で囲んだ部分だけを推薦の声のカードに差し替えてください：顧客の写真、引用「リデザインを 1 週間でリリースできました」、名前「Priya N.」と肩書き「プロダクト責任者」。既存のスタイルに合わせてください。それ以外はすべてそのままにしてください。

添付したモックアップ画像を、[390×844] の自己完結した HTML ファイル 1 つとして作り直してください。CSS はインライン、フォントはシステムフォントです。レイアウト、余白、色、文字は正確に合わせてください。アイコンはインライン SVG で描いてください。