黑暗AI編碼儀表板UI

A polished dark-mode analytics dashboard for an AI coding platform, suitable for SaaS product design mockups, admin panels, and data-rich web UI presentations.

{
  "type": "暗色SaaS分析儀表板使用者介面",
  "product": {
    "brand": "{argument name=\"brand name\" default=\"AICode\"}",
    "theme": "深海軍藍玻璃擬態介面，帶有細微漸層、柔和發光、圓角卡片、細邊框、現代開發者工具美學"
  },
  "canvas": {
    "aspect_ratio": "16:9",
    "background": "深午夜藍，帶有輕微暈影和柔和的放射狀照明"
  },
  "layout": {
    "structure": "左側邊欄加主要內容區域",
    "sections": [
      {
        "title": "邊欄",
        "position": "左側",
        "count": 8,
        "labels": ["AICode", "概覽", "專案", "AI 助理", "API 和使用量", "程式碼品質", "團隊", "設定"],
        "details": "頂部有標誌，概覽以紫色高亮選中，下方訂閱卡片顯示 Pro 方案，12天後續訂，水平進度條在75%，底部有使用者檔案，頭像為 {argument name=\"user name\" default=\"Alex Morgan\"}，和電子郵件 alex@morgan.dev"
      },
      {
        "title": "標頭",
        "position": "主要區域頂部",
        "count": 4,
        "labels": ["歡迎回來，Alex 👋", "這是您的AI程式碼平台今天的動態。", "2024年5月12日至6月12日", "匯出報告"],
        "details": "左側有大型問候語，右側有日期範圍選擇器和匯出按鈕"
      },
      {
        "title": "指標卡片",
        "position": "標頭下方頂行列",
        "count": 4,
        "labels": ["總使用者數", "活躍專案", "API 呼叫次數", "程式碼品質分數"],
        "values": ["12,842", "2,153", "1.28M", "876"],
        "details": "每個卡片有一個小彩色圖示、大型主要數值、與2024年4月12日至5月12日的比較文字、正增長百分比14.6%、8.3%、23.7%、5.9%，以及底部的迷你折線圖；顏色為紫色、綠色、琥珀色和藍色"
      },
      {
        "title": "主要分析面板",
        "position": "中間和底行列",
        "count": 4,
        "labels": ["API 呼叫隨時間變化", "頂級專案", "使用者活動熱圖", "程式碼品質趨勢"],
        "details": "API 呼叫隨時間變化是一個寬區域圖表，帶有每日下拉選單和上升的紫色線，結束於接近250K；頂級專案是一個5項排名列表，帶有進度條和百分比變化；使用者活動熱圖是一個7行每週熱圖，時間標籤從上午12點到下午9點；程式碼品質趨勢是一個折線圖，帶有每週下拉選單和平滑上升的紫色趨勢，從約70到低90多"
      },
      {
        "title": "頂級專案列表",
        "position": "中間右側面板",
        "count": 5,
        "labels": ["AI 程式碼助理", "智慧重構", "程式碼審查機器人", "文件產生器", "測試建立器"],
        "values": ["485K", "321K", "214K", "132K", "98K"],
        "details": "前四項有綠色正增量12.4%、8.7%、3.1%、6.8%，測試建立器有紅色負增量-1.2%；每行有一個彩色方形圖示和細水平進度條"
      }
    ]
  },
  "style": {
    "visual_language": "高級金融科技和AI產品設計模型",
    "rendering": "清晰高保真使用者介面模型，細微陰影，霓虹邊緣照明，精緻圖表，乾淨無襯線排版",
    "primary_accent": "{argument name=\"accent color\" default=\"電紫色\"}",
    "secondary_accents": ["翠綠色", "琥珀黃", "青藍色"],
    "density": "資訊豐富但寬敞，平衡網格，高度易讀"
  }
}

機器翻譯 — 實際產出作品的是原文 prompt。

✨ 生成 收藏 複製 Prompt 分享 原始貼文 在 Hitboard 開啟