如何用參考圖片請 AI 製作 Dashboard？

如何把參考圖片交給 AI 製作自己的 Dashboard？

直接答案： 使用參考圖片製作 Dashboard 時，應先拆解版面、KPI、圖表與篩選器，再將每個元件對應到資料欄位，避免 AI 為了模仿畫面而捏造不存在的數據。

使用參考圖片製作 Dashboard 時，應先拆解版面、KPI、圖表與篩選器，再將每個元件對應到資料欄位，避免 AI 為了模仿畫面而捏造不存在的數據。參考圖片提供視覺方向，不等於授權複製設計。

本篇會完成一個可驗收的工作成果，而不是只介紹觀念。讀者將依序理解故事情境、用途、適用狀況、操作步驟、完整 Prompt、驗收方法、常見錯誤與 FAQ。

SnackFlow 遇到了什麼工作問題？

直接答案： SnackFlow 主管看到一張喜歡的銷售 Dashboard，要求團隊「照這個做」。

SnackFlow 主管看到一張喜歡的銷售 Dashboard，要求團隊「照這個做」。營運人員先確認訂單資料只有日期、分類、通路、金額與付款狀態，因此刪除無法由現有欄位計算的指標，再請 AI 依相似資訊層級建立新介面。

這個故事的關鍵不是「使用 AI 就會得到答案」，而是先把工作問題、資料欄位、規則與驗收條件說清楚，再讓工具協助處理可重複、可檢查的部分。

這項做法有哪些用途與效益？

直接答案： 參考圖片適合快速溝通版面密度、配色、資訊層級與圖表位置。效益是減少抽象形容詞，但真正的 Dashboard 仍必須由資料欄位與決策需求決定。

參考圖片適合快速溝通版面密度、配色、資訊層級與圖表位置。效益是減少抽象形容詞，但真正的 Dashboard 仍必須由資料欄位與決策需求決定。

哪些狀況適合，哪些狀況不適合？

直接答案： 適合內部原型與取得合法使用權的參考素材。不應完整複製他人受著作權保護的版面、品牌元素或專有視覺資產。

適合內部原型與取得合法使用權的參考素材。不應完整複製他人受著作權保護的版面、品牌元素或專有視覺資產。

若資料涉及個資、財務、法遵、交易或未公開商業資訊，先遵守組織資料政策。只需要提供資料結構時，應使用欄位名稱與三筆虛構資料，不要直接貼入敏感原始資料。

完整操作教學怎麼做？

直接答案： 完整操作從確認工具與資料結構開始，再依序設定規則、產出結果、測試例外並人工驗收。每一步都要保留可核對的輸入與輸出。

步驟 1：建立測試副本與成功條件

先複製原始檔，或建立只含欄位標題與三筆假資料的測試表。寫下「完成後應看到什麼」，例如公式回傳數字、試算表新增一列、雲端硬碟出現指定檔案，或 Dashboard 顯示可回扣的 KPI。

步驟 2：確認資料欄位與型態

逐欄核對工作表名稱、欄位標題、日期、文字、數字與唯一鍵。不要只依投影片中的欄位字母，因為實際檔案插入或刪除欄位後，位置可能不同。

步驟 3：依序完成核心工作

1. 標出參考圖中的 KPI、圖表、篩選器與明細。
2. 為每個元件找出對應資料欄位。
3. 刪除沒有資料來源的元件。
4. 說明保留的視覺特徵而非要求完全複製。
5. 提供欄位、規則與響應式需求。
6. 反覆調整並核對數字。

步驟 4：貼入完整 Prompt 並補上自己的資料位置

先把下方 Prompt 中的工作表名稱、欄位、網址、Spreadsheet ID、文件樣板、Email 或 MENU 替換成自己的測試資料。若需求涉及 Apps Script，要求輸出完整的 Code.gs 與 Index.html，不能只拿片段程式碼。

步驟 5：先小量執行，再擴大範圍

公式先用三至五筆資料測試；Apps Script 先用副本與自己的測試信箱執行；Web App 先送出一筆測試資料。確認結果正確後，再換成完整資料範圍。

步驟 6：依驗收清單核對與記錄例外

至少保留一個正常案例、一個邊界案例與一個錯誤案例。若結果不符，回頭檢查欄位名稱、資料型態、日期範圍、唯一鍵、權限與部署版本。

可直接複製的完整 Prompt

直接答案： 以下 Prompt 依投影片的六句提示法補齊目的、使用者、欄位、功能、規則與畫面或輸出。複製前必須替換自己的資料位置與測試條件。

