画像スタジオ

モデル

プロンプト2,569 / 1,000

{
  "type": "ダークモード SaaS アナリティクスダッシュボード UI",
  "product": {
    "brand": "[AICode]",
    "theme": "繊細なグラデーション、柔らかなグロー、角丸カード、極細ボーダー、モダンな開発者ツール風のダークネイビーグラスモーフィズムインターフェース"
  },
  "canvas": {
    "aspect_ratio": "16:9",
    "background": "かすかなビネットとソフトなラジアルライトを伴うディープミッドナイトブルー"
  },
  "layout": {
    "structure": "左側サイドバーおよびメインコンテンツエリア",
    "sections": [
      {
        "title": "サイドバー",
        "position": "左側",
        "count": 8,
        "labels": ["AICode", "Overview", "Projects", "AI Assistants", "API & Usage", "Code Quality", "Team", "Settings"],
        "details": "上部にロゴ、紫色のハイライトで選択されたOverview、下部にPro Plan・残り12日で更新・75%の水平プログレスバーを表示するサブスクリプションカード、最下部にアバター付きユーザープロフィール、[Alex Morgan]、メール alex@morgan.dev"
      },
      {
        "title": "ヘッダー",
        "position": "メインエリア上部",
        "count": 4,
        "labels": ["Welcome back, Alex 👋", "Here's what's happening with your AI coding platform today.", "May 12 – Jun 12, 2024", "Export Report"],
        "details": "左側に大きな挨拶文、右側に日付範囲ピッカーとエクスポートボタン"
      },
      {
        "title": "メトリックカード",
        "position": "ヘッダー下の最上段",
        "count": 4,
        "labels": ["Total Users", "Active Projects", "API Calls", "Code Quality Score"],
        "values": ["12,842", "2,153", "1.28M", "876"],
        "details": "各カードに小型カラーアイコン、大きな主要数値、vs Apr 12 – May 12, 2024 の比較テキスト、増加率 14.6%, 8.3%, 23.7%, 5.9%、下部にミニスパークラインチャート。アクセントカラーは紫、緑、アンバー、青"
      },
      {
        "title": "メインアナリティクスパネル",
        "position": "中段および下段",
        "count": 4,
        "labels": ["API Calls Over Time", "Top Projects", "User Activity Heatmap", "Code Quality Trends"],
        "details": "API Calls Over Time は Daily ドロップダウンと約250Kで終わる紫の折れ線を描いたワイドエリアチャート。Top Projects はプログレスバーと変化率付きの5項目ランキング。User Activity Heatmap は12 AMから9 PMのラベル付き7段ウィークリーヒートマップ。Code Quality Trends は Weekly ドロップダウンと70から90台前半へ上昇する紫ラインの折れ線グラフ"
      },
      {
        "title": "トッププロジェクト一覧",
        "position": "中央右パネル",
        "count": 5,
        "labels": ["AI Code Assistant", "Smart Refactor", "Code Review Bot", "Doc Generator", "Test Builder"],
        "values": ["485K", "321K", "214K", "132K", "98K"],
        "details": "上位4項目は緑のプラス変動（+12.4%, +8.7%, +3.1%, +6.8%）、Test Builder は赤のマイナス変動 -1.2%。各行にカラーアイコンと薄いプログレスバー"
      }
    ]
  },
  "style": {
    "visual_language": "プレミアムフィンテックおよびAI開発者向けツールデザインモックアップ",
    "rendering": "シャープで高解像度のUIモックアップ、繊細なドロップシャドウ、ネオンエッジライト、洗練されたチャート、クリアなサンセリフタイポグラフィ",
    "primary_accent": "[エレクトリックパープル]",
    "secondary_accents": ["エメラルドグリーン", "アンバーイエロー", "シアンブルー"],
    "density": "情報豊富で余白のあるレイアウト、調和の取れたモジュラーグリッド、高い可読性"
  }
}

Ctrl / ⌘ + Enter

参照画像0 / 16

アスペクト比

品質

解像度

画像の数

1 / 4

結果

プロンプトから始める

生成された画像がここに表示されます。

インスピレーションを得る