給 Claude Code 裝上“實時監控面板”

作者：CodeAI 實驗室
日期：2026年5月12日 下午6:18
來源：WeChat 原文

✦整理版優先睇

速讀 5 個重點 高亮

Claude HUD 為 Claude Code 提供實時狀態儀表盤，讓 AI 開發過程可觀測

整理版摘要

呢篇文章係由一位 Claude Code 嘅深度使用者分享，佢發現用 AI 寫程式碼雖然效率高，但過程係一個「黑盒」，完全睇唔到 AI 喺做乜，令人心慌。所以佢介紹咗一個 GitHub 項目 Claude HUD，專為 Claude Code 設計，目的係將運行狀態可視化。

Claude HUD 可以喺終端底部實時顯示 Context 使用比例、當前執行嘅工具叫用、檔案讀取同修改記錄、Agent 狀態同 Todo 任務進度。安裝簡單，只需三步，但有 Windows 同 Linux 嘅注意事項。作者親身試用後，覺得最大改變係「AI 行為變咗透明」，唔使再盲等結果。

整體結論係：Claude HUD 解決咗 AI 開發缺乏可觀測性嘅核心問題，讓用家可以提前感知 Context 使用量、睇到每一步操作，降低焦慮。佢唔係增強 AI 能力，而係改善使用體驗，類似俾 Claude Code 加咗個儀表盤。如果你深度使用 Claude Code，呢個插件值得一試。

  • Claude HUD 解決咗 Claude Code 運行過程「黑盒」嘅問題，即時顯示 AI 狀態。
  • 安裝只需三步：添加插件市場、安裝插件、初始化配置，注意 Windows 同 Linux 系統相容問題。
  • 可視化內容包括 Context 使用率、檔案操作、Agent 狀態、Todo 進度條，使用者可以實時追蹤。
  • 使用後唔使再猜 AI 係咪卡咗，提前知道 Context 就快爆，減少盲等。
  • 如果你已經係 Claude Code 用家，建議裝插件增強開發透明度，改善使用感受。
值得記低
連結 github.com

Claude HUD GitHub 項目

Claude Code 可視化插件，顯示運行狀態

開啟
整理重點

黑盒開發困局

用 AI 寫程式碼效率高，但過程係一個黑盒，你只可以等結果，成日擔心 AI 係咪卡咗。呢種唔踏實感好常見。

黑盒

唔踏實

作者就係因為呢個問題，開始揾解決方案。

整理重點

Claude HUD：即時儀表盤

Claude HUD 係一個 Claude Code 插件，核心係將運行狀態可視化。佢會喺終端底部顯示 Context 使用比例、工具叫用、檔案操作、Agent 狀態同 Todo 進度。

運行狀態可視化

終端底部

整理重點

安裝三步搞掂

  1. 1 添加插件市場：/plugin marketplace add jarrodwatts/claude-hud
  2. 2 安裝插件：/plugin install claude-hud
  3. 3 初始化配置：/claude-hud:setup/reload-plugins，然後重啟 Claude Code

Windows 用家如果報 Node 錯誤，可以先安裝 Node.js；Linux 用家遇到跨裝置錯誤，可以設定 TMPDIR。

Node.js

TMPDIR

整理重點

實戰透明化體驗

  • Context 實時可見：顯示使用比例，例如 45%、78%，快滿可以提前感知。
  • 文件操作一目瞭然：讀取、編輯、搜尋檔案即時顯示，唔使等修改完先知。
  • Agent 狀態清晰：多 Agent 工作時直接顯示 working 狀態，唔會再懷疑係咪卡咗。
  • Todo 進度跟蹤：任務拆成進度條，例如 Fix login bug (3/5)，直觀見到執行進展。

Context 使用比例

Agent 狀態

Todo 進度條

裝完之後，最大變化係 AI 行為變透明，唔使再盲等結果。

整理重點

核心價值：可觀測性

呢個項目解決咗一個基礎但關鍵嘅問題：AI 開發缺乏可觀測性。Claude HUD 將不透明變成可觀察，降低焦慮。

可觀測性

儀表盤

 

