01
项目记录
把口头想法整理成可以继续修改的任务卡片。
Heard Sheep 是我围绕语音记录做的一次网页尝试。它把一段语音或临时文字整理成候选任务，让用户先看清楚内容，再决定是否加入清单。
Next.jsTypeScriptXiaomi MiMoPWA
02
背景
背景
很多待办不是一开始就写在清单里，而是出现在聊天、会议和临时提醒里。直接记录原话不够清楚，直接让系统替人决定也容易出错。
03
尝试方式
尝试方式
页面先保留输入确认，再展示候选任务。用户可以修改、选择或放弃，确认后再进入任务清单。这样多了一步检查，但也让错误更容易被发现。
04
我做了什么
01
整理使用场景和页面结构
02
搭建移动端页面
03
接入语音、图片和文字输入
04
设计候选任务的展示方式
05
把页面部署到 /sheep 入口
05
页面路径
01
录音或输入
02
检查文字
03
生成候选任务
04
编辑任务卡片
05
加入清单
06
页面细节
先确认输入
语音转成文字后先给用户检查，避免后面步骤建立在错误内容上。
候选任务
整理结果先作为草稿出现，不会直接写入正式清单。
手动补充
语音识别或整理失败时，仍然可以回到手动输入继续使用。
UI
页面截图
07
AI 相关尝试
这个项目尝试把语音、图片和文字输入整理成固定字段。AI 负责给出候选结果，最后是否采用仍由用户确认。
结构化结果手动确认备用路径
08
技术栈
页面
Next.js App Router / React / TypeScript / Tailwind CSS
输入
Web Speech API / Audio / Image / Text
AI
Xiaomi MiMo / OpenAI-compatible API / Structured JSON
部署
Docker / Nginx / basePath=/sheep / local JSON
09
完成的部分
移动端页面
语音和文字输入
输入确认页
任务卡片列表
本地历史记录
/sheep 同域入口
10
复盘
这次尝试让我意识到，语音整理的难点不只是识别准确率，还包括用户是否愿意信任整理结果。候选状态虽然多一步，但更适合处理容易出错的输入。
11 / 页面 / 代码