AI也能做出雜誌級設計了,Claude Design的開源替代Open Design已經支持Kami,上手指南

作者:惡人筆記
日期:2026年5月2日 下午11:16
來源:WeChat 原文

整理版優先睇

速讀 5 個重點 高亮

Open Design + Kami 組合:開源社區重新定義 AI 設計質感,本地優先嘅雜誌級設計系統

整理版摘要

呢篇文章介紹咗 Open Design 呢個 Claude Design 嘅開源替代品,同埋佢最新集成嘅 Kami 設計系統。作者親身安裝試用,整合官方 README 同社區反饋,提供完整上手指南。

Open Design 係一個 Agent 驅動嘅本地優先設計生成平台,支援 11+ 種 Coding Agent,內置 72 個品牌級 DESIGN.md 同 31 個 Skill,配合強制問題表單同反 Slop 黑名單,大幅降低 AI 廉價感。Kami(日文「紙」)係 @HiTw93 嘅個人作品,專注印刷品質感:羊皮紙背景、墨藍強調色、Charter 同倉耳金楷字體,嚴格排版規則。

結論係:如果你成日用 AI 做簡報、作品集,而且對「專業質感」有高要求,呢個組合而家就值得裝。上手門檻中等(約 15-30 分鐘),但質量領先、開源可審計,成本可控。

  • Open DesignClaude Design 嘅本地優先、完全開源替代品,支援 11+ 種 Agent 自動生成高質量設計產物。
  • Kami 設計系統提供印刷品質感,用羊皮紙背景、墨藍色、襯線字體,令數位內容有「紙質榮光」。
  • 內置 72 個品牌級 DESIGN.md 同 31 個可組合 Skill,覆蓋雜誌海報、Pitch Deck、簡歷、作品集等。
  • Slop 機制(禁止紫色漸變、emoji 濫用等)加上實時 Todo 流同五維自評,確保輸出專業。
  • 上手步驟Clone 倉庫 → pnpm install → 選 Skill → 選 Kami → 填 Discovery Form → 等 Agent 完成 → 一鍵導出 PDF/PPTX。
值得記低
連結 github.com

Open Design 官方倉庫

GitHub 倉庫,包含完整安裝說明同設計系統庫

連結 github.com

Kami 設計系統

@HiTw93 嘅個人項目,專為印刷品質感設計

整理重點

Open Design:Agent 驅動嘅設計生成平台

Open Design 唔係「AI 畫圖工具」,而係一個 Agent 驅動嘅設計生成平台。佢嘅核心能力係令 Claude CodeCodex、Cursor、Gemini CLI 等 11+ 種主流 Coding Agent 自動喺本地文件系統生成高質量設計產物。支援輸出 Web/移動/桌面原型、Pitch Deck、簡歷、作品集、雜誌海報、信函、甚至短視頻同 HyperFrames。

  • 內置 72 個品牌級 DESIGN.md,包括 LinearStripeVercel、Apple、Notion、小紅書、Tesla 等。
  • 31 個可組合 Skill,例如 magazine-poster、guizang-ppt。
  • 獨特機制:沙盒預覽、實時 Todo 流、強制問題表單、五維自評、反 Slop 黑名單——禁止紫色漸變、emoji 濫用、Inter 做標題等。
  • 導出格式HTML / PDF / PPTX / ZIP / Markdown,一鍵專業輸出。
整理重點

Kami 設計系統:紙質榮光嘅秘密

Kami(日語「紙」)係 @HiTw93 嘅個人作品,核心理念係「Good content deserves good paper」。佢唔係傳統 UI 組件庫,而係一個嚴格約束嘅印刷品設計系統。

  • 視覺基調:温暖羊皮紙背景 #f5f4ed,唯一強調色墨藍 #1B365D,大量暖調中性色。
  • 字體體系:英文 Charter,中文倉耳金楷(TsangerJinKai02),日文 YuMincho;行高、字重、層次寫死喺規則。
  • 排版哲學:極簡陰影(whisper/ring 兩種),緊湊標題行高 1.1-1.3,舒適正文行高 1.5-1.55,絕對禁止「AI 味」裝飾。
  • 支援類型One-PagerLong DocLetter、Portfolio、Resume、Slides(含 WeasyPrint 優化模板)。

