你會得到

  • 一個完整的 KPI 儀表板 HTML 檔,含 7、30 與 90 天的檢視
  • 把 CSV 或 JSON 匯出轉成儀表板資料的腳本
  • 以 recharts 製作的 React 區塊,另附 ECharts 版本的圖表
  • 變化標籤、上一期對照線、拆解表格與目標進度條
  • 可選:報告標頭圖,由 PopNow 生成,執行前先報價

適合

  • 產品、商店、客服或成長的 KPI
  • 每週與每月的 KPI 報告頁面
  • 內部工具的總覽畫面

不適合

  • 有很多畫面的完整後台應用
  • 即時串流的資料
  • 在同一張圖中比較大量數列

怎麼用

在 Claude 或 ChatGPT 裡

用 PopNow 的技能「KPI 儀表板範本」(kpi-dashboard-template)幫我做這件事:依 exports/orders.csv 做 KPI 儀表板:訂單數、營收、造訪數與首次回覆時間,依通路拆解。

在程式 Agent 裡

/popnow-kpi-dashboard-template 依 exports/orders.csv 做 KPI 儀表板:訂單數、營收、造訪數與首次回覆時間,依通路拆解。

接著試試

加入每月 150,000 的營收目標,預設顯示最近 7 天。

給我我們 Next.js 管理後台用的 React 版本。

需要準備

  • CSV 或 JSON 匯出,或產生它的指令
  • 四個指標,以及哪些是數值越低越好
  • 可選:目標值,以及用來拆解某個指標的欄位

類似技能

查看全部 →

常見問題

數字從哪裡來?

來自你自己的匯出。內附的腳本會讀取 CSV 或 JSON,無論是每日總計或原始事件,都會為每個指標建立每天一列,並加上選用的拆解,然後寫入頁面。

變化百分比怎麼算?

把最近 7、30 或 90 天與它之前相同天數的期間相比。總計比較加總,時間與比率比較平均,活躍用戶等水準值比較最新一筆。標示為數值越低越好的指標,下降會顯示為好。

需要圖表函式庫嗎?

HTML 版本不需要任何東西,並可離線運作。React 版本使用 recharts;另附圖表的 ECharts 版本,供已在使用它的專案採用。

PopNow 可以畫圖表嗎?

不行,也不應該:圖像模型可能會把數字弄錯。PopNow 只用於選用、不含文字的標頭或分享卡底圖,真實的數字則以 HTML 疊在上面。