~~~text

① 我要做什麼

附圖是我喜歡的 Dashboard 風格，請依相似的資訊層級與版面節奏，重新設計一個原創的 SnackFlow 銷售儀表板，不要完整複製品牌、圖示或專有視覺資產。

② 給誰使用

給 SnackFlow 的營運主管使用，讓主管快速掌握已付款訂單的營運狀況。

③ 有哪些欄位

資料欄位包含訂單日期、商品分類、通路來源、訂單金額、付款狀態；只計算「已付款」。

④ 要哪些功能

上方四張數字卡顯示總營收、訂單數、平均客單價、退款率；下方左側放每月營收折線圖，右側放商品分類長條圖，最下方放通路占比圓餅圖。請先逐一說明每個元件對應哪個欄位與公式。

⑤ 有哪些規則

對不到現有欄位的元件必須刪除或標示需補資料，不得編造營運數字；訂單數需說明是資料列數或唯一訂單數；退款率若資料只有付款狀態，請明確定義分子與分母。

⑥ 畫面風格

用 HTML＋CSS＋Chart.js 輸出成單一、響應式檔案，配色參考附圖但需重新設計。請提供完整程式碼、示範資料標示與 KPI 驗收清單。

~~~

Q如何使用這份 Prompt？

1. 保留六個區塊，不要只複製第一句。
2. 把範例中的工作表、欄位字母、網址、ID、Email 與日期換成測試資料。
3. 要求先說明假設，再輸出公式或完整程式碼。
4. 執行前檢查是否會寄信、分享檔案、覆寫資料或建立公開網址。
5. 把錯誤訊息與預期結果一起回填，要求只修正受影響部分。

如何驗收結果？

直接答案： 驗收不能只確認公式沒有錯誤或程式成功執行，還要核對資料範圍、計算規則、例外案例、輸出內容與必要權限。

• 每個 KPI 都有公式與來源欄位。
• 每張圖表的 X 軸、Y 軸與篩選條件明確。
• 沒有使用虛構數字填補缺少欄位。
• 手機與桌面畫面皆可閱讀。

建議再做三層核對：第一層用兩至三筆資料手算；第二層比較來源總筆數與輸出總筆數；第三層測試空白、重複、未對應、期間外或權限不足等例外。

常見錯誤與限制有哪些？

直接答案： 最常見問題是欄位與指標未定義清楚、直接相信產出，以及忽略資料型態、權限、部署版本與工具規模限制。

• 只丟截圖，不提供資料欄位。
• 為了填滿版面讓 AI 自行編造 KPI。
• 照抄品牌色、圖示與完整視覺。

若工作涉及正式財務、法遵、薪資、交易、大量多人使用或高可用性要求，應加入正式審核、權限、測試、記錄與稽核機制，不能只依賴教學用試算表原型。

工具功能與來源依據

直接答案： 文章中的工具操作以官方文件或實際引用來源為準；產品介面、可用方案與配額可能變動，操作前應再次核對官方說明。

本篇以使用者提供的投影片、SnackFlow 虛構教學情境與一般計算原則為依據，不主張真實企業成效或外部統計數字。

常見問題 FAQ

直接答案： 以下問答處理操作、驗證與工具選擇時常見的疑問；每個答案都可脫離前文單獨閱讀與套用。

Q截圖可以直接交給 AI 做 Dashboard 嗎？

可以用截圖說明版面與資訊層級，但仍需提供資料欄位、計算規則與哪些元素可以參考。

Q對不到資料欄位的圖怎麼辦？

刪除、改成可計算的圖，或先補充資料來源；不要用假數字冒充真實營運結果。

QDashboard 一定要有很多圖嗎？

不一定。Dashboard 應優先回答決策問題，圖表數量越多不代表資訊越完整。

Q可以完全仿製別人的 Dashboard 嗎？

不建議。參考資訊結構與視覺原則，再依自己的品牌與資料重新設計。

Q怎麼描述畫面風格？

說明色彩、留白、密度、字級、圖表比例與使用裝置，比只說「專業」或「有科技感」更有效。

參考資料

直接答案： 參考資料只列出本文實際使用的投影片與公開來源；日期無法確認時標示日期不明，不自行推測發布時間。

• 使用者提供之《Excel × AI 升級職場數據分析力》投影片，張可佳 Claire Chang，2026-08-07。

關於作者 {#author}

Claire Chang ｜ 企業 AI 導入與流程轉型顧問。專注於 AI Agent 架構設計、ERP 系統整合與企業 AI 治理。

最後更新：2026-08-25