為什麼我把 vault 變成可被搜尋引擎索引的互動 Canvas

多數內容網站還停在用靜態 png 截圖呈現視覺資訊。我的部落格有讀者可以拖曳、縮放、點擊節點看完整內容的互動 Canvas。

這篇拆解我為什麼把整套 vault 變成可提高搜尋引擎索引機率的互動視覺資產,以及為什麼這對一人公司而言是 hard-to-copy 的個人品牌護城河,而不是技術秀。

知識視覺化的三層問題

把客戶案邏輯、戰略地圖、roadmap 畫成圖這件事,我做了五個月。一開始的版本是 Miro,後來換 Whimsical,再後來換 Excalidraw。問題一直存在,只是用不同的形式重複出現。

第一層問題是檔案不在我這。Miro 的版本綁在 Miro 的雲端,我換工具就要重畫;Whimsical 的圖匯出後變成靜態 png 失去結構;Excalidraw 雖然開源但沒辦法跟我的知識系統互相連結。

第二層問題是搜尋引擎看不到。所有這些工具的輸出最後都是一張圖。Google 看圖只能讀檔名跟周圍文字,圖裡面寫的「為什麼客戶案要先做需求驗證」「四階段商業模式並行」對它而言多半是黑盒。我花三個月畫的內容,搜尋引擎只能讀到一行 alt 屬性。

第三層問題是無法累積。一張 Miro 圖畫完就放在那,跟我下一個案、下一篇部落格、下一張圖之間沒有結構化關聯。我每次需要做新圖都從零開始,五個月畫了二十幾張圖,但這些圖沒有互相增強的效應。

我換過三個工具才意識到問題不在工具,是在「圖是孤立資產」這個前提本身需要被推翻。

為什麼選 Obsidian Canvas

Obsidian Canvas 在 2023 年釋出 v1.0 開放規格,把 Canvas 檔案格式公開成 JSON Schema。這件事對我的判斷是決定性的。

開放規格意味著我可以自己寫渲染器。意味著 Canvas 不再被綁在 Obsidian 一家工具裡。意味著我可以把 Canvas 檔當成 markdown 一樣放進 git,跟我的 SOP、決策日誌、客戶案文件一起追蹤版本。

這個架構選擇直接解了前面三層問題。檔案是我的、可被搜尋引擎索引、可累積成結構化資產。

但開放規格只是技術選型的起點,真正讓 KnowledgeOS Canvas 變成一套系統的,是我把它跟一人公司戰略綁在一起。

戰略對齊:用 AI 擴大編制不擴張人力

一人公司唯一的擴張路徑是把單位時間的產出乘上五倍。我把這個原則畫成 Canvas 放在 vault 戰略文件夾裡,任何時候打開 vault 都能看到自己的核心戰略地圖。

下面這張是我的對外脫敏版,中心是「用 AI 擴大編制不擴張人力」這個核心信念,五個目標環繞,搭配越做越輕鬆的四階段 roadmap。

載入中…

+−FITFULLJSON

戰略地圖節點摘要

把這張 Canvas 的核心節點寫成文字備援,確保搜尋引擎與 LLM 爬蟲在 SSR 階段就能讀到完整內容,不依賴 client-side 渲染:

• 核心信念: 用 AI 擴大編制,不擴張人力
• 目標 1: 一人公司本身的存在形態 (用 AI 擴大編制,不靠人力)
• 目標 2: 客戶案 productize (現有服務 → 在產業共通骨架做深度客製 → 賣解法)
• 目標 3: 訂閱制教學 (Premium 月訂閱,被動收入大於主動收入)
• 目標 4: AI 變成知識教授 (vault 知識傳承給其他一人公司)
• 目標 5: 商業模式落地 (把專業變成可被購買的系統)
• 四階段 roadmap: 第一階段 SOP 累積 → 第二階段 客戶案模組化 → 第三階段 訂閱制教學啟動 → 第四階段 三軌商業模式並行
• 賺到錢的四條原則: 客戶案結束都產 SOP/教材 / 客戶案模組化 / 被動收入優先 / 自動化 marketing

對外讀者看到的是「個人戰略視覺化」。對我自己而言這張圖是每天打開 vault 第一個讀的東西,確保這週做的每一件事都對齊其中至少一個目標。沒對齊的事,不論多急都先延後,這個原則救過我至少三次差點接下偏離戰略的客戶案。

客戶案 8 步驟工作流

戰略不會自動變成行動。從接到客戶詢問到完成交付,我有一套 8 步驟標準流程,跳過任何一步都會在後段付出代價。

下面這張是這套流程的視覺化版本。每一個步驟對應 Claude Code 裡一個我寫的 SOP 或自動化技能,從需求驗證、設計系統、視覺探索、建站、設計審查、上線前檢查,到最終交付驗證。

載入中…

+−FITFULLJSON

8 步驟節點摘要

• Step 1 需求驗證: 用 product-lens skill 確認「為什麼要做」,避免做出客戶不需要的功能
• Step 2 設計系統: 產 DESIGN.md 設計文件,定義色彩、字型、間距、動態 spec
• Step 3 挑設計範本: 從 9 套 references/design-systems 範本依產業與品牌調性挑基底
• Step 4 視覺探索: 用 design-shotgun 生成多視覺變體讓客戶挑
• Step 5 建站: Next.js 16 + Tailwind 4 + MDX 標準骨架
• Step 6 設計審查: design-review 抓 AI slop 與不一致,iterative 修復
• Step 7 上線前檢查: pre-launch-check 跑 10 大類檢查 (SEO/AEO/效能/無障礙/安全/部署/DNS/Analytics/內容/測試)
• Step 8 最終驗證: verify 產出可檢視的證據 (build log / 截圖 / smoke test 結果)

