場景原子庫
每個場景都是從真實世界的 App 拆解而來的最小可組合單元。 點進去看它如何在不同產業上下文中變身。
insight
KPI 指標總覽
kpi-dashboard一眼掌握業務核心指標與趨勢
靈感來源: Stripe Dashboard, Vercel Analytics, Shopify Home
趨勢圖表
data-chart時序資料視覺化, 看趨勢與異常
靈感來源: Vercel Analytics, Stripe Revenue, Datadog
數據對比
stat-comparisonA/B 或前後對比, 凸顯差異與勝者
靈感來源: Vercel A/B, Amplitude Experiment, Statsig
試算表
trial-balance所有科目借貸平衡驗證
靈感來源: QuickBooks TB Report
損益表
income-statement營收成本費用淨利結構
靈感來源: Xero P&L, Bench
資產負債表
balance-sheet資產負債權益平衡
靈感來源: QuickBooks Balance Sheet
現金流量表
cash-flow營業/投資/融資現金流
靈感來源: Xero Cash Flow
應收帳齡
ar-aging客戶欠款分齡追蹤
靈感來源: NetSuite AR Aging
預算差異
budget-variance預算 vs 實際對比
靈感來源: NetSuite Budget, Cube
菜單矩陣
menu-engineering人氣 × 毛利 四象限定位
靈感來源: Restaurant365, Toast analytics
房貸試算
mortgage-calculator本息攤還模擬
靈感來源: Zillow Calc, LendingTree
庫存週轉
inventory-turnover商品週轉率排行
靈感來源: Cin7, TradeGecko
會員 RFM 分群
member-rfmRecency/Frequency/Monetary
靈感來源: Klaviyo, Braze
業績階梯
commission-ladder成交金額 × 抽成比率
靈感來源: Xactly, CaptivateIQ
資料品質
data-quality批次驗證規則通過率
靈感來源: Great Expectations, Soda
實驗結果
experiment-resultA/B 統計顯著性 + 勝者
靈感來源: Statsig, Amplitude Experiment
異常偵測
anomaly-detector偏離基線自動告警
靈感來源: Datadog Watchdog, Anodot
SLO 儀表
slo-dashboard目標 vs 實際 + Error Budget
靈感來源: Google SRE Book, Nobl9
Error Budget 消耗
error-budgetBudget burn rate 追蹤
靈感來源: Nobl9, Datadog SLO
雲端成本拆解
cost-breakdown服務別成本 + 趨勢
靈感來源: AWS Cost Explorer, Vantage
容量規劃
capacity-planning使用率趨勢 + 擴容時機
靈感來源: Grafana Capacity, Datadog Forecasting
合規稽核報告
audit-reportSOC2 / ISO27001 控制項狀態
靈感來源: Drata, Vanta, Secureframe
browse
資源清單
resource-list大量同類資料的瀏覽 / 搜尋 / 狀態識別
靈感來源: Linear Issues, Gmail, GitHub Issues
資料表格
data-table密集欄位的結構化資料操作
靈感來源: Airtable, Retool, Notion Database
卡片網格
catalog-grid視覺化瀏覽 · 圖像+標題+價格導向
靈感來源: Shopify, Airbnb, Pinterest
方案價格
pricing-table方案差異對比 + 付費引導
靈感來源: Stripe Pricing, Vercel, Linear Plans
樹狀導航
tree-sidebar階層式工作空間切換
靈感來源: Notion Sidebar, VS Code Tree, Slack Channels
優先收件夾
inbox-zero優先級分組 + 鍵盤快速清空
靈感來源: Linear Inbox, Superhuman, Gmail Priority
總帳明細
general-ledger科目交易歷史 + 累計餘額
靈感來源: NetSuite, Xero GL
flow
流程看板
pipeline-board視覺化狀態機 / 跨階段推進
靈感來源: Trello, Linear Cycles, GitHub Projects
對話串
chat-thread與使用者的一對一訊息溝通
靈感來源: Intercom, Slack, WhatsApp Business
上手檢查表
onboarding-checklist新用戶階梯式引導 + 進度視覺化
靈感來源: Vercel Onboarding, GitHub First-time, Notion Welcome
自動化流程
workflow-builderTrigger → Filter → Action 串接
靈感來源: Zapier, n8n, Make, GitHub Actions
資料管線
etl-pipeline外部系統 → 轉換 → 落地本體的 ELT 拓撲
靈感來源: Airbyte, Fivetran, dbt, Airflow
規則引擎
rules-engine把 domain rules 轉成可執行決策 (block/warn/audit)
靈感來源: OPA, Stripe Radar, LaunchDarkly, AWS Config
事件處理 Runbook
runbook-incidentP0/P1 事件自動化步驟 + SLA 倒數 + 對外溝通
靈感來源: PagerDuty, incident.io, Grafana Oncall
路線最佳化
route-optimizer司機配送路線 + 狀態
靈感來源: Onfleet, Routific
OAuth 授權
oauth-consent第三方應用範圍授權
靈感來源: Google OAuth, GitHub OAuth
MFA 設定
mfa-setupTOTP QR + 驗證碼
靈感來源: Authy, Google Authenticator
Feature Flag
feature-flag漸進式發布旗標控制
靈感來源: LaunchDarkly, Flagsmith
部署管線
deploy-pipelineCI/CD 階段狀態與時間
靈感來源: GitHub Actions, Buildkite, Spinnaker
view
時段預約
booking-calendar依時間軸安排資源 / 排程 / 預約
靈感來源: Cal.com, Google Calendar, Airbnb
資源詳情
resource-detail單一實體全欄位 + 活動時間軸
靈感來源: Linear Issue View, Notion Page, GitHub PR
通知中心
notification-feed分群顯示事件, 標示未讀與提及
靈感來源: GitHub Bell, Linear Inbox, Slack Activity
空狀態引導
empty-state零資料時引導首個動作, 不留空白畫面
靈感來源: Linear No Issues, Notion Blank Page, Vercel New Project
地圖視圖
map-view空間定位資源 + 列表互動
靈感來源: Uber Driver, Airbnb Map, Google Maps
稽核軌跡
audit-log系統事件歷史追溯 · 合規
靈感來源: GitHub Events, Linear Audit, Vercel Log
團隊名冊
team-roster成員 + 角色 + 負載 + 在線狀態
靈感來源: Linear Team, Vercel Team, Notion Members
更新紀錄
changelog-timeline版本發布時序與分類
靈感來源: Linear Changelog, Vercel Release Notes, Stripe API Log
應付到期
ap-aging供應商到期付款排程
靈感來源: Bill.com, Ramp AP
廚房出餐板
kitchen-board廚師視角即時看待出餐的訂單
靈感來源: Toast KDS, Square KDS
物件詳情頁
property-listing房產圖片+規格+預約
靈感來源: Zillow, 591
SKU 矩陣
sku-matrix顏色×尺寸庫存一覽
靈感來源: Shopify Variants
成績冊
gradebook學生測驗成績矩陣
靈感來源: PowerSchool, Canvas
課程地圖
curriculum-map學期進度單元追蹤
靈感來源: Canvas Modules
倉儲庫位圖
warehouse-slotting倉位使用熱度 + 異常
靈感來源: SAP WM, Oracle WMS
住客帳
folio-billing飯店客人累積帳單
靈感來源: Opera PMS, Mews
診間時段
appointment-slot醫師看診可用/已約
靈感來源: Zocdoc, OneMedical
考勤矩陣
attendance-matrix每日出席/缺席記錄
靈感來源: PowerSchool Attendance
房況分配
room-allocation房間狀態色碼視覺化
靈感來源: Opera Rooms, Mews
角色權限矩陣
role-permissionRBAC 權限 × 角色對照
靈感來源: Auth0, Okta, AWS IAM
API 金鑰
api-keys金鑰生命週期 + 範圍限制
靈感來源: Stripe API Keys, GitHub PAT
Webhook 註冊
webhook-registry訂閱端點 + 重試與健康度
靈感來源: Stripe Webhooks, Zapier
資料血緣
data-lineage上下游資料流追溯
靈感來源: DataHub, Atlan, Monte Carlo
Schema 變更
schema-diff表結構 diff + 遷移批准
靈感來源: Liquibase, Flyway, Prisma Migrate
ML 模型卡
ml-model-card指標 + 資料偏差 + 公平性
靈感來源: Google Model Cards, Weights & Biases
設定漂移
config-driftRuntime 與 IaC 差異
靈感來源: Driftctl, AWS Config, Terraform
登入裝置
session-list裝置清單 + 可疑活動標記
靈感來源: Apple ID Devices, Google Account
input
多步驟表單
form-wizard引導式輸入 / 降低單頁認知負擔
靈感來源: Stripe Checkout, Typeform, Linear Onboarding
指令搜尋
command-search鍵盤驅動快速查找 / 執行動作
靈感來源: Raycast, Linear ⌘K, GitHub Command
登入驗證
login-auth身份驗證入口 · Email + OAuth
靈感來源: Clerk, Auth0, Vercel Login, Linear Magic Link
檔案上傳
file-upload批次上傳 + 進度 + 附件管理
靈感來源: Notion Drag-drop, Dropbox, Google Drive
標籤選擇器
tag-multi-select多標籤分類 + 搜尋與建議
靈感來源: Linear Labels, GitHub Labels, Notion Multi-select
分錄憑證
journal-entry借貸分錄 + 自動稅額計算
靈感來源: QuickBooks, Xero, SAP
費用報銷
expense-report員工費用單 + 發票附件 + 審核
靈感來源: Expensify, Ramp, Brex
病歷編輯器
medical-chartSOAP 格式電子病歷
靈感來源: Epic, Athenahealth
處方箋
prescription-pad用藥單 + 交互作用警示
靈感來源: Epic Rx, DrFirst
優惠券設計器
coupon-builder折扣規則 + 適用條件
靈感來源: Shopify Discounts
電子簽收
delivery-pod收件人簽名 + GPS + 時間戳
靈感來源: FedEx POD, UPS Choice