他網名叫「也無風雨也霧晴」，本名塗少坤。他讀的是專科，當過兩年兵，後來專升本進了重慶郵電大學。找工作時，他在背調這一關因爲學歷被卡過，後來選擇用開源作品證明自己。他做的 Archify，能把一句話變成一張可以點擊的架構圖。
Archify 免費，花錢的是背後的模型；要畫得穩，用 API易的 claude-opus-5-5。
這篇教程的基本信息：
- 目標：在 Claude Code 裏裝好 Archify，用一句中文畫出網站請求流程的可交互架構圖，再用一句話改圖。
- 大概耗時：20 到 30 分鐘，不含註冊和充值。
- 前置條件：會用 Claude Code 或 Cursor等，電腦上裝了 Node.js（
npx要用），有一個瀏覽器，有一個 API易 賬號。 - 難度：入門。不用寫代碼，也不用手改配置文件。
也無風雨也霧晴和他的 Archify：核心要點
| 要點 | 說明 ｜
| 作者 | 塗少坤，網名也無風雨也霧晴，專科、當兵、專升本 |
| Archify 是什麼 | 開源免費的 Agent Skill，MIT 協議 |
| 錢花在哪 | 花在執行 Skill 的 Agent 所用的模型上 |
| 推薦模型 | API易 上的 claude-opus-5-5 |
| 成品 | 一個獨立 HTML，瀏覽器打開就能點 ｜
塗少坤是誰：從專科、當兵到用開源證明自己
下面的經歷，主要來自他本人 2026-07-15 在 X 上發的長帖。2018 年高考後，他讀了專科，專業是計算機應用技術。他寫道，第一年過得很頹廢，後來去當兵，在部隊待了兩年。剛去時他體重大約 106 斤，很多訓練做不動；後來分到通信專業，代表單位參加集團軍通信比武，拿了第一。
退伍後，他回校專升本。那一批七十多人只招六個，他考了退伍批次第一，進了重慶郵電大學軟件工程。畢業時他比同齡人大三歲，跟着網課學了一個多月前端，就出去找實習。之後他面字節飛書，兩輪都過了，背調時因爲專升本被卡。秋招面重慶懂車帝，HR 面他主動說了專升本，之後沒有下文；一面面試官後來發來一句「不好意思」。那晚，他出去跑了五公里。
他沒有把每次失敗都算在學歷頭上。他自己寫過，猿輔導四面的題沒寫出來，掛了也正常。後來在杭州西湖大學實習，HR 又問到學歷，他說了一句「出身寒微不是恥辱」，那次過了。面 Manus 時，對方提到學歷不佔優勢的人可以用作品或開源項目證明自己，他當時已經有這個想法。他的原話是：最開始做開源，目的沒有多高尚，就是想在簡歷上多一點能證明自己的東西。Archify 的倉庫創建於 2026-04-15。
量子位 2026 年 9 月的專訪還寫到他 16 歲輟學、學過修車、進過廠。這部分是專訪的說法，他自己的長帖裏沒有寫。他本人在 B 站也發了一條視頻《從輟學進廠到登頂GitHub 熱榜，AI 重塑了我的人生！》，2026-09-14 發佈，地址：https://www.bilibili.com/video/BV1cGe56cEHo/。我們只覈對了標題、日期、UP 主和標籤，沒有逐段看完全片。標題裏的「登頂 GitHub」，對應的是他 2026-09-01 在 X 上發的一張截圖：GitHub Trending 所有語言周榜第一。那是當時的截圖，不代表現在的排名。
下面是這條視頻的播放頁。頁面上顯示 12.3 萬次播放、1700 多次點贊。十幾萬播放，這條他自己發的視頻已經挺火。
他的經歷裏，我們只想留下三句話：
- 學歷改不了。他後來做的事，是把能力做成別人打開就能用的作品。
- 他沒有把每次失敗都推給學歷。題沒寫出來，他就承認是自己沒寫出來。
- 熱度不等於真的有人在用。他在意的，是有沒有人在用他做的東西。
Archify 是什麼？
按官方中文 README 的說法，Archify 是一個開源免費的 Agent Skill。你把想法、問題或計劃說給 AI Agent，它會生成一個可以點擊、可以分享的交互式 HTML。它不需要你先有代碼倉庫；如果你讓 Agent 讀倉庫，它也能畫出帶源碼依據的架構圖，節點可以標 SRC，並固定到某一次提交。除了圖，它還有一種產物叫 explainer：一頁先給結論，再按問題拆成幾個面板，裏面可以有表格、步驟和圖。
它也有明確不做的事。它不是通用繪圖編輯器，也不是 Mermaid 主題；自動解析 Mermaid、通用自動佈局、託管分享服務、所見即所得編輯器，目前都不在產品範圍內。它不賣模型，也不簽發 API Key，官方寫明第三方收費套餐不代表 Archify。當前穩定版是 v3.2.0。skills.sh 的安裝量徽章寫着 130K+，這是項目自報的數字，我們沒有實測。
項目方還做了一張宣傳圖。正中間是倉庫 tt-a1i/archify，角標寫着當週 GitHub Trending 第 1，下面一行是「一句話，生成可交互架構圖」。圖上印的名次和 Star 數都是這張圖自己寫的，只能當作當時的宣傳，不代表現在還排第一。
它的工作方式用大白話說是這樣：Agent 先寫一份有固定格式的 JSON，再做校驗，校驗通過才交付 HTML。改圖時只改相關部分，不會整張推倒重畫。圖上的上下游和路徑都來自寫進圖裏的關係，交互不會編造拓撲。所以「圖上點得通」不等於「線上真的這樣跑」。
Archify 十種圖怎麼選
| 圖的類型 | 適合畫什麼 | 例子 |
|---|---|---|
| Architecture | 組件、服務、存儲、系統邊界 | 我們網站由哪些服務組成 |
| Workflow | 流程、審批、工具調用 | 報銷從提交到打款怎麼走 |
| Sequence | 一次調用的先後順序 | 登錄時前端、後端、數據庫誰先誰後 |
| Data Flow | 數據怎麼流動 | 訂單數據從下單到報表怎麼走 |
| Lifecycle | 狀態、重試、終態 | 一個任務從排隊到成功或失敗 |
| ERD | 表和字段 | 用戶表和訂單表的關係 |
| Class | 類和接口 | 支付模塊裏有哪些類 |
| Tree | 單一父級的層級 | 公司部門結構 |
| Timeline | 時間軸 | 項目三個月的里程碑 |
| Waterfall | 一次請求的耗時 | 一個接口慢在哪一段 |
後五種是 3.1 版起新增的。要注意，Timeline 和 Waterfall 的官方示例有些是示意數據；只有數據來自日誌或鏈路追蹤時，圖上的時間才能當作真實耗時。
Archify 5 步用法一覽
- 給 Agent 配好模型。本文用 API易 的 claude-opus-5-5 接進 Claude Code。
- 用一條命令安裝 Archify。
- 對 Agent 說一句人話，描述你要畫的東西。
- 在瀏覽器裏打開生成的 HTML。
- 繼續對話改圖，滿意後導出圖片或 PDF。
Archify 快速上手：接上 claude-opus-5-5 畫第一張可交互架構圖
第 1 步：爲 Archify 準備 API易 令牌
先說清楚 Token 花在哪。Archify 倉庫本身不收模型費，真正消耗 Token 的是正在執行這個 Skill 的 Agent：讀倉庫、寫 JSON、校驗失敗後返工，都走你給 Agent 配的模型。所以你要準備的是模型額度，不是 Archify 會員。
打開 API易 控制檯，新建一個令牌，可用模型選 claude-opus-5-5，然後把令牌複製下來。如果你還沒買額度、想先試一下 Opus，可以看文末延伸閱讀裏的試用說明。
做完你應該看到：令牌列表裏多出一條新令牌，可用模型裏有 claude-opus-5-5，令牌字符串已經複製好。
第 2 步：把令牌接進 Claude Code（按 magpie 教程做）
接 Key 的點擊步驟，本文不再重複寫。請按這篇已發佈的圖文教程操作：手把手教程：一個 Key 接上所有 Agent，用開源 magpie 統一接入 API 網關（以 Claude Code、Codex、Pi、Hermes 爲例）。
照着做時，只要記住兩個值。第一，Claude Code 用的 Anthropic 兼容地址是 https://api.apiyi.com，末尾不要加 /v1。第二，模型名寫 claude-opus-5-5，一個字都不能錯，寫錯會報 model not found。Codex 這一類工具走的是 OpenAI 兼容地址 https://api.apiyi.com/v1，本文主線不展開。如果你用的是 Cursor，並且走它自己的訂閱，那就不一定會用到 API易 的令牌。用 Archify 並不要求一定用 API易。
按那篇教程做完，再回來裝 Archify。
做完你應該看到：在 Claude Code 裏問一句「你好」，它能正常回復，沒有報 401，也沒有報 model not found。
第 3 步：安裝 Archify Skill
打開終端，只需要跑這一條官方命令：
npx skills add tt-a1i/archify -g
-g 表示全局安裝，裝好後在哪個項目目錄裏都能用。主線支持的 Agent 有 Cursor、Claude Code、Codex CLI、OpenCode，本文只講 Claude Code。裝完之後，請關掉當前的 Claude Code 會話，重新開一個。
做完你應該看到：命令執行結束，沒有紅色報錯。在新會話裏問「你能用 Archify 嗎」，Claude Code 能認出這個 Skill。
第 4 步：用 Archify 一句話畫出網站請求流程
把官方示例原樣發給 Claude Code：
用 Archify 畫出一個網站的請求流程：瀏覽器請求 API，API 優先讀取 Redis，緩存未命中時查詢 PostgreSQL 並回填緩存。
接下來，Claude Code 會先寫 JSON，再做校驗，最後生成 HTML 文件。如果它只在對話裏貼出代碼、沒有保存成文件，就補一句「把 HTML 保存到當前目錄」。找到這個 .html 文件，雙擊或拖進瀏覽器打開。
做完你應該看到：瀏覽器裏出現一張圖，上面有瀏覽器、API、Redis、PostgreSQL 幾個節點，節點之間有連線；點一下節點，可以看到它的上下游關係。
第 5 步：一句話改 Archify 架構圖並導出
不用重新描述整張圖，接着說一句就行：
添加鑑權，並突出緩存未命中的路徑，切換成淺色主題。
Archify 只改相關部分，不會推倒重畫。改完後，你可以在四種樣式裏切換，淺色和深色都有；也可以導出 PNG、WebP、JPG 長圖，或者打印成 PDF。把 HTML 直接發給同事，對方打開後也能交互；圖裏如果有外部網站或地圖鏈接，打開時需要聯網。
做完你應該看到：同一張圖裏多了鑑權相關的節點，緩存未命中的那條路徑被高亮，整體變成淺色。
🎯 技術建議：第一次用時，先拿官方這句示例跑通，再換成你自己的業務描述。這樣一旦出問題，你能分清是環境沒配好，還是描述太複雜。
Archify 背後的模型花多少錢
下面是我們在本文撰寫當天，從 API易 公開價格接口查到的數字。換算口徑是倍率 1 等於每百萬 tokens 2 美元。實際價格以 API易控制檯價格頁當天顯示爲準，不同分組的成交價可能不同。
| 模型 | 輸入 | 輸出 | 緩存讀 | 緩存寫 | 什麼時候用 |
|---|---|---|---|---|---|
| claude-opus-5-5 | 4 美元 | 20 美元 | 0.20 美元 | 5 美元 | 複雜圖、要讀倉庫、長 HTML |
| claude-sonnet-5-5 | 2 美元 | 10 美元 | 0.10 美元 | 2.50 美元 | 小示意圖、簡單改動 |
單位都是每百萬 tokens。另外還有 claude-opus-5-5-thinking，倍率相同。畫一張圖要花多少錢，我們沒有實測，所以這裏不給數字。一次出圖消耗多少 Token，取決於圖有多大、要不要讀倉庫，以及校驗失敗後返工了幾輪。
什麼時候不必用 Opus 5.5
官方沒有說必須用 Claude Opus 5.5。推薦 Opus 是我們自己的建議：Archify 要寫結構化 JSON 和很長的 HTML，有時還要讀整個倉庫，旗艦編碼模型更不容易在格式上出錯。下面兩種情況，換成更便宜的模型，比如 claude-sonnet-5-5，通常就夠了：
- 只畫三四個框的小示意圖，關係簡單，沒有要讀的倉庫。
- JSON 已經寫好，只是換個樣式、再導出一次。
到了圖變大、要讀倉庫或者反覆校驗失敗的時候，再切回 Opus。兩個模型怎麼搭配，延伸閱讀裏有一篇專門對比的文章。
Archify 排錯表
| 現象 | 常見原因 | 怎麼處理 |
|---|---|---|
| 裝完後 Agent 說不認識 Archify | 還在舊會話裏；沒加 -g；Node.js 沒裝好 |
重開 Claude Code；確認用 -g 重新安裝；終端跑 node -v 看能否輸出版本 |
| HTML 打不開或是空白 | 只貼了代碼沒存文件；文件不完整；外鏈要聯網 | 讓 Agent 把 HTML 保存成文件；用瀏覽器直接打開；檢查網絡 |
| 提示校驗失敗 | 描述太複雜或關係有矛盾 | 官方會給出能定位問題的修復說明，最多聚焦修兩輪；還不行就拆成兩張圖，或把描述寫得更具體 |
| model not found | 模型名寫錯；地址後面多加了 /v1 |
模型名改成 claude-opus-5-5；Anthropic 地址去掉末尾的 /v1 |
| 401 或提示額度不足 | 令牌複製錯、已禁用，或餘額用完 | 回 API易 控制檯檢查令牌狀態和餘額；重新複製令牌，再按 magpie 教程更新 |
Archify 常見問題
Q1：Archify 要不要錢？
Archify 本身免費，採用 MIT 協議開源。要花錢的是 Agent 背後的模型 Token。你給 Claude Code 配了哪個模型，就按那個模型的價格計費。
Q2：必須用 Opus，或者必須用 API易 嗎？
都不是必須的。官方沒有指定模型，推薦 claude-opus-5-5 是我們的建議，圖小的時候用 Sonnet 也可以。Archify 官方也沒有接入 API易；如果你用 Cursor 自帶的訂閱，可能完全用不到 API易 的令牌。
Q3：沒有代碼倉庫也能用 Archify 嗎？
能。直接用中文描述就行。有倉庫的話，可以讓 Agent 先讀倉庫，再畫出帶源碼依據的圖，節點上會標 SRC。這種情況下 Token 消耗會更多。
Q4：把 HTML 發給別人，還能點嗎？
能。它是一個獨立的 HTML 文件，交互功能都在文件裏。只有圖裏的外部網站和地圖鏈接需要聯網才能打開。
Q5：圖上點得通，是不是說明線上系統真的這樣跑？
不是。圖上的路徑都來自你寫進去的關係，它不會替你覈實線上系統。Waterfall 這類圖裏的耗時，也只有在數據來自日誌或鏈路追蹤時纔可信。
總結：也無風雨也霧晴的 Archify 給我們留下什麼
塗少坤沒法改變自己的學歷，於是把能力做成了一個別人裝上就能用的工具。動手部分的要點如下：
- Archify 是什麼：開源免費的 Agent Skill，一句話生成可交互的 HTML 圖。
- 錢花在哪：花在 Agent 背後的模型上，不用買 Archify 會員。
- 怎麼接 Key：在 API易 新建令牌，模型選 claude-opus-5-5，按 magpie 教程接進 Claude Code，地址不要帶
/v1。 - 怎麼裝：只跑
npx skills add tt-a1i/archify -g這一條命令。 - 怎麼用：說一句人話出圖，再說一句話改圖，然後導出 PNG 或 PDF。
- 省錢技巧：小圖和重新導出用 Sonnet，複雜圖再用 Opus。
想馬上動手的話，可以在 API易 apiyi.com 控制檯新建一個令牌，先用官方那句示例跑通第一張圖。
本文的信息來自幾類不同的來源，可信程度也不一樣：
| 信息 | 來源 | 說明 |
|---|---|---|
| 功能、版本、十種圖、安裝量 130K+ | 官方 README | 項目自報 |
| 周榜第一 | 作者 2026-09-01 在 X 上發的截圖 | 當時的截圖，不是實時排名 |
| 專科、當兵、專升本、求職經歷 | 作者 2026-07-15 的 X 長帖 | 作者本人的說法 |
| 16 歲輟學、修車、進廠 | 量子位 2026 年 9 月專訪 | 媒體整理 |
| 模型價格 | API易 公開價格接口，本文撰寫當天查詢 | 以控制檯價格頁當天顯示爲準 |
可選：更新檢查和倉庫命令（普通讀者不用看）
Archify 不會自動安裝新版本。想收到更新提醒，可以在 GitHub 倉庫頁面依次點 Watch → Custom → Releases。安裝後的 Skill 有一個低頻更新檢查，檢查失敗也不會報錯，只會提醒，不會自己下載。它只訪問 `archify.si/skill-updates/archify/stable.json`，不會上傳本地版本、項目內容、用戶輸入或密鑰。如果想關掉，可以設置環境變量 `ARCHIFY_UPDATE_CHECK_DISABLED=1`。
倉庫裏還有 `node bin/archify.mjs` 一類的命令，主要給貢獻者調試用。普通讀者不用跑，具體用法以倉庫 README 爲準。
參考資料
- Archify 官方倉庫（中文 README）：功能、安裝和範圍說明
- 鏈接：
github.com/tt-a1i/archify - 說明：本文的功能和版本信息以此爲準
- Archify 官網：項目主頁
- 鏈接：
archify.si - 作者 X 長帖（2026-07-15）：作者本人講述的經歷
- 鏈接：
x.com/t20000622yy/status/2077425261856096720 - 作者 B 站視頻：《從輟學進廠到登頂GitHub 熱榜，AI 重塑了我的人生！》，作者本人發佈
- 鏈接：
www.bilibili.com/video/BV1cGe56cEHo/ - 作者 B 站項目演示：《一覺醒來我做的開源項目衝上了 GitHub Trending 全球第一》
- 鏈接：
www.bilibili.com/video/BV16MhA6pEMb/ - 量子位 2026 年 9 月報道：項目報道和開發者故事，正文僅引用一句並已標註來源
- API易 公開價格接口：本文撰寫當天查詢
- 鏈接：
api.apiyi.com/api/pricing
