语音自进化助手

技能简介

voice-ui 是一个支持语音对话的AI助手界面，用户通过说话与AI交流，并直接口述指令让AI修改自身代码，实现UI的自我进化。修改后的代码会自动提交到Git仓库。

业务背景

用自然语音与AI助手对话，无需编程即可实时调整界面样式和功能。适合产品经理或设计师快速验证交互想法，减少与开发团队的沟通往返。

落地案例：产品经理在演示原型时，口述"把按钮改成蓝色并放大一点"，助手自动修改CSS代码并立即生效；确认效果后继续语音指令"添加一个加载动画"，变更自动提交Git记录。全程无需编写代码，快速迭代UI方案。

能做什么

• 语音输入识别（基于Whisper）和语音合成输出（TTS）
• 机器人形象展示，表情随对话内容变化
• 接收语音指令自动编辑CSS、JavaScript等前端代码
• 每次代码变更自动生成Git提交记录

使用说明

1. 进入技能目录：cd <workspace>/skills/voice-ui
2. 安装依赖：npm install
3. 启动服务：./start.sh
4. 浏览器访问 http://localhost:8765
5. 配置OpenClaw：在 ~/.openclaw/openclaw.json 中添加voice agent，指定模型为 anthropic/claude-sonnet-4-5
6. 设置环境变量 OPENAI_API_KEY 用于语音服务，或依赖OpenClaw自动获取
7. 点击麦克风按钮或长按空格键开始对话
8. 说出修改指令，如”把背景改成蓝色””按钮调大一些”，观察代码实时更新

输入与输出

见下方输入与输出表格。

风险提示

• 语音指令可能被误识别，导致非预期的代码修改
• 自动Git提交会直接写入本地仓库，建议提前确认分支状态
• 需要有效的OpenAI API Key，可能产生语音服务费用
• 代码实时修改可能影响运行稳定性，建议在独立环境测试

来源信息

原始链接：https://github.com/openclaw/skills/tree/main/skills/yukihamada/voice-ui/SKILL.md
来源类型：GitHub仓库