啊？我剛開源的 Skills 已經 7K Star 了？！
整理版優先睇
開源 Skills 合集 7K Star，教 AI Agent 穩定執行複雜任務
呢篇文章係由作者 ConardLi（花園老師）分享佢最近開源咗一個 Skills 合集 garden-skills，短時間內喺 GitHub 獲得超過 7K Star。作者本身係技術博客 code秘密花園嘅主理人，寫過幾篇 AI Agent 教程，包括用 Agent 做視頻、網頁設計同圖片生成。佢發現好多人用 Agent 做複雜任務嘅時候，效果時好時壞，原因係 Agent 預設只係接到一個「任務」，但複雜產物需要一條「生產線」。所以佢將自己沉澱落嚟嘅工作流整理成 Skill，目的係畀 Agent 一套穩定、可重複嘅工作系統，而唔係單純嘅提示詞。
成個策略嘅結論係：一個好嘅 Skill 要提供明確嘅工作流程、質量標準同迭代接口，咁先可以確保 Agent 嘅輸出穩定同可控。文章詳細介紹咗三個主要 Skill：視頻製作、網頁設計同圖片生成，每個都有具體功能、主題模板同使用建議。作者強調 Skills 嘅價值在於經得起真實任務折騰，而唔係 Demo 靚唔靚。
最後，作者公開曬全部開源倉庫同三個在線試玩網站，鼓勵讀者直接拎去用，並提醒要留意模型選擇、第一輪 Review 同局部迭代嘅策略。
- Skill 嘅核心價值係建立「穩定工作系統」而唔係靚提示詞，解決 Agent 執行複雜任務時效果飄忽嘅問題。
- 視頻製作 Skill (web-video-presentation) 用網頁模擬視頻，將長視頻拆成可控工程，支援自訂主題同可插拔 TTS。
- 網頁設計 Skill (web-design-engineer) 引導 Agent 由真正設計流程出發，避免 AI 味，提供 25 套主題模板。
- 圖片生成 Skill (gpt-image-2) 包含 79 個結構化 Prompt 模板，覆蓋生成同編輯工作流，支援三種運行模式。
- 使用建議：揀 Opus 4.7 等強模型；第一輪 Review 決定方向；唔好期望一步到位，用局部迭代改善細節。
garden-skills 開源倉庫
所有 Skills 嘅 GitHub 倉庫，包含視頻製作、網頁設計、圖片生成嘅完整 Code 同文檔。
視頻製作在線預覽
網頁影片效果預覽網站，展示多套主題風格。
網頁設計在線預覽
網頁設計主題預覽網站，展示 25 套設計風格。
圖片生成在線體驗
GPT Image2 提示詞網站，含在線試玩模組，可直接生成圖片。
Skill 嘅真正價值：唔係提示詞，而係穩定系統
作者發現，好多人用 Agent 做複雜任務時，效果時好時壞。原因好簡單：Agent 默認接到嘅係一個「任務」，但複雜產物需要嘅係一條「生產線」。一個好 Skill 要提供明確嘅工作流程、質量標準同迭代接口，咁先可以變成「一套穩定嘅工作系統」。
- 1 明確工作流程：咩時候問、咩時候做、咩時候停低畀你睇。
- 2 明確質量標準：咩算好、咩算 AI 味太重。
- 3 明確迭代接口：唔滿意時點樣反饋，Agent 知道改邊層。
視頻製作 Skill：用網頁做穩定嘅影片
呢個 Skill 名為 web-video-presentation，可以將文章、腳本、課程等文字內容轉化成 網頁模擬嘅演示視頻。佢唔直接生成 mp4，而係生成一個可逐章節推進嘅網頁，錄屏時好似播緊一段精心設計嘅影片。
網頁做影片最大好處係將「視頻」拆成工程：章節、旁白、畫面、進度全部可由代碼控制，局部修改好方便。例如可以叫 Agent「第三章節奏太慢，改成發佈會 Keynote 風格」、「結尾加個總結大屏」。
最近更新咗 多套主題模板，覆蓋演講、技術、數據報告、科普、終端風、雜誌風等方向。另外 TTS 變做可插拔，內置 MiniMax 同 OpenAI 示例，亦預留咗 ElevenLabs、edge-tts 等接口。
- bold-signal：適合產品發佈、營銷片頭，大色塊強觀點。
- terminal-green：適合 CLI 工具教程、黑客風，終端感強。
- newsroom：適合熱點解讀、深度報道，報紙特稿風格。
- electric-studio：適合 B2B、路演，白底電光藍商務風。
- bauhaus-bold：適合觀點宣言、設計演講，布魯塔利風格。
- creative-voltage：適合創意分享、設計周，視覺文化類。
- neon-cyber：適合 AI、Web3、網絡安全，霓虹感強。
- vintage-editorial：適合個人觀點、文化隨筆，專欄作者氣質。
網頁設計 Skill：告別 AI 味，做真正設計
第二個 Skill 係 web-design-engineer，針對 AI 生成網頁常見嘅問題——大漸變、玻璃卡片、發光邊框、過度圓角，一眼就睇得出係「AI 做嘅」。佢將 Agent 拉返去真正嘅網頁設計流程：先判斷產品類型同受眾，再確定視覺方向、信息層級、排版節奏、組件密度。
最新版本加咗 25 套設計風格模板，每套包含具體規則：顏色、字體、版式、標誌性動作、避開嘅套路。你畀 Agent 一個大概方向，佢會自動推斷最匹配嘅風格。
- linear：適合 B2B SaaS、開發者工具，簡約唔花巧。
- raycast：適合效率工具、開發者工作流，暗色快捷感。
- aesop：適合美妝、精品零售，留白同空間感為先。
- tufte-dataink：適合數據敍事、研究報告，最小化裝飾。
- field-io：適合藝術科技、互動裝置，實驗性視覺。
- active-theory：適合電影感發布頁、遊戲，衝擊力強。
- bloomberg-businessweek-turley：適合雜誌封面、觀點專題，大膽誇張。
- balenciaga-post-2017：適合時裝、反奢侈品，刻意生硬反常規。
圖片生成 Skill：結構化 Prompt 精準出圖
第三個 Skill 係 gpt-image-2，面向 GPT Image 2 同兼容 API。佢幫你做海報、UI Mockup、產品圖、信息圖、漫畫、品牌板等。重點係將圖片任務拆成 18 大類、79 個結構化模板，涵蓋生成同編輯工作流。
一個好嘅圖片 Prompt 需要同時描述：畫面目標、主體關係、構圖、材質、光線、字體限制、輸出尺寸、編輯空間。好多失敗圖片係因為任務本身缺少結構，而唔係模型聽唔明風格詞。Skill 嘅作用係令 Agent 先拆清楚任務，再進入生成階段。
最近更新咗 在線體驗模塊，喺提示詞詳情頁可以一鍵跳轉去 playground，自由更改提示詞即時生成。
用好 Skills 嘅實戰建議
作者分享咗幾個令效果更穩定嘅貼士。首先，模型揀 Opus 4.7 效果好，因為呢啲 Skill 有好多審美判斷同決策，模型能力直接影響最終質素。
其次，第一輪 Review 一定要認真。唔好一開波就叫 Agent 做完整版本，而係先確認腳本、主題、大綱係咪啱方向。前面方向錯咗，後面做得再精緻都冇用。
最後，用局部迭代代替一步到位。先叫 Agent 做完整版本，跑通之後再針對唔滿意嘅章節畀反饋，例如「第二章太平」、「第四章太密」。Agent 好擅長呢種局部修改，用得多你就會愈來愈知道自己想要咩。
最近，我連續寫咗幾篇關於 AI Agent 嘅教學。
一篇講點樣用 Agent 做影片，一篇講點樣令 Agent 做出更令人驚豔嘅網頁，仲有一篇講點樣用好 GPT Image2。
每篇文章後面，我都順手開源咗一個 Skill。
本來只係想將自己呢段時間沉澱落嚟嘅工作流程整理出嚟，方便大家直接攞去用。
點知傳播得比我預期中快好多。
後來我將呢啲 Skill 整理到一個合集倉庫入面：
https://github.com/ConardLi/garden-skills
寫呢篇文章嘅時候，GitHub 已經接近 7K Star。
另外都好開心見到好多同學真係用咗我嘅 Skill 去整嘢：
都有啲大 V 轉發推薦，帶嚟咗唔少真實反饋。
呢啲反饋令我更加確定咗一件事：
Skill 呢樣嘢，真正有價值嘅地方，唔在於提示詞寫得有幾靚。
佢嘅價值在於將一套可重複穩定工作嘅方法交俾 Agent。
Skill 到底解決咗啲咩問題？
好多人啱啱開始用 Agent 做複雜任務嘅時候，都會遇到咁嘅問題：
有時效果好驚豔，有時就開始飄忽。
你叫佢做網頁，佢可能一時似 SaaS 官網，一時似課程海報。
你叫佢做影片，頭 30 秒節奏幾好，後面突然開始堆字、亂咁切畫面。
你叫佢生成圖片，"賽博朋克"、"高級感" 佢都聽得明，但一到真實項目，出圖一張一個樣。
原因好簡單 — Agent 默認接到嘅係一個"任務"，但複雜產物需要嘅係一條"生產線"。
一個好嘅 Skill 要提供啲咩？
明確嘅工作流程（幾時應該問、幾時應該做、幾時應該停低俾你睇）
明確嘅質量標準（咩叫好、咩叫 AI 味太重）
明確嘅迭代接口（唔滿意時應該反饋啲咩、Agent 知道要改邊一層）
呢幾點組合埋一齊，Skill 先可以變成 "一套穩定嘅工作系統"。
呢個都係 garden-skills 想做嘅嘢。
下面，我會正式介紹一下我呢幾個 Skills，同埋最近嘅一啲重點更新。
1. 影片製作 Skill：將文章做成網頁影片
第一個係 web-video-presentation。
佢可以幫你將文章、劇本、課程、產品 Demo、技術分享等任何文字內容，轉化成基於網頁製作嘅演示影片。
注意，呢度講嘅 "影片" 唔係直接生成 mp4。
佢生成嘅係一個用 "網頁" 模擬嘅影片效果。
你可以點擊或者用鍵盤推進章節，每一步對應一段旁白、一組畫面、一段節奏。
錄屏嗰陣，就好似在播放一個精心設計過嘅影片。
點解要用網頁做影片？
如果你做過 AI 影片，大概知道長影片最麻煩嘅地方：隨機抽卡、消耗爆炸。
畫風一變、節奏一亂，前面鋪好嘅嘢全部散曬。
網頁嘅優勢在於，佢可以將 "影片" 拆成工程。
章節、步驟、旁白、畫面、主題、進度控制，全部都可以俾代碼控制。
Agent 生成之後，你可以繼續叫佢局部修改：
"第三章節奏太 flat 啦，整到似發佈會 Keynote 咁。" "呢一頁文字太多，加一個友好嘅動畫效果。" "結尾冇記憶點，加一個總結式大屏幕。"
適合做呢啲嘢：
技術文章影片化 產品功能演示 課程講解 發佈會式演示 科普內容 知識類短影片 公眾號文章轉影片
最近更新 - 主題
新增咗內置多套主題模板，覆蓋演講、技術架構、數據報告、科普、終端風、雜誌風等唔同方向。
另外，我做咗一個在線效果預覽網站，幫大家快速揀適合自己內容嘅主題：
網址：https://mmh1.top/#/ai-application/web-video-presentation
下面係部分主題嘅效果預覽（完整嘅大家可以上網站自己睇）：
bold-signal 適合產品發佈、營銷片頭、投資人 pitch 同品牌主張。佢嘅大色塊同大標題好適合做強觀點開場，第一眼衝擊力會更強。
terminal-green 適合 CLI 工具教學、命令行實操、安全話題同黑客風內容。佢嘅終端感好強，適合嗰種邊講邊演示、技術味比較重嘅影片。
newsroom 適合熱點解讀、時事評論、深度報道同 AI 產品分析。佢似一份報紙特稿，適合有觀點、有資料、有敍事嘅內容。
electric-studio 適合 B2B 產品演講、投資人路演、企業財報同行業研究。佢係白底電光藍風格，睇起嚟清晰、商務，但唔會太死板。
bauhaus-bold 適合觀點宣言、設計演講、產品發佈同品牌主張。佢嘅包豪斯同布魯塔利風格好直接，適合嗰種態度鮮明嘅影片。
creative-voltage 比較適合創意分享、設計周、工作室作品集同視覺文化類內容。佢唔係穩重嘅企業風，而係更似設計工作室、藝術節、創作者發佈會。
neon-cyber 適合 AI、大模型、web3、網絡安全同未來科技內容。佢嘅霓虹感比較強，適合節奏快、衝擊力強嘅影片。
vintage-editorial 適合個人觀點、文化隨筆、美學話題同設計評論。佢比較有“專欄作者”嘅氣質，適合有個人表達嘅影片。
split-canvas 適合雙主題對比、概念對照、辯論同故事講述。左右雙色畫布好適合做“過去 vs 現在”“A 方案 vs B 方案”呢類內容。
dark-botanical 適合品牌故事、時尚、美妝、旅行、藝術評論同高端產品發佈。佢有啲時尚雜誌同博物館圖錄嘅感覺，更適合偏向品牌片嘅內容。
forest-ink 適合自然、可持續、户外品牌、農業、紀錄片同人文觀察。佢似舊版《國家地理》嘅氣質，沉穩，有文獻感。
最近更新 - 支援自定義 TTS
第一個版本只支援咗 MiniMax CLI 進行音頻合成，考慮到大多數人嘅需求，新版將 TTS 整成可插拔嘅方式。
內置咗 MiniMax 同 OpenAI TTS 示例，亦都為 ElevenLabs、edge-tts、Azure、Google Cloud 等其他 TTS 留咗接入方式。
最簡單嘅方法，你直接將你嘅 TTS 接口俾 Agent，佢就可以自己進行適配。
用好佢嘅幾個建議
如果你想出比較穩定嘅效果，有三件事值得留意。
模型好關鍵。
目前試過之後效果最好嘅係 Opus 4.7。
影片製作 Skill 入面有好多審美判斷、章節規劃、代碼實現同返工決策。
模型能力唔夠，最後嘅效果可能差天共地。
第一輪 Review 一定要認真睇。
好多人一開頭就叫 Agent 直接做完整影片，跑完就發現唔滿意。
呢類長任務最怕前面方向錯咗，後面做得幾精緻都冇用。
劇本、主題、章節大綱、視覺方向，喺前面定得越清楚，後面返工就越少。
如果第一輪 outline 唔滿意，就直接改。
該刪章節就刪章節，該換風格就換風格，該調節奏就調節奏。
唔好覺得"等佢做完先算"。
唔好期望一步到位，但都唔好覺得唔滿意就係失敗。
比較好嘅做法係：先叫 Agent 做完整版本，整體行得通之後，再揀唔滿意嘅章節繼續調整。
"第二章太平"、"第四章資訊太密"、"缺少動畫效果"，呢啲都可以單獨反饋。
Agent 好擅長呢種局部迭代。
你用得越多，就越知道自己想要咩，亦越容易將佢調校成適合自己內容風格嘅版本。
2. 網頁設計 Skill：令 Agent 似專業設計師
第二個係 web-design-engineer。
佢同影片製作 Skill 有啲交集，但目標唔同。
AI 生成網頁最常見嘅問題，就係一眼就睇得出 “呢個係 AI 整嘅”。
大漸變、玻璃卡片、發光邊框、過度圓角、資訊排布鬆散...
睇起嚟元素唔少，實際上都係千篇一律嘅老套路。
web-design-engineer 就係為咗解決呢個問題。
佢會將 Agent 從 “套預設審美” 拉返去真正嘅網頁設計流程入面：
先判斷產品類型同受眾，再確定視覺方向、資訊層級、排版節奏、組件密度同交互細節。
目標係令 AI 整出嚟嘅網頁更似有經驗嘅設計師同前端一齊打磨過，而唔係一張常見嘅 AI 模板圖。
用佢嚟做官網、著陸頁、Dashboard、活動頁、作品集、交互原型，都可以明顯減少 AI 味，做出更驚豔、更有設計感嘅網頁效果。
最近更新 - 新增主題模板
最新版本增加咗 25 套唔同嘅設計風格。
每套模板都會包含具體嘅設計規則：顏色、字體、版式、標誌性動作、適合場景、需要避開嘅套路等等。
好多時候你同 Agent 講 "高級啲"、"有設計感啲"，佢可能根本唔知你想要咩。
而家，你俾佢一個大概方向，佢就可以自動推斷出比較匹配嘅設計風格。
同樣地，我都提供咗一個在線預覽嘅網站，部署喺 Easy AI 上：
在線效果預覽：
web-design-engineer 在線預覽
下面係部分主題嘅效果預覽（完整嘅大家可以上網站自己睇）：
linear 適合 B2B SaaS、開發者工具、項目管理工具同 AI 工具官網。佢唔會將頁面整得太花巧，但會保留足夠嘅產品質感。
raycast 適合效率工具、命令面板、開發者工作流同工具型產品。佢嘅暗色同快捷感好強，適合偏極客嘅產品。
aesop 適合美妝、護膚、精品零售同生活方式品牌。佢嘅關鍵唔係“高級灰”，而係留白、文字比例、產品圖同空間感。
tufte-dataink 適合數據敍事、研究報告、論文圖表同資訊可視化。佢會盡量減少裝飾，將注意力放喺數據本身。
field-io 適合藝術科技、互動裝置、創意工作室同動態視覺官網。佢比較實驗性，適合做有視覺探索感覺嘅頁面。
active-theory 適合電影感發布頁、品牌 Campaign、遊戲 / 娛樂產品同沉浸式首屏。佢嘅衝擊力強，適合需要第一屏就抓住人嘅項目。
bloomberg-businessweek-turley 適合雜誌封面、觀點專題同強視覺編輯頁。佢更大膽、更誇張，適合需要強衝突感嘅內容。
balenciaga-post-2017 適合時裝、潮流、反奢侈品同冷感品牌頁。佢會刻意生硬、壓迫、反常規，唔適合温和型產品。
mailchimp-freddie 適合社區、創業工具、小團隊產品同 B2C SaaS。佢更温暖，亦更容易拉近同用戶嘅距離。
headspace-meditation 適合健康、心理、教育同兒童產品。佢圓潤、輕鬆，適合低壓力嘅產品體驗。
y2k-retrofuturism 適合 Y2K 活動頁、音樂、潮流、復古科技同年輕化 Campaign。佢辨識度好高，適合想要明顯年代感嘅頁面。
完整嘅主題效果大家可以去呢個網站睇：https://mmh1.top/#/ai-application/web-design-engineer
3. 圖片生成 Skill：精準復刻各種主流生圖玩法
第三個係 gpt-image-2。
面向 GPT Image 2 同 OpenAI 兼容圖像 API。
可以幫你做海報、UI Mockup、產品圖、資訊圖、論文圖、技術架構圖、漫畫、頭像、分鏡、品牌板，以及圖片編輯工作流程。
好多人對圖片生成嘅理解仲停留喺一句 Prompt — "生成一張科技感海報""做一個高級嘅產品圖"。
呢種方式出到圖，但結果就唔穩定。
真正做項目嗰陣，你好快會遇到更多問題：
尺寸係幾多？主體放喺邊？文字區域使唔使留白？風格參考係咩？要唔要分層？可唔可以安全裁切？要唔要適配公眾號封面、PPT、官網首屏？
gpt-image-2 就係解決呢啲問題。
佢將圖像任務拆成唔同類別，提供結構化模板。
目前包含 18 大類、79 個結構化 Prompt 模板，覆蓋生成同編輯兩類工作流程。
一個好嘅圖片 Prompt，通常需要同時描述：畫面目標、主體與關係、構圖、材質、光線、字體與文字限制、輸出尺寸、後續編輯空間。
好多失敗圖片，唔係因為模型聽唔明風格詞，而係任務本身缺少結構。
例如你要做一張系統架構圖，只講 "現代、清晰、科技感" 可能遠遠唔夠。
你要說明有邊啲模塊、模塊之間點樣連接、主次層級係咩、邊啲文字一定要準確、邊啲區域需要留白。
Skill 嘅作用就係盡量少啲叫模型亂估。佢叫 Agent 先將任務拆清楚，先至進入生成階段。
三種運行模式
Skill 支援三種生圖模式：
本地模式，直接調接口出圖並保存到本地（需要你自己提供生圖 API Key）。
宿主工具模式，將整理好嘅 Prompt 交俾當前 Agent 自帶嘅圖像工具（例如喺 CodeX 環境入面）。
顧問模式，喺冇圖像工具嘅時候，退化做 Prompt 顧問，幫你將 Prompt 寫到可執行嘅水平。
呢個設計好重要。
因為唔同用戶嘅 Agent 環境差異好大 — 有人喺本地行，有人用 Codex，有人用 Claude Code，有人只需要 Prompt。
Skill 會先判斷環境，再決定點樣工作，可以減少好多隱性失敗。
最近更新 - 在線體驗 Image2
生圖 Skill 本身最近冇咩更新。
但係應好多同學嘅要求，我俾我嘅 Image2 提示詞網站加咗個在線體驗模塊：
喺提示詞詳情頁，你亦可以直接點擊一鍵體驗：
就會自動跳轉到呢個模塊，然後將提示詞填寫好，你可以自由更改你嘅提示詞：
最後
Skills 開源倉庫地址：https://github.com/ConardLi/garden-skills
7K Star 有啲超出預期。
但比起數字，更令我開心嘅係好多人真係攞佢嚟整自己嘅嘢。
如果你最近都有用 Agent 做內容創作、前端頁面或者圖片生成，可以直接攞去試嚇。
Skill 最終好唔好，唔可以淨係睇 Demo 靚唔靚，仲要經得起真實任務嘅考驗。
三個在線體驗嘅網頁地址：
圖片生成：https://gpt-image2.mmh1.top/ 網頁設計：https://mmh1.top/#/ai-application/web-design-engineer 影片生成：https://mmh1.top/#/ai-application/web-video-presentation
如果呢啲 Skills 幫到你，嚟個免費嘅三連啦～
最近，我連續寫了幾篇關於 AI Agent 的教程。
一篇講怎麼用 Agent 做視頻，一篇講怎麼讓 Agent 做出更驚豔的網頁，還有一篇講怎麼用好 GPT Image2。
每篇文章後面，我都順手開源了一個 Skill。
本來只是想把自己這段時間沉澱下來的工作流整理出來，方便大家直接拿去用。
結果沒想到傳播得比我預想中快很多。
後來我把這些 Skill 整理到了一個合集倉庫裏：
https://github.com/ConardLi/garden-skills
寫這篇文章時，GitHub 已經接近 7K Star。
另外也很高興看到很多同學真正的把我的 Skill 用起來了：
也有一些大 V 轉發推薦，帶來了不少真實反饋。
這些反饋讓我更確定了一件事：
Skill 這東西，真正有價值的地方，不在提示詞寫得多漂亮。
它的價值在於把一套可重複穩定工作的方法交給 Agent。
Skill 到底解決了什麼問題？
很多人剛開始用 Agent 做複雜任務，都會遇到這樣的問題：
有時候效果很驚豔，有時候就開始飄了。
你讓它做網頁，它可能一會兒像 SaaS 官網，一會兒像課程海報。
你讓它做視頻，前 30 秒節奏很好，後面突然開始堆字、亂切畫面。
你讓它生成圖片，"賽博朋克"、"高級感" 它都聽得懂，可到了真實項目裏，出圖一張一個樣。
原因很簡單 — Agent 默認接到的是一個"任務"，可複雜產物需要的是一條"生產線"。
一個好 Skill 要提供什麼？
明確的工作流程（什麼時候該問、什麼時候該做、什麼時候該停下來讓你看）
明確的質量標準（什麼算好、什麼算 AI 味太重）
明確的迭代接口（不滿意時該反饋什麼、Agent 知道該改哪一層）。
這幾個點組合起來，Skill 才能變成 "一套穩定性的工作系統"。
這也是 garden-skills 想做的事。
下面，我會正式介紹一下我這幾個 Skills，以及最近的一些重點更新。
1. 視頻製作 Skill：把文章做成網頁視頻
第一個是 web-video-presentation。
它可以幫你把文章、腳本、課程、產品 Demo、技術分享等任何文字內容，轉化成基於網頁製作的演示視頻。
注意，這裏說的 "視頻" 不是直接生成 mp4。
它生成的是一個用 “網頁“ 模擬的視頻效果。
你可以點擊或用鍵盤推進章節，每一步對應一段旁白、一組畫面、一段節奏。
錄屏時，就像在播放一個精心設計過的視頻。
為什麼要用網頁做視頻？
如果你做過 AI 視頻，大概率知道長視頻最麻煩的地方：隨機抽卡、消耗爆炸。
畫風一變、節奏一亂，前面鋪好的東西全散了。
網頁的優勢在於，它能把 "視頻" 拆成工程。
章節、步驟、旁白、畫面、主題、進度控制，全都可以被代碼控制。
Agent 生成後，你還能繼續讓它局部修改：
"第三章節奏太平了，做得更像發佈會 Keynote。" "這一頁文字太多，加一個友好的動畫效果。" "結尾沒有記憶點，加一個總結式大屏。"
適合做這些東西：
技術文章視頻化 產品功能演示 課程講解 發佈會式演示 科普內容 知識類短視頻 公眾號文章轉視頻
最近更新 - 主題
新增內置了多套主題模板，覆蓋演講、技術架構、數據報告、科普、終端風、雜誌風等不同的方向。
另外，我做了一個在線效果預覽網站，幫助大家快速選擇適合自己內容的主題：
網址：https://mmh1.top/#/ai-application/web-video-presentation
下面是部分主題的效果預覽（完整的大家可以到網站上自己去看）：
bold-signal 適合產品發佈、營銷片頭、投資人 pitch 和品牌主張。它的大色塊和大標題很適合做強觀點開場，第一眼衝擊力會更強。
terminal-green 適合 CLI 工具教程、命令行實操、安全話題和黑客風內容。它的終端感很強，適合那種邊講邊演示、技術味比較重的視頻。
newsroom 適合熱點解讀、時事評論、深度報道和 AI 產品分析。它像一篇報紙特稿，適合有觀點、有資料、有敍事的內容。
electric-studio 適合 B2B 產品演講、投資人路演、企業財報和行業研究。它是白底電光藍風格，看起來清晰、商務，但不會太死板。
bauhaus-bold 適合觀點宣言、設計演講、產品發佈和品牌主張。它的包豪斯和布魯塔利風格很直接，適合那種態度鮮明的視頻。
creative-voltage 比較適合創意分享、設計周、工作室作品集和視覺文化類內容。它不是穩重的企業風，而是更像設計工作室、藝術節、創作者發佈會。
neon-cyber 適合 AI、大模型、web3、網絡安全和未來科技內容。它的霓虹感比較強，適合節奏快、衝擊力強的視頻。
vintage-editorial 適合個人觀點、文化隨筆、美學話題和設計評論。它比較有“專欄作者”的氣質，適合有個人表達的視頻。
split-canvas 適合雙主題對比、概念對照、辯論和故事講述。左右雙色畫布很適合做“過去 vs 現在”“A 方案 vs B 方案”這種內容。
dark-botanical 適合品牌故事、時尚、美妝、旅行、藝術評論和高端產品發佈。它有一點時尚雜誌和博物館圖錄的感覺，更適合偏品牌片的內容。
forest-ink 適合自然、可持續、户外品牌、農業、紀錄片和人文觀察。它像舊版《國家地理》的氣質，沉穩，有文獻感。
最近更新 - 支持自定義 TTS
第一個版本只支持了 MiniMax CLI 進行音頻合成，考慮到大多數人的需求，新版把 TTS 做成了可插拔的方式。
內置 MiniMax 和 OpenAI TTS 示例，也給 ElevenLabs、edge-tts、Azure、Google Cloud 等其他 TTS 留了接入方式。
最簡單的，你直接把你的 TTS 接口發給 Agent，它就能自己進行適配了。
用好它的幾個建議
如果你想出比較穩定的效果，有三件事值得注意。
模型很關鍵。
目前試下來效果最好的是 Opus 4.7。
視頻製作 Skill 裏有很多審美判斷、章節規劃、代碼實現和返工決策。
模型能力不行，最後的效果可能千差萬別。
第一輪 Review 一定要認真看。
很多人一上來就讓 Agent 直接做完整視頻，跑完發現不滿意。
這類長任務最怕前面方向錯了，後面做得再精緻也沒用。
腳本、主題、章節大綱、視覺方向，在前面定得越清楚，後面返工越少。
如果第一輪 outline 不滿意，就直接改。
該刪章節刪章節，該換風格換風格，該調節奏就調節奏。
不要覺得"先讓它做完再說"。
別期待一次到位，但也別覺得不滿意就是失敗。
更好的方式是：先讓 Agent 做完整版本，整體跑通後，挑不滿意的章節繼續調。
"第二章太平"、"第四章信息太密"、"缺少動畫效果"，這些都可以單獨反饋。
Agent 很擅長這種局部迭代。
你用得越多，越知道自己想要什麼，也越容易把它調成適合自己內容風格的版本。
2. 網頁設計 Skill：讓 Agent 像專業設計師
第二個是 web-design-engineer。
它和視頻製作 Skill 有一定交集，但目標不一樣。
AI 生成網頁最常見的問題，就是一眼就能看出 “這是 AI 做的”。
大漸變、玻璃卡片、發光邊框、過度圓角、信息排布鬆散...
看起來元素不少，實際都是千篇一律的老套路。
web-design-engineer 就是為了解決這個問題。
它會把 Agent 從 “套默認審美” 拉回到真正的網頁設計流程裏：
先判斷產品類型和受眾，再確定視覺方向、信息層級、排版節奏、組件密度和交互細節。
目標是讓 AI 做出來的網頁更像有經驗的設計師和前端一起打磨過，而不是一張常見的 AI 模板圖。
用它來做官網、落地頁、Dashboard、活動頁、作品集、交互原型，都能明顯減少 AI 味，做出更驚豔、更有設計感的網頁效果。
最近更新 - 新增主題模板
最新版本增加了 25 套不同的設計風格。
每套模板都會包含具體的設計規則：顏色、字體、版式、標誌性動作、適合場景、需要避開的套路等等。
很多時候你跟 Agent 說 "高級一點"、"有設計感一點"，它可能並不知道你要什麼。
現在，你給它一個大概的方向，它就能自動推斷出比較匹配的設計風格。
同樣的，我也提供了一個在線預覽的網站，部署在 Easy AI 上：
在線效果預覽：
web-design-engineer 在線預覽
下面是部分主題的效果預覽（完整的大家可以到網站上自己去看）：
linear 適合 B2B SaaS、開發者工具、項目管理工具和 AI 工具官網。它不會把頁面做得太花，但會保留足夠的產品質感。
raycast 適合效率工具、命令面板、開發者工作流和工具型產品。它的暗色和快捷感很強，適合偏極客的產品。
aesop 適合美妝、護膚、精品零售和生活方式品牌。它的關鍵不是“高級灰”，而是留白、文字比例、產品圖和空間感。
tufte-dataink 適合數據敍事、研究報告、論文圖表和信息可視化。它會盡量減少裝飾，把注意力放在數據本身。
field-io 適合藝術科技、互動裝置、創意工作室和動態視覺官網。它更實驗一些，適合做有視覺探索感的頁面。
active-theory 適合電影感發布頁、品牌 Campaign、遊戲 / 娛樂產品和沉浸式首屏。它的衝擊力強，適合需要第一屏抓住人的項目。
bloomberg-businessweek-turley 適合雜誌封面、觀點專題和強視覺編輯頁。它更大膽、更誇張，適合需要強衝突感的內容。
balenciaga-post-2017 適合時裝、潮流、反奢侈品和冷感品牌頁。它會刻意生硬、壓迫、反常規，不適合温和型產品。
mailchimp-freddie 適合社區、創業工具、小團隊產品和 B2C SaaS。它更温暖，也更容易拉近和用戶的距離。
headspace-meditation 適合健康、心理、教育和兒童產品。它圓潤、輕鬆，適合低壓力的產品體驗。
y2k-retrofuturism 適合 Y2K 活動頁、音樂、潮流、復古科技和年輕化 Campaign。它識別度很高，適合想要明顯年代感的頁面。
完整的主題效果大家可以去這個網站上看：https://mmh1.top/#/ai-application/web-design-engineer
3. 圖片生成 Skill：精準復刻各種主流生圖玩法
第三個是 gpt-image-2。
面向 GPT Image 2 和 OpenAI 兼容圖像 API。
可以幫你做海報、UI Mockup、產品圖、信息圖、論文圖、技術架構圖、漫畫、頭像、分鏡、品牌板，以及圖片編輯工作流。
很多人對圖片生成的理解還停留在一句 Prompt — "生成一張科技感海報""做一個高級的產品圖"。
這種方式能出圖，但結果就不太穩定了。話。
真正做項目時，你很快會遇到更多問題：
尺寸是多少？主體放在哪裏？文字區域要不要留白？風格參考是什麼？要不要分層？能不能安全裁切？要不要適配公眾號封面、PPT、官網首屏？
gpt-image-2 解決的就是這些問題。
它把圖像任務拆成了不同類別，提供結構化模板。
目前包含 18 大類、79 個結構化 Prompt 模板，覆蓋生成和編輯兩類工作流。
一個好的圖片 Prompt，通常需要同時描述：畫面目標、主體與關係、構圖、材質、光線、字體與文字限制、輸出尺寸、後續編輯空間。
很多失敗圖片，不是因為模型聽不懂風格詞，而是任務本身缺少結構。
比如你要做一張系統架構圖，只說 "現代、清晰、科技感" 可能遠遠不夠。
你要說明有哪些模塊、模塊之間怎麼連接、主次層級是什麼、哪些文字必須準確、哪些區域需要留白。
Skill 的作用就是儘量少讓模型猜。它讓 Agent 先把任務拆清楚，再進入生成階段。
三種運行模式
Skill 支持三生圖模式：
本地模式，直接調接口出圖並落盤（需要你自己提供生圖 API Key）。
宿主工具模式，把整理好的 Prompt 交給當前 Agent 自帶的圖像工具（如在 CodeX 環境中）。
顧問模式，在沒有圖像工具時，退化成 Prompt 顧問，幫你把 Prompt 寫到可執行水平。
這個設計很重要。
因為不同用戶的 Agent 環境差異很大 — 有人在本地跑，有人用 Codex，有人用 Claude Code，有人只需要 Prompt。
Skill 先判斷環境，再決定怎麼工作，能減少很多隱性失敗。
最近更新 - 在線體驗 Image2
生圖 Skill 本身最近沒啥更新。
但是應很多同學的要求，我給我的 Image2 提示詞網站加了個在線體驗模塊:
在提示詞詳情頁，你也可以直接點擊一鍵體驗：
就會自動跳轉到這個模塊，然後把提示詞填充好，你可以自由更改你的提示詞：
最後
Skills 開源倉庫地址：https://github.com/ConardLi/garden-skills
7K Star 有點超出預期。
但比數字更讓我開心的是，很多人真的拿它去做自己的東西了。
如果你最近也在用 Agent 做內容創作、前端頁面或者圖片生成，可以直接拿去試試。
Skill 最終好不好，不能只看 Demo 漂不漂亮，還要經得起真實任務折騰。
三個在線體驗的網頁地址：
圖片生成：https://gpt-image2.mmh1.top/ 網頁設計：https://mmh1.top/#/ai-application/web-design-engineer 視頻生成：https://mmh1.top/#/ai-application/web-video-presentation
如果這些 Skills 有幫助到你，來個免費的三連吧～