把這張圖變成互動 Canvas 之後一個有趣的副作用是,跟潛在客戶開會時我可以直接打開這頁,把每一步點開講解。客戶第一次接觸就看到這套方法論的深度,不需要靠我口說。比起 PDF 簡報的單向溝通,客戶可以自己拖曳探索的圖留下的記憶深度是另一個量級。

Anthropic Claude Code 跟我的 vault 結合讓這套流程的每一個 SOP 都能被 AI 一句話觸發,客戶案結束後產出的下一份 SOP 又會自動進入這個系統,形成正回饋循環。

KnowledgeOS 四階段 Roadmap

這套系統不是一次到位,是分階段累積。下面這張是我把整個 KnowledgeOS 從現在到一年後的演進路徑畫成 timeline。

載入中…

+−FITFULLJSON

四階段節點摘要

• Step 1 (現在 ~ 3 個月): 客戶案結束都產 SOP + 教材,SOP 萃取系統自動化,教材自動產出系統 7 平台拆版
• Step 2 (3 ~ 6 個月): 客戶案模組化三大產品線 (進銷存範本 / B2B 補貨範本 / 提案模組),在產業共通骨架做深度客製
• Step 3 (3-6 月並行): 訂閱制教學啟動,Founding member 階段,目標四位數美金月被動收入
• Step 4 (6 個月 ~ 1 年): 三軌商業模式並行,客戶案 + 訂閱制教學 + 顧問 retainer,加上 SaaS 化第一個客戶案

第一階段是 SOP 累積,核心動作是每個客戶案結束都產對應的 SOP 跟教材。沒有這一步,第二個案還是從零開始,五個月只是把同樣的事重複五次。

第二階段是客戶案模組化。當第一階段累積到一定數量,後續案子能在前一階段累積的產業共通骨架上做深度客製,從報價、需求確認、技術規劃、交付驗證的整個流程被切成可重組的元件。這時候單位時間的產出開始指數成長,不是線性。

第三階段跟第二階段並行,把累積出來的方法論變成訂閱制教學內容,讓被動收入接管一部分主動收入的時間。

第四階段是三軌商業模式並行,客戶案、訂閱制教學、顧問 retainer 同時運作,單一收入源出問題不會打掉整個事業。

這四階段對我而言不是預測,是路徑。每一階段的進入條件是上一階段累積到一定臨界點,而不是時間到了就跳。我現在在 Step 1 末段往 Step 2 過渡,知道自己在哪一階段這件事本身就讓決策變簡單。

為什麼這是 hard-to-copy 護城河

KnowledgeOS Canvas 系統在三個層面同時建立護城河。

第一層是 SEO 結構性差異化。多數內容網站仍停在靜態截圖階段,圖裡的文字對搜尋引擎是黑盒。我的 Canvas 元件以 SVG 加 foreignObject 渲染 HTML 文字,搭配 SSR 階段在 blog 正文補節點摘要,給搜尋引擎雙軌索引路徑。可讀文本面積比靜態圖大上一個量級,而且這個資訊密度差距會隨著我累積更多 Canvas 持續放大。

第二層是視覺記憶差異化。讀者讀完 Markdown 部落格三天後記得標題就不錯,但讀者拖曳過、縮放過、點擊過的互動圖,留下的記憶深度跟靜態文章不在同一個量級。對個人品牌而言,讓讀者第一次接觸就記得「這個人不只寫文章還做了能玩的視覺工具」是無法被複製的第一印象。

第三層是系統性累積差異化。任何人都可以畫一張 Miro,但這張 Miro 跟下一篇部落格、下一個客戶案、下一份 SOP 之間沒有 wikilink。我的每張 Canvas 都跟 vault 內的決策、SOP、客戶案文件互相連結,五個月後 vault 裡的圖文連結密度自己變成一個微型搜尋引擎。下次寫部落格,從 vault 裡撈結構化材料的速度比從零組織快一個量級。

第三層才是真正的護城河,前兩層是表現形式。

邊界:對外公開的安全閘

這套系統有一條我每天都在守的邊界。同一個案的 vault 內部版可以含客戶名、員工名、系統路徑、具體價碼,因為這是我自己跟我的 AI 助理工作用的真實版本;但對外版不能含任何這些資訊。

我寫了四項檢查清單跟 git pre-commit hook,任何 Canvas 進入網站 public 目錄前必須通過自動化檢查。客戶名、員工名、系統內部 endpoint、具體報價數字觸發任一條都會被阻擋。這個機制本身也是個人品牌的一部分,讓客戶看到我的內容時不會擔心自己未來變成下一篇部落格的範例素材。

結語

我用 Canvas 不是因為它酷,是因為它同時解決三個我五個月以來累積的問題。檔案是我的、提高被搜尋引擎索引的機率、跟整個知識系統累積。

把工具變成系統,把系統變成方法論,把方法論變成可累積的視覺資產。這是 KnowledgeOS Canvas 對一人公司的真正價值。

如果你想討論你的事業可以怎麼建一套類似的知識作業系統,或者想看更多 KnowledgeOS Canvas 在實際客戶案的應用,可以從 Labs 頁面開始,或是 跟我預約一次諮詢。