3.1.4: 建立你的風格資料庫

• 完成時間： 20 分鐘
• 先決條件： 一致性與風格（Module 3.1.3）

在 Cursor 中開始本模組： 執行 /start-3-1-4 以開始互動式體驗。

概覽

Module 3.1.4 教你圖片生成的元技能：建立一個隨著每個專案變得更有價值的個人創意工具包。不是每次都從頭開始，你將建立一個可以立即應用的經過驗證的風格庫。

關鍵要點： 這不僅僅是關於生成圖片 - 這是關於建立一個複利系統。你儲存的每種風格都使未來的工作更快更好。

元技能

大多數人將 AI 圖片工具用作一次性的新奇事物：

• 生成某些東西
• 使用一次
• 忘記它
• 下次重新開始

進階使用者做不同的事情：

• 生成某些東西
• 儲存成功的提示
• 跨專案重複使用
• 隨時間建立庫

差異顯著複利。幾個月後，你有一個適用於每種情況的經過驗證的風格庫 - 角色、圖表、簡報、行銷。一個指令：「使用風格 #12」，你就完成了。

你的風格庫

Nano Banana 模組包含 style-library.html - 一個視覺化你的風格收藏的本地 HTML 檔案。

庫中有什麼

每個風格條目包含：

使用庫

應用風格：

使用風格 #5 生成 [你的主題]

AI 查找風格、檢索提示，並將其應用於你的主題。

瀏覽風格： 在瀏覽器中開啟 style-library.html。使用過濾按鈕探索類別。

類別

庫將風格組織成類別：

擴展庫的三種方式

方法 1：隨時儲存

最簡單的方法 - 每當你建立出你喜歡的東西時，儲存它。

工作流程：

1. 生成你滿意的圖片
2. 告訴 AI：「將此風格添加到我的庫中」
3. AI 使用新條目更新 style-library.html
4. 該風格現在可供將來使用

範例：

你：生成具有柔和顏色的極簡旅程地圖

[AI 生成圖片]

你：我喜歡這種風格。將其添加到我的庫中。

AI：完成！在 Flow 類別中添加為風格 #15「極簡旅程地圖」。

最適合： 捕捉你自己成功的實驗。

方法 2：從線上收集

到處都有很棒的提示 - 社群媒體、教程、提示資料庫。當你找到一個時，測試它，然後儲存它。

工作流程：

1. 在線上找到一個有前途的提示
2. 測試它：「使用此提示生成 [主題]：[貼上提示]」
3. 如果效果好，告訴 AI 儲存它
4. 現在它是你永久庫的一部分

範例：

你：我在網上找到了這個提示 - 用咖啡店測試它：
「製作一張完美等距的照片。它不是微縮模型，
它是一張恰好完美等距的拍攝照片。」

[AI 生成等距咖啡店]

你：太好了！將此儲存為「完美等距照片」

AI：在 3D/Isometric 類別中添加為風格 #16。

最適合： 策劃社群中最好的提示。

方法 3：從任何圖片提取

這是強大的舉動。看到你喜歡的圖片？將其風格提取為文字，然後隨時重新建立它。

如何運作：

1. 提供圖片（檔案路徑或 URL）
2. AI 執行風格提取模組
3. 模組分析：顏色、照明、構圖、紋理、情緒、效果
4. 返回詳細的自然語言描述
5. 你現在可以從純文字重新建立該風格

工作流程：

你：從此圖片提取風格：[圖片路徑]

AI：[執行 style_extract.py]

這是提取的風格：
「溫暖的類比攝影美學，帶有輕微的膠片顆粒。
黃金時段照明營造柔和的陰影。柔和的大地色調，
帶有去飽和的綠色和溫暖的高光。坦率的構圖，
帶有輕微的動態模糊，暗示真實的時刻...」

你：使用該提取的風格生成肖像

[AI 將風格應用於新主題]

你：完美。將此儲存到我的庫中。

最適合：

• 從 Pinterest、Instagram 或設計靈感中捕捉風格
• 重現你欣賞的競爭對手或品牌的外觀
• 從單一參考圖片建立風格

風格提取模組

style_extract.py 模組使用 Gemini 的圖片理解來分析任何圖片並描述其視覺風格。

它捕捉什麼：

• 色彩調色板和溫度
• 照明品質和方向
• 構圖和取景
• 紋理和材料
• 情緒和氛圍
• 排版（如果存在）
• 特殊效果或處理

為什麼有效： Gemini 3 Pro 具有卓越的圖片理解能力。它可以表達難以手動描述的視覺品質。

管理你的庫

添加風格

當你告訴 AI 儲存風格時，它會：

1. 分配下一個可用的 ID 編號
2. 建立描述性名稱
3. 選擇適當的類別
4. 添加相關標籤
5. 儲存縮圖圖片
6. 更新 style-library.html