Open Design 集成 Kami 後,額外提供 kami-deck.html 模板,專為橫版雜誌風 Pitch Deck 優化。

整理重點

上手指南:由安裝到生成第一個雜誌風設計

環境準備需要 Node.js ≈ 24、pnpm 10.33.x,同至少一個 Agent CLI(推薦 Claude Code)。跟住一鍵 Clone 倉庫、pnpm install、pnpm tools-dev run web。

  1. 1 選擇 Skill:雜誌風單頁揀 magazine-poster;Pitch Deck 揀 guizang-ppt;簡歷/作品集用對應文檔 Skill。
  2. 2 選擇 Design System → 搜尋並選中 Kami
  3. 3 輸入自然語言 Prompt,例如「幫我做一份 2 頁英文創始人簡歷,突出技術深度與產品思維」。
  4. 4 填寫 Discovery Form:表面、受眾、語氣、品牌背景、規模、約束(必須填)。
  5. 5 選擇視覺方向(或直接用 Kami 預設),等 Agent 實時輸出。
  6. 6 滿意後一鍵導出 PDF / PPTX / HTML
整理重點

值唔值得試?優點同侷限分析

優點方面,Kami 嘅約束機制加上 Open Design 嘅反 Slop 流程,令輸出穩定喺「專業印刷品」水準。本地優先、開源、生態成型(72 個設計系統 + 31 個 Skill),成本可控。

侷限係上手門檻中等,純小白要花 15-30 分鐘設定。依賴底層模型能力,弱模型容易「翻車」。中文字體商用要留意授權。複雜長文檔仍需人手二審。

如果你成日用 AI 做簡報、作品集,對「專業質感」有高要求,而家就值得裝。純零技術背景可以等桌面版或社區教程。

整理重點

總結:開源社區嘅野心同誠意

Open Design + Kami 嘅組合展示咗開源社區點樣將「紙質嘅榮光」重新帶返數碼世界。紙質時代雖然過咗,但專業有質感嘅標準永遠唔會過時。呢個方案唔係完美神器,但夠曬誠實、開放同有野心。

Claude Design係一款好勁嘅AI設計工具,之前都分享過一個佢嘅開源替代品Open CoDesign,今日再分享一個本地替代方案:Open Design,而且佢啱啱更新支持咗Kami設計系統,社區對呢個嘅評價已經好吸引人:「呢個真係我見過最好睇嘅設計系統之一」「重現紙質嘅榮光」。


一、Open Design係咩嘢?

簡單講,Open Design係Anthropic Claude Design嘅本地優先、完全開源替代品。佢唔係一個「AI畫圖工具」,而係一個Agent驅動嘅設計生成平台

  • • 核心能力:令 Claude Code、Codex、Cursor、Gemini CLI、Hermes、Kimi CLI等 11+ 種主流 coding agent 自動喺本地文件系統入面生成高質量設計產物。
  • • 支援內容:Web/流動/桌面原型、Pitch Deck、履歷、作品集、雜誌海報、信函、甚至短視頻同 HyperFrames。
  • • 設計系統庫:內置 72 個品牌級 DESIGN.md(Linear、Stripe、Vercel、Apple、Notion、小紅書、Tesla……幾乎覆蓋主流產品),加上 31 個可組合 Skill(magazine-poster、guizang-ppt 等)。
  • • 獨特機制:沙盒預覽 + 實時 Todo 流 + 強制問題表單 + 五維自評 + 反 Slop 黑名單(禁止紫色漸變、emoji 濫用、Inter 做標題等),極大降低「AI 廉價感」。
  • • 匯出格式:HTML / PDF / PPTX / ZIP / Markdown,一鍵專業輸出。
圖片

最關鍵嘅更新(就係尋日):正式集成Kami設計系統,令任何生成內容都擁有「專業雜誌/書籍」嘅紙質質感。

圖片
圖片

二、Kami:點解被稱為「紙質嘅榮光」?

