用 SOLO 10 分钟搭建一个英文短文简化 + 女声朗读音频生成工具

1. 摘要

用 SOLO 快速搭建了一个纯前端网页工具——输入任意英文短文,一键调用硅基流动 API 完成文本简化(降低阅读难度)并生成女声朗读 MP3 音频文件,支持在线播放和下载。全程无需后端,单个 HTML 文件即可运行。

2. 背景

我是小学生家长,编程小白,经常需要将老师布置的难度较高的需要孩子背诵的英文文章简化为更容易理解的版本,同时生成配套的朗读音频供孩子跟读。原本是用豆包改写,然后用豆包朗读,流程割裂且耗时。希望有一个一体化工具,输入原文就能同时得到简化文本和朗读音频,同时音频可以下载导入到孩子的mp3播放器里。

3. 实践过程

任务拆解思路:

我将整个工具拆为三个核心模块——API 调用层(文本简化 + 语音合成)、交互逻辑层(按钮触发、状态管理)、UI 展示层(输入输出区域、音频播放器)。

使用的 SOLO 能力:

  • WebSearch + WebFetch:快速查阅硅基流动的 Chat API 和 TTS API 官方文档,确认接口地址、模型名称、参数格式和可用音色
  • AskUserQuestion:确认用户倾向的 API 服务商和 TTS 方案(最终选定硅基流动)
  • frontend-design Skill:调用前端设计技能,生成高质量的暗色主题 UI,包含精致的动画和交互细节
  • Write 工具:直接生成完整的单文件 HTML 网页

关键 Prompt / 操作过程:

  1. 先让 SOLO 研究硅基流动 API 文档,确认了两个关键接口:
    • 文本简化:POST /v1/chat/completions,模型 Qwen/Qwen2.5-7B-Instruct(免费)
    • 语音合成:POST /v1/audio/speech,模型 FunAudioLLM/CosyVoice2-0.5B,女声 anna
  2. 明确需求:输入框 + 输出框 + 两个按钮(“简化并生成音频” / “生成音频”)+ 音频播放器 + 下载按钮
  3. SOLO 一次性生成了完整的 HTML 文件,包含 CSS 动画、响应式布局、Toast 通知、localStorage 记住 API Key 等细节

踩过的坑:

  • 硅基流动 TTS 有两个模型(MOSS-TTSD 和 CosyVoice2),MOSS-TTSD 需要用 [S1][S2] 对话标签格式,不适合单人朗读场景;最终选了 CosyVoice2,直接传纯文本即可
  • API 文档中 voice 字段的枚举值需要带模型前缀(如 FunAudioLLM/CosyVoice2-0.5B:anna),不能只写 anna

4. 成果展示

最终产出: 一个单文件 HTML 网页应用

核心功能:

功能 说明
文本简化 AI 将英文短文改写为更简单的版本,保持原意不变
女声朗读 CosyVoice2 女声(anna),自然流畅
在线播放 内置音频播放器,支持播放/暂停
MP3 下载 一键下载生成的音频文件
API Key 本地保存 输入一次,下次自动填充

技术亮点:

  • 纯前端,零后端依赖,双击 HTML 即可使用
  • 暗色主题 + 精致动画(波形装饰、渐变背景、噪点纹理)
  • 响应式设计,手机端也可正常使用
  • 使用硅基流动免费模型,注册即有额度

5. 效果与总结

提效情况: 原本需要手动或者豆包改写文本+ 豆包朗读,现在输入原文后一键完成,全程不到 1 分钟。

SOLO 在流程中的角色: SOLO 负责了从 API 文档调研、技术选型到前端开发的全流程。最省心的环节是 API 文档查阅——SOLO 自动抓取并分析了硅基流动的官方接口文档,准确提取了模型名称、参数格式等关键信息,完全不需要我手动翻文档。