前言

呢兩年 AI 寫代碼呢件事，變化真係好快。

由最開始「AI 能唔能夠寫代碼」，到而家好多人已經用緊 Claude Code 嚟做完整開發流程。

比如：

  • • 自動改 Bug
  • • 重構項目
  • • 讀代碼倉庫
  • • 多 Agent 協作開發

效率的確提升咗。

但係用耐咗之後，會出現一個好現實嘅問題：

你根本唔知 AI 喺度做緊乜。

佢可能喺度：

  • • 讀文件
  • • 改代碼
  • • 跑工具
  • • 消耗 Context

但成個過程係「黑盒」嘅。

你只能等結果。

於是就會出現一種好常見嘅情況：

明明 AI 喺度做緊嘢，但你心裏面一直唔踏實。

最近我見到一個 GitHub 項目，專門解決呢個問題：

Claude HUD。

項目介紹

Claude HUD 係一個 Claude Code 嘅插件。

佢嘅核心作用只有一句話：

將 Claude Code 嘅運行狀態「可視化」。

項目地址：

https://github.com/jarrodwatts/claude-hud

佢會喺終端底部實時顯示 Claude 當前狀態，包括：

  • • Context 使用情況
  • • 當前正在執行嘅工具調用
  • • 文件讀取 / 修改記錄
  • • Agent 運行狀態
  • • Todo 任務進度
  • • Git 狀態信息

簡單理解就係：

原本你只能「估 AI 喺度做乜」，而家可以「睇到 AI 喺度做乜」。

項目部署

安裝方式比較簡單，基本係三步。

1. 加入插件市場

/plugin marketplace add jarrodwatts/claude-hud

2. 安裝插件

/plugin install claude-hud

3. 初始化配置

/claude-hud:setup
/reload-plugins

然後重啟 Claude Code 就可以生效。

Windows 注意

如果報 Node 相關錯誤，可以先用安裝 Node.js：

winget install OpenJS.NodeJS.LTS

然後再執行 setup。

Linux 可能問題

如果遇到類似：

EXDEV: cross-device link not permitted

可以咁樣處理：

mkdir -p ~/.cache/tmp
TMPDIR=~/.cache/tmp claude

項目實操體驗

裝完之後，最大嘅變化係：

AI 嘅行為變「透明」咗

以前你用 Claude Code 係咁樣：

  • • 輸入一句需求
  • • 等佢輸出結果
  • • 中間過程完全睇唔到

而家變成：

1. Context 實時可見

比如：

Context 會直接顯示使用比例：

Context 45%
Context 78%
Context 92%

就快滿嗰陣你可以提前感覺到。

2. 文件操作一目瞭然

你可以睇到佢喺度做緊乜：

Read: auth.ts
Edit: login.ts
Grep: userService

以前係「改完先知道改咗乜」，而家係實時過程可見。

3. Agent 狀態清晰

如果你喺度跑多 Agent，會直接睇到：

◐ working: backend-agent
◐ working: frontend-agent

唔會再出現「佢係咪卡住咗」嘅唔確定感。

4. Todo 進度跟蹤

AI 嘅任務會被拆成進度條：

Fix login bug (3/5)
Refactor API (2/4)

可以直觀睇到執行進展。

項目心得

呢個項目俾我最大嘅感受，其實唔係「功能有幾強」，而係佢解決咗一個好基本但好關鍵嘅問題：

AI 開發缺乏可觀測性

而家大家越來越依賴 AI 寫代碼，但問題係：

AI 係唔透明嘅。

Claude HUD 做嘅嘢就係：

將呢個「唔透明」變成「可觀察」。

佢帶來嘅變化係：

  • • 唔再擔心 AI 係咪卡住咗
  • • 唔再盲等結果
  • • 可以提前判斷 Context 係咪就快爆
  • • 可以睇到每一步操作

從體驗上嚟講，佢更加似係：

俾 Claude Code 加咗一個「儀錶板」。

最後

如果你已經喺深度使用 Claude Code，呢個項目值得試嚇。

佢唔會改變你嘅開發方式，但會改變你嘅「使用感受」。