Kami(日語「紙」)係@HiTw93嘅個人作品,核心理念只有一句話:Good content deserves good paper.

佢唔係傳統UI組件庫,而係一個嚴格約束嘅印刷品設計系統

  • • 視覺基調:温暖羊皮紙背景(#f5f4ed,唔係純白)、唯一強調色墨藍(#1B365D)、大量暖調中性色。
  • • 字體體系:英文用 Charter(經典襯線),中文用倉耳金楷(TsangerJinKai02,個人免費,商用需授權),日文 YuMincho。行高、字重、層次全部寫死喺規則入面。
  • • 排版哲學:極簡陰影(只有 whisper/ring 兩種)、緊湊標題行高(1.1-1.3)、舒適正文行高(1.5-1.55)、絕對禁止「AI 味」裝飾。
  • • 支援類型:One-Pager、Long Doc、Letter、Portfolio、Resume、Slides(含 WeasyPrint 優化模板)。

具體呈現效果就係:你用同樣 Prompt 生成嘅嘢,瞬間從「睇得」變成「想收藏、想打印、想發朋友圈」

圖片
圖片

Open Design 今次集成後,唔單止支援 Kami 所有文檔類型,仲額外做咗 kami-deck.html 模板,專為橫版雜誌風 Pitch Deck 優化。


三、具體使用方法(上手指南)

1. 環境準備(可能最花時間嘅一步)

  • • Node.js ≈ 24(推薦用 nvm/fnm 管理)
  • • pnpm 10.33.x(corepack enable 之後自動)
  • • 至少一個 Agent CLI(推薦順序):
    • ◦ Claude Code(最勁)
    • ◦ Codex / Cursor / Hermes / Kimi CLI等
    • ◦ 冇都冇問題,用內置 BYOK 代理,填上任意OpenAI兼容嘅大模型key就得

2. 一鍵啟動

git clone https://github.com/nexu-io/open-design.git
cd open-design
pnpm install
pnpm tools-dev run web

啟動後打開終端顯示嘅本地地址(通常 http://localhost:xxxx),首次運行會自動創建 .od/ 文件夾(SQLite 數據庫 + 項目工作區)。

3. 日常生成流程(極簡)

  1. 圖片
    1. 選擇 Skill(左側選單):
    • ◦ 想做雜誌風單頁 → magazine-poster
    • ◦ 想做 Pitch Deck → guizang-ppt(推薦)
    • ◦ 履歷/作品集/信函 → 對應文檔 skill
  2. 2. 選擇 Design System → 搜索並揀中 Kami
  3. 3. 輸入自然語言 Prompt,例如:
    • ◦ 「為我嘅種子輪做一個 8 頁雜誌風格嘅 pitch deck,目標係早期投資人,語氣專業且有故事感」
    • ◦ 「幫我做一份 2 頁英文創始人履歷,突出技術深度同產品思維」
  4. 4. 填寫 Discovery Form(必須):表面、受眾、語氣、品牌背景、規模、約束。
  5. 5. 選擇視覺方向(或者直接用 Kami 預設)。
  6. 6. 等 Agent 實時輸出 Todo 計劃 → 文件寫入 → 沙盒 iframe 預覽。
  7. 7. 滿意後一鍵匯出 PDF / PPTX / HTML。

此外,Kami獨立使用都得(唔經Open Design):
npx skills add tw93/kami -a claude-code -g -y
然後喺Claude Code入面直接講「用 Kami 風格做一份作品集」就得。


四、分析:值唔值得試嚇?

優點

  • • 質量確實領先:Kami 嘅約束機制 + Open Design 嘅反 Slop 流程,令輸出穩定喺「專業印刷品」水準。
  • • 本地優先 + 開源:數據唔上傳、完全可審計、可深度定製。
  • • 生態已成型:72 個設計系統 + 31 個 skill,基本覆蓋 95% 日常需求。
  • • 成本可控:用開源模型或者自建模型就跑到;匯出格式直接商用無水印。

侷限

  • • 上手門檻中等:Node + pnpm + Agent CLI 配置,對純小白仲有挑戰(預計 15-30 分鐘)。
  • • 依賴底層模型能力:Claude強,弱模型容易「翻車」。
  • • 中文字體商用要留意授權。
  • • 生成複雜長文檔仲要人工二審(雖然機制已極大降低出錯率)。

總之,如果你每日都用 AI 寫嘢、做演示、發作品集,而且對「睇落專業」有強需求,咁佢而家就值得裝。 如果你只係偶爾用一次,或者完全零技術背景,建議等桌面版或者社區教程出咗先試。


最後

AI已經可以寫代碼、畫圖、做視頻,但「令內容擁有高級感」一向係好難嘅一塊拼圖。Open Design + Kami 嘅組合向我哋展示咗:開源社區正在將「紙質嘅榮光」重新帶返數字世界。紙質時代已過,但「專業、有質感」嘅標準,永遠唔會過時。雖然仲未係完美嘅神器,但佢夠誠實、夠開放、夠有野心。

Open Design項目: https://github.com/nexu-io/open-design
Kami項目: https://github.com/tw93/kami

(本文基於官方README、社區反饋同實際安裝體驗整理。觀點純屬個人判斷,非商業推廣。如有更新,以GitHub最新內容為準。)

Claude Design是一款強大的AI設計工具,之前也分享過一個它的開源替代品Open CoDesign,今天再分享一個本地替代:Open Design,而且它剛更新支持Kami設計系統了,社區對這個的評價已經足夠吸引人:“這真是我見過最好看的設計系統之一”“再現紙質的榮光”。


一、Open Design是什麼?

簡單說,Open Design是Anthropic Claude Design的本地優先、完全開源替代品。它不是一個“AI畫圖工具”,而是一個Agent驅動的設計生成平台

  • • 核心能力:讓 Claude Code、Codex、Cursor、Gemini CLI、Hermes、Kimi CLI等 11+ 種主流 coding agent 自動在本地文件系統裏生成高質量設計產物。
  • • 支持內容:Web/移動/桌面原型、Pitch Deck、簡歷、作品集、雜誌海報、信函、甚至短視頻與 HyperFrames。
  • • 設計系統庫:內置 72 個品牌級 DESIGN.md(Linear、Stripe、Vercel、Apple、Notion、小紅書、Tesla……幾乎覆蓋主流產品),加上 31 個可組合 Skill(magazine-poster、guizang-ppt 等)。
  • • 獨特機制:沙盒預覽 + 實時 Todo 流 + 強制問題表單 + 五維自評 + 反 Slop 黑名單(禁止紫色漸變、emoji 濫用、Inter 做標題等),極大降低“AI 廉價感”。
  • • 導出格式:HTML / PDF / PPTX / ZIP / Markdown,一鍵專業輸出。
圖片

最關鍵的更新(就在昨天):正式集成Kami設計系統,讓任何生成內容都能擁有“專業雜誌/書籍”的紙質質感。

圖片
圖片

二、Kami:為什麼被稱作“紙質的榮光”?

Kami(日語“紙”)是@HiTw93的個人作品,核心理念只有一句話:Good content deserves good paper.

它不是傳統UI組件庫,而是一個嚴格約束的印刷品設計系統

  • • 視覺基調:温暖羊皮紙背景(#f5f4ed,非純白)、唯一強調色墨藍(#1B365D)、大量暖調中性色。
  • • 字體體系:英文用 Charter(經典襯線),中文用倉耳金楷(TsangerJinKai02,個人免費,商用需授權),日文 YuMincho。行高、字重、層次全部寫死在規則裏。
  • • 排版哲學:極簡陰影(只有 whisper/ring 兩種)、緊湊標題行高(1.1-1.3)、舒適正文行高(1.5-1.55)、絕對禁止“AI 味”裝飾。
  • • 支持類型:One-Pager、Long Doc、Letter、Portfolio、Resume、Slides(含 WeasyPrint 優化模板)。

具體呈現效果就是:你用同樣 Prompt 生成的東西,瞬間從“能看”變成“想收藏、想打印、想發朋友圈”

圖片
圖片

Open Design 這次集成後,不僅支持 Kami 所有文檔類型,還額外做了 kami-deck.html 模板,專為橫版雜誌風 Pitch Deck 優化。


三、具體使用方法(上手指南)

1. 環境準備(可能最花時間的一步)

  • • Node.js ≈ 24(推薦用 nvm/fnm 管理)
  • • pnpm 10.33.x(corepack enable 後自動)
  • • 至少一個 Agent CLI(推薦順序):
    • ◦ Claude Code(最強)
    • ◦ Codex / Cursor / Hermes / Kimi CLI等
    • ◦ 沒有也行,用內置 BYOK 代理,填上任意OpenAI兼容的大模型key就行

2. 一鍵啓動

git clone https://github.com/nexu-io/open-design.git
cd open-design
pnpm install
pnpm tools-dev run web

啓動後打開終端顯示的本地地址(通常 http://localhost:xxxx),首次運行會自動創建 .od/ 文件夾(SQLite 數據庫 + 項目工作區)。

3. 日常生成流程(極簡)

  1. 圖片
    1. 選擇 Skill(左側菜單):
    • ◦ 想做雜誌風單頁 → magazine-poster
    • ◦ 想做 Pitch Deck → guizang-ppt(推薦)
    • ◦ 簡歷/作品集/信函 → 對應文檔 skill
  2. 2. 選擇 Design System → 搜索並選中 Kami
  3. 3. 輸入自然語言 Prompt,例如:
    • ◦ “為我的種子輪做一個 8 頁雜誌風格的 pitch deck,目標是早期投資人,語氣專業且有故事感”
    • ◦ “幫我做一份 2 頁英文創始人簡歷,突出技術深度與產品思維”
  4. 4. 填寫 Discovery Form(必須):表面、受眾、語氣、品牌背景、規模、約束。
  5. 5. 選擇視覺方向(或直接用 Kami 預設)。
  6. 6. 坐等 Agent 實時輸出 Todo 計劃 → 文件寫入 → 沙盒 iframe 預覽。
  7. 7. 滿意後一鍵導出 PDF / PPTX / HTML。

此外,Kami獨立使用也可以(不走Open Design):
npx skills add tw93/kami -a claude-code -g -y
然後在Claude Code裏直接說“用 Kami 風格做一份作品集”即可。


四、分析:值不值得試試?

優點

  • • 質量確實領先:Kami 的約束機制 + Open Design 的反 Slop 流程,讓輸出穩定在“專業印刷品”水準。
  • • 本地優先 + 開源:數據不上傳、完全可審計、可深度定製。
  • • 生態已成型:72 個設計系統 + 31 個 skill,基本覆蓋 95% 日常需求。
  • • 成本可控:用開源模型或自建模型就能跑;導出格式直接商用無水印。

侷限

  • • 上手門檻中等:Node + pnpm + Agent CLI 配置,對純小白仍有挑戰(預計 15-30 分鐘)。
  • • 依賴底層模型能力:Claude強,弱模型容易“翻車”。
  • • 中文字體商用需注意授權。
  • • 生成複雜長文檔仍需人工二審(雖然機制已極大降低出錯率)。

總之,如果你每天都在用 AI 寫東西、做演示、發作品集,且對“看起來專業”有強需求,那它現在就值得裝。 如果你只是偶爾用一次,或者完全零技術背景,建議等桌面版或社區教程出來再試。


最後

AI已經能寫代碼、畫圖、做視頻,但“讓內容擁有高級感”一直是很難的一塊拼圖。Open Design + Kami 的組合向我們展示了:開源社區正在把“紙質的榮光”重新帶回數字世界。紙質時代已過,但“專業、有質感”的標準,永遠不會過時。雖然還不是完美的神器,但它足夠誠實、足夠開放、足夠有野心。

Open Design項目: https://github.com/nexu-io/open-design
Kami項目: https://github.com/tw93/kami

(本文基於官方README、社區反饋及實際安裝體驗整理。觀點純屬個人判斷,非商業推廣。如有更新,以GitHub最新內容為準。)