用 VRoid 虚拟形象在编辑器侧边栏给自己打气，AI Avatar v20 居然出桌面版了

想在写代码时有个虚拟形象在旁边陪着，或者在 Claude Code 运行完后有个提醒，可以试试 AI Avatar。这个工具目前支持 VS Code 侧边栏（能联动 Claude Code 和 GitHub Copilot）以及 Chrome 侧边栏（联动 ChatGPT 和 Claude），现在最实用的更新是它出了 Electron 桌面版，不再被限制在插件面板里。

怎么把虚拟形象装到编辑器和浏览器里

如果你想在写代码时让 VRM 格式的虚拟形象在侧边栏给你加油，有两种安装路径：

一、VS Code 版本
直接在编辑器左侧的 Extensions 插件市场搜 AI Avatar 然后点击 Install 即可。或者去 Marketplace 页面搜索 web-developer-hyper.ai-avatar 安装。

二、Chrome 版本
直接在 Chrome Web Store 搜索 AI Avatar 插件安装，这样在用 ChatGPT 或 Claude 的侧边栏时，形象能做出相应的反应。

桌面版 Spin-Off 解决了什么问题

因为之前只有插件版，虚拟形象只能缩在侧边栏的小窗里。作者搞了一个 Electron 桌面应用，把形象从侧边栏里“放”了出来，现在它可以出现在屏幕任何地方。这里有两个很具体的衍生应用：

• Cursor Avatar：这是一个一个点击就跳出来的虚拟形象，会带着动画和加油气泡出现在鼠标点击的位置。代码在：

https://github.com/webdeveloperhyper/cursor-avatar

• Notification Avatar：这个对我这种重度使用 Claude Code 和 Codex 的人很有用。因为这些工具在停止运行或需要审批时没有默认的强提醒，很容易漏掉。作者用 Hooks 实现了提醒功能，先写了个简单的脚本验证，最后集成到了虚拟形象上。相关代码路径如下：

https://github.com/webdeveloperhyper/claude-code-codex-notification
https://github.com/webdeveloperhyper/notification-avatar

Voxel Avatar 模式其实是个放置类小花园

v20 版本加入了一个 Voxel Avatar 模式，本质上是个像素风的放置游戏。你可以让它在 Claude Code 运行的时候自动生长，或者手动点击种花。

这里有个技术细节：作者在用 Three.js 做 3D 花朵时踩了坑。因为 AI 无法直接生成复杂的花朵模型（最初只给了个圆柱体顶着个球），最后必须手动详细指令：要求用 5 个细长的椭圆花瓣，通过细圆柱围绕花心排列，才勉强做出了效果。现在这个模式里不仅能种花，还能看到蝴蝶，甚至会下雨出彩虹。

其他功能点更新

• TTS 切换：之前用的是 Kokoro，虽然音质好但有延迟且配置麻烦，现在换成了 Piper TTS，听语音气泡的内容更流畅。
• 万花筒模式：增加了 Kaleidoscope Mode，背景会随机变换形状，而且形状是可以手动调节的。