一句話總結：

Claude HUD 做嘅唔係增強 AI，而係令 AI 變得可見。

睇到呢度，關注嚇啦！

 


 

前言

這兩年 AI 寫代碼這件事，變化真的很快。

從最開始“AI 能不能寫代碼”，到現在很多人已經在用 Claude Code 做完整開發流程了。

比如：

  • • 自動改 Bug
  • • 重構項目
  • • 讀代碼倉庫
  • • 多 Agent 協作開發

效率確實是上來了。

但用久了之後，會出現一個很真實的問題：

你根本不知道 AI 在幹嘛。

它可能在：

  • • 讀文件
  • • 改代碼
  • • 跑工具
  • • 消耗 Context

但整個過程是“黑盒”的。

你只能等結果。

於是就會出現一種很常見的情況：

明明 AI 在工作，但你心裏一直不踏實。

最近我看到一個 GitHub 項目，專門解決這個問題：

Claude HUD。

項目介紹

Claude HUD 是一個 Claude Code 的插件。

它的核心作用只有一句話：

把 Claude Code 的運行狀態“可視化”。

項目地址：

https://github.com/jarrodwatts/claude-hud

它會在終端底部實時顯示 Claude 當前狀態，包括：

  • • Context 使用情況
  • • 當前正在執行的工具調用
  • • 文件讀取 / 修改記錄
  • • Agent 運行狀態
  • • Todo 任務進度
  • • Git 狀態信息

簡單理解就是：

原本你只能“猜 AI 在幹嘛”，現在可以“看見 AI 在幹嘛”。

項目部署

安裝方式比較簡單，基本是三步。

1. 添加插件市場

/plugin marketplace add jarrodwatts/claude-hud

2. 安裝插件

/plugin install claude-hud

3. 初始化配置

/claude-hud:setup
/reload-plugins

然後重啓 Claude Code 就可以生效。

Windows 注意

如果報 Node 相關錯誤，可以先安裝 Node.js：

winget install OpenJS.NodeJS.LTS

然後再執行 setup。

Linux 可能問題

如果遇到類似：

EXDEV: cross-device link not permitted

可以這樣處理：

mkdir -p ~/.cache/tmp
TMPDIR=~/.cache/tmp claude

項目實操體驗

裝完之後，最大的變化是：

AI 的行為變“透明”了

以前你用 Claude Code 是這樣的：

  • • 輸入一句需求
  • • 等它輸出結果
  • • 中間過程完全看不到

現在變成：

1. Context 實時可見

比如：

Context 會直接顯示使用比例：

Context 45%
Context 78%
Context 92%

快滿的時候你能提前感知。

2. 文件操作一目瞭然

你能看到它正在做什麼：

Read: auth.ts
Edit: login.ts
Grep: userService

以前是“改完才知道改了啥”，現在是實時過程可見。

3. Agent 狀態清晰

如果你在跑多 Agent，會直接看到：

◐ working: backend-agent
◐ working: frontend-agent

不會再出現“它是不是卡住了”的不確定感。

4. Todo 進度跟蹤

AI 的任務會被拆成進度條：

Fix login bug (3/5)
Refactor API (2/4)

可以直觀看到執行進展。

項目心得

這個項目給我最大的感受，其實不是“功能多強”，而是它解決了一個很基礎但很關鍵的問題：

AI 開發缺乏可觀測性

現在大家越來越依賴 AI 寫代碼，但問題是：

AI 是不透明的。

Claude HUD 做的事情就是：

把這個“不透明”變成“可觀察”。

它帶來的變化是：

  • • 不再焦慮 AI 有沒有卡住
  • • 不再盲等結果
  • • 能提前判斷 Context 是否快爆
  • • 能看到每一步操作

從體驗上來說，它更像是：

給 Claude Code 加了一個“儀表盤”。

最後

如果你已經在深度使用 Claude Code，這個項目是值得試一下的。

它不改變你的開發方式，但會改變你的“使用感受”。

一句話總結：

Claude HUD 做的不是增強 AI，而是讓 AI 變得可見。

都看到這裏了，關注一下吧！