Skip to content
💻程式#105入門金字塔 · 做
工程師顧問經營者Gemini#無程式碼開發#AI Studio#工具改造

工具 Remix:從 App Gallery 範本改成你的職場工具

用途

在 AI Studio App Gallery 找到接近的範本後,用這道 prompt 快速描述你的改造需求,讓 AI 把現有範本調整成你部門專屬的版本,省去從零寫的時間。

何時用

  • 適合:在 App Gallery 看到一個類似的工具(例:費用計算器、任務清單、資料篩選器)想直接改成自己用的版本時。
  • 不要用:沒有對應的範本可以參考,或功能差距太大(例:Gallery 有算術計算器,你要的是 RAG 問答系統)——那種情況從零做用「5 區塊模板」更清晰。

Prompt

text
我想 remix 這個 App Gallery 範本,改成我們部門專用的版本。

工具名稱:{{新工具名稱,例:採購申請預算試算器}}

改造規格:
- 輸入欄位:{{要有哪些輸入欄位,例:申請人/部門/品項名稱/單價/數量}}
- 要計算或顯示的結果:{{例:小計、是否超過部門月度預算上限(10萬元)、自動標示超支}}
- 特殊業務規則:{{例:超過 5 萬元需要主管二層簽核標示、IT 類採購不計入預算限額}}

介面要求:
- 一頁呈現,版面簡潔
- 全繁體中文
- 手機也能正常操作

Demo 資料:
- 預填 {{N}} 筆假資料,不需要後端,資料直接寫在程式碼裡
- 假資料要看起來像真實的企業採購情境

輸出:完整單一 HTML 檔案,可以直接在瀏覽器開啟展示。

範例 / 變體

  • 填好變數:工具名稱填 採購申請預算試算器、輸入欄位填 申請人/部門/品項名稱/單價/數量、計算結果填 小計+是否超過月度上限(10萬)、特殊規則填 超過5萬需二層簽核、N填 4
  • 變體(加視覺提示):在介面要求加「超支的列用紅色背景標示,正常的用綠色」,讓工具在展示時視覺上更清晰。
  • 變體(多部門版):輸入欄位加「部門下拉選單」,特殊規則加「不同部門有不同預算上限(財務20萬/業務15萬/IT10萬)」。

🎯 範例輸出(實測)

Gemini 跑這句、把 {{新工具名稱}} 填成「採購申請預算試算器」、輸入欄位填「申請人/部門/品項名稱/單價/數量」、計算結果填「小計+是否超過月度上限(10萬)」、特殊規則填「超過5萬需二層簽核」、N填「4」的結果:

點開看 AI 實際輸出

Gemini 在費用計算器範本基礎上輸出改造版,核心邏輯與介面如下:

改造後的欄位結構:

欄位類型說明
申請人文字輸入手動輸入姓名
部門下拉選單業務/IT/財務/行政
品項名稱文字輸入採購品項描述
單價數字輸入每單位金額(元)
數量數字輸入採購數量

業務規則實作(JavaScript 核心邏輯):

text
function calcAndValidate(unitPrice, qty) {
  const subtotal = unitPrice * qty;
  const MONTHLY_LIMIT = 100000; // 月度預算上限 10 萬
  const DUAL_APPROVAL = 50000;  // 5 萬以上需二層簽核

  return {
    subtotal,
    overBudget: subtotal > MONTHLY_LIMIT,
    needDualApproval: subtotal > DUAL_APPROVAL,
    statusText: subtotal > MONTHLY_LIMIT
      ? '⛔ 超過月度預算上限,需提交特別審核'
      : subtotal > DUAL_APPROVAL
        ? '⚠️ 超過 5 萬,需主管二層簽核'
        : '✅ 符合預算,可直接申請'
  };
}

預填 4 筆假資料展示效果:

  • 王小明(業務)筆電 $35,000 × 2台 → 小計 $70,000,⚠️ 需二層簽核
  • 林雅婷(IT)伺服器授權 $120,000 × 1 → 小計 $120,000,⛔ 超過預算上限
  • 陳大偉(行政)辦公桌椅 $8,500 × 4組 → 小計 $34,000,✅ 可直接申請
  • 張慧如(財務)報表軟體 $15,000 × 1 → 小計 $15,000,✅ 可直接申請

💡 實測心得:「特殊業務規則」那一欄要把數字寫清楚(例:寫「5萬」而非「金額較大」),Gemini 才能把閾值硬編進邏輯而不是產出一個需要你再填的佔位符。

延伸

重點來了:Remix 比從零做快的地方在於 Gallery 的範本已經有基礎的 UI 結構和互動邏輯,你只要描述「換什麼」就好,不用解釋「要怎麼建」。如果改完想加一個 AI 分析按鈕(例:分析採購趨勢、提建議),可以接著用「職場小工具加 AI 功能」繼續升級。

依場景分類 · 一鍵複製 · 持續擴充