dsh-linus-brand:把插畫角色裝進 DSH Web UI 的品牌位與輸入框寵物

前言

在用 DeepSeek Harness(DSH)做日常對話或智能體開發時,Web 界面裏兩處視覺錨點很常見:側欄左上角的品牌標記,以及輸入框上沿隨會話狀態切換的吉祥物。默認是通用品牌圖與 Deepy 鯨魚;若希望界面帶上自己的角色身份,又不想直接改皮膚倉庫、怕升級被覆蓋,就需要一種「疊在皮膚機制之上、可隨時關掉」的做法。dsh-linus-brand 由維護者 AChengLinus 發佈,歸類爲趣味換裝,目標是把 Linus 插畫角色寫入上述兩個位置:品牌圖換頭像標記,寵物換成同一角色的 18 種手繪連續動作(約 19 fps,帶像素粒子)。插件以當前 DSH 進程權限運行,安裝前建議自行審閱源碼與 MIT 許可證說明。

這是什麼

dsh-linus-brand 是 DSH 的 Web 端客戶端插件(platform: web,immediately: true),通過 Cordis patch 接入,不替換 dsh-claude-style 皮膚文件。關掉或卸載後界面會回到皮膚默認外觀。當前包版本爲 1.0.0,要求 DSH ≥ 0.2.2-rc.1(在 0.2.2-rc.1 上開發與驗證),並依賴皮膚插件 dsh-claude-style,且皮膚設置裏吉祥物必須爲 Deepy(mascot: deepy)。

核心功能

下面分兩塊說明插件實際改動的位置與機制(與 README 中的表格一致)。

側欄與賬號區的品牌圖

插件把包內的 mark.png 寫入皮膚的圖片品牌存儲路徑 ~/.dsh/dsh-claude-style/brand/mark.png(若已存在則不會覆蓋)。皮膚會自動把該文件用作側欄、新會話頁、賬號頭像等區域的品牌標記。品牌文字由皮膚配置項 brandName 控制,本包不強制修改;若要顯示角色名,需在皮膚配置裏自行設置。

輸入框上沿的寵物動畫

Client 端根據 DOM 上的 data-animation,爲每個狀態注入一條帶 !important 的 CSS 規則,把 --dsh-claude-mascot-sheet 指向本包生成的 SVG 精靈條;尺寸、位置與換幀仍由 dsh-claude-style 驅動。18 個會話相關狀態映射到 8 種姿勢(打字、思考、作畫、遊戲、idle、手衝、喝茶釣魚等),各狀態 24–72 幀,皮膚每 52 ms 換一格,約 19 fps;人物不縮放,僅有上下浮動與左右擺動,並按狀態使用四類粒子主題色(calm / work / play / alert)。精靈條資源合計約 5.75 MB,安裝後位於 profile 的 node_modules 中。

環境要求與皮膚配置

  1. 安裝並啓用 dsh-claude-style。
  2. 在 profile 配置裏將吉祥物設爲 Deepy。

配置路徑:~/.dsh/profiles/<profile>/cordis.patch.yml,找到 - id: ui-skin-claude-style 下的 config::

    brandName: Linus     # 品牌文字(可選)
    mascot: deepy        # 必須是 deepy;Clawd / 鯨娘 下寵物替換不會生效

安裝與啓用

先在 DSH 側欄打開 插件 頁,在安裝框(「包名或地址」)中粘貼下列任意一種(與 README 一致):

形式 粘貼內容
GitHub 簡寫 github:AChengLinus/dsh-linus-brand
GitHub 地址 https://github.com/AChengLinus/dsh-linus-brand
Release 壓縮包 https://github.com/AChengLinus/dsh-linus-brand/releases/download/v1.0.0/dsh-linus-brand-1.0.0.tgz
本地目錄 絕對路徑,例如 /Users/you/plugins/dsh-linus-brand
npm 包名 dsh-linus-brand(需已發佈到 npm)

命令行等價寫法:

dsh plugin add github:AChengLinus/dsh-linus-brand --profile desktop

安裝完成後重啓一次應用(無 HMR 時插件管理器會提示 restart-required)。再打開 設置 → Claude Style,確認品牌圖與吉祥物已變爲本包角色。

若要從 插件 → Discover 安裝,可添加本倉庫的 format-1 索引(DSH 0.2.1+):

https://cdn.jsdelivr.net/gh/AChengLinus/dsh-linus-brand@main/index.json

備用:https://raw.githubusercontent.com/AChengLinus/dsh-linus-brand/main/index.json

典型用法與自定義素材

僅使用默認 Linus 資源

完成安裝、重啓並確認 mascot: deepy 後,正常與會話交互即可;皮膚會按活動切換 18 個 data-animation 狀態,插件自動切換對應精靈條與樣式。

換成自己的插畫角色

維護者提供的構建流程如下:

# 1) 把姿勢 PNG(透明背景)放進 tools/poses/,文件名對應 build-sheets.py 裏的 POSE 表
# 2) 重新生成精靈條(覆蓋 assets/)
python3 tools/build-sheets.py

# 3) 修改 client.js 裏的 REV,避免瀏覽器緩存舊資源
#    const REV = "anim4";  ->  const REV = "anim5";
# 4) 重啓應用

tools/build-sheets.py 中的 DIMS、MOTION、THEMES 分別控制條帶幾何(須與皮膚格子一致)、浮動/擺動與粒子主題。幾何須遵守 README 中的換算:皮膚 1 邏輯像素 = 5 個 SVG 單位,CSS 尺寸 = 邏輯像素 × 2。

卸載與已知限制

卸載:在插件頁刪除,或執行:

dsh plugin remove dsh-linus-brand --profile desktop

品牌圖不會隨卸載自動刪除,需手動刪除 ~/.dsh/dsh-claude-style/brand/mark.png(若不再需要自定義標記)。寵物相關樣式隨卸載恢復,無需額外步驟。

適用與注意:

  • 適合已使用 Claude Style 且希望 Deepy 槽位 上展示自定義連續動畫、側欄展示同一角色品牌的用戶。
  • 依賴皮膚 DOM 與 CSS 變量(如 .dsh-claude-deepy、--dsh-claude-mascot-*);皮膚大改結構時插件可能需要同步更新。
  • 動畫節奏由皮膚的 52 ms/格決定;本包不修改皮膚步進。
  • 插畫作品(poses、mark、icon)爲作者個人角色;代碼與構建腳本爲 MIT,可複用。

結尾

dsh-linus-brand 用非侵入方式把品牌標記與輸入框寵物換成同一套手繪角色,並覆蓋 DSH 會話的常見動畫狀態;前提是 DSH 0.2.2-rc.1 與 dsh-claude-style + mascot: deepy。更多動圖與姿勢對照見倉庫 docs/,安裝與索引細節以 README 爲準。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