自訂庫

風格庫只是一個 HTML 檔案 - 你可以自訂它：

• 添加欄位： 「要求 AI 添加『難度』欄位」
• 更改佈局： 「按類別重新組織庫」
• 添加搜尋： 「向庫添加搜尋欄」
• 修改設計： 「讓庫變成深色模式」

這是你的工具包。塑造它以適合你的工作流程。

標籤和過濾

標籤幫助你快速找到風格。按類別的規範標籤：

使用 style-library.html 中的過濾按鈕按類別瀏覽。

複利效應

這就是為什麼這很重要：

第 1 週： 你有 5 種風格

• 基本涵蓋常見需求

第 1 個月： 你有 15 種風格

• 你的工作出現模式
• 開始有「首選」風格

第 3 個月： 你有 30+ 種風格

• 全面涵蓋
• 很少需要從頭建立
• 「使用風格 #23」成為你的工作流程

第 1 年： 你有 50+ 種經過實戰檢驗的風格

• 專業級庫
• 每種風格在多個專案中得到驗證
• 幾分鐘就能完成過去需要幾小時的工作

這就是複利效應。每個專案都使你的庫更有價值。

工作流程範例

範例 1：一致的品牌視覺

情境： 你的公司有需要維護的特定視覺風格。

解決方案：

1. 收集 3-5 張符合品牌的圖片
2. 從你最好的範例中提取風格
3. 儲存為「公司品牌風格」
4. 應用於所有未來的圖形

使用風格 #8（公司品牌）生成功能公告

範例 2：快速探索

情境： 你需要 10 個使用者角色肖像，全部一致。

解決方案：

1. 瀏覽你的庫以尋找角色風格
2. 選擇一個適合專案基調的
3. 使用相同的風格編號生成所有 10 個

使用風格 #12 生成 Sarah Chen 肖像
使用風格 #12 生成 Marcus Johnson 肖像
使用風格 #12 生成 Priya Patel 肖像
...

範例 3：重現靈感

情境： 你的 CEO 分享了他們喜歡的競爭對手圖表。

解決方案：

1. 從競爭對手的圖片中提取風格
2. 將其儲存到你的庫中（使用適當的名稱）
3. 將其應用於你自己的內容

從此圖表提取風格：[競爭對手的圖片]
使用該風格生成我們的產品路線圖
將此儲存為「高階圖表風格」

最佳實踐

要做的：

• 經常儲存風格 - 如果你喜歡它，儲存它
• 使用描述性名稱 - 「溫暖肖像」勝過「風格 7」
• 徹底標記 - 幫助未來的你找到東西
• 積極提取 - 看到好東西？抓住它
• 定期審查 - 修剪未使用的風格

不要做的：

• 不要囤積平庸的風格 - 品質勝於數量
• 不要忘記儲存 - 立即捕捉成功
• 不要過度分類 - 保持簡單
• 不要忽略提取的風格 - 它們通常是最好的

疑難排解

風格庫無法開啟

• 確保你在瀏覽器中開啟 style-library.html（不是文字編輯器）
• 嘗試右鍵點擊 → 開啟方式 → 你的瀏覽器

新風格沒有出現

• 重新整理瀏覽器（Cmd+R / Ctrl+R）
• 檢查 AI 是否確認了儲存

提取的風格與原始不符

• 某些視覺效果難以用文字描述
• 嘗試從更簡單的範例中提取
• 結合參考圖片以獲得更好的結果

找不到正確的風格

• 使用類別過濾器
• 嘗試按標籤搜尋
• 問 AI：「哪些風格適用於 [你的使用案例]？」

快速參考

擴展庫的三種方法：
  1. 隨時儲存 → 好作品？儲存它。
  2. 從線上收集 → 測試，然後儲存。
  3. 從圖片提取 → 強大的舉動。

使用風格：
  「使用風格 #X 生成 [主題]」
  「將風格 #Y 應用於此」
  「哪些風格適用於旅程地圖？」

管理風格：
  「將此添加到我的庫中」
  「將此儲存為 [名稱]」
  「向我展示所有角色風格」

下一步？

你已完成 Module 3.1 - 圖片生成入門。你了解機制、提示原則以及如何建立複利系統。

Module 3.2 將這些技能應用於真實的 PM 任務。你將建立角色、旅程地圖、線框圖、架構圖和行銷資產。

互動式路徑：輸入 /start-3-2-1

資源

• Dribbble - 設計靈感，找到要添加到庫中的風格
• Behance - 創意作品集，從專業作品中提取風格
• Pinterest - 視覺發現，策劃風格靈感板

關於本課程

由 Carl Vellotti 建立。查看 The Full Stack PM 以獲取更多 PM 建構者內容。

原始碼儲存庫： github.com/carlvellotti/claude-code-pm-course