Music / Tool

简谱播放器

Jianpu Player · Web Audio

Created 2025-11-24Updated 2026-01-25

输入简谱(含 BPM/歌词/延音/附点/滑音),采样钢琴音色并支持移调、转音名与逐音试听。

JianpuNumbered NotationWebAudioPlayerTranspose

Background

为什么做

  • 简谱很适合快速记录旋律,但“听到它”往往需要打开乐器或 DAW。这个工具把输入→播放做成网页上的最短路径。

Scenario

应用场景

  • 写歌/扒谱时快速验证旋律走向。
  • 给歌词段落配简谱:一段一段听,不必全曲导入。
  • 移调对照:同一段简谱在不同调里快速试听。

Delivery

实现了什么

  • 解析:数字简谱 + 小节线 + 延音/下划线 + 附点 + 歌词括号 + BPM 标记。
  • 播放:合成钢琴音色、单音试听、滑音(~)与播放高亮。
  • 转换:音名 / 唱名 / ASCII 简谱输出,便于复制与二次处理。

Flow

关键路径(从打开到完成一次任务)

Paste → Parse → Play → Convert

简谱播放器 flowPasteParsePlayConvert

Evaluation

体验时看什么

  • 信息架构:结构是否“可扫读”。
  • 关键动作:检索、预览、导出等路径是否顺畅一致。
  • 稳定性:反馈是否及时、边界是否考虑。

Screenshots

UI snapshots

用截图快速理解页面结构、视觉层级与交互状态。

简谱播放器 screenshot — Cover
Cover
简谱播放器 screenshot — Cover
Cover

Case Study

从背景到交付:完整梳理

展开你关心的部分即可(减少信息噪音,密度更高)。

Background

为什么做

简谱很适合快速记录旋律,但“听到它”往往需要打开乐器或 DAW。这个工具把输入→播放做成网页上的最短路径。

Scenario

应用场景

  • 写歌/扒谱时快速验证旋律走向。
  • 给歌词段落配简谱:一段一段听,不必全曲导入。
  • 移调对照:同一段简谱在不同调里快速试听。

Delivery

实现了什么

  • 解析:数字简谱 + 小节线 + 延音/下划线 + 附点 + 歌词括号 + BPM 标记。
  • 播放:合成钢琴音色、单音试听、滑音(~)与播放高亮。
  • 转换:音名 / 唱名 / ASCII 简谱输出,便于复制与二次处理。

Design

设计要点

  • 黑白极简,输入与反馈优先:少按钮、少干扰,但状态清晰。
  • “可点即可听”:把学习成本压到最低。
  • 离线友好:单文件静态页,随时可部署。

Tech

技术实现

  • Web Audio API:振荡器叠加 + 包络 + 简单混响,模拟钢琴击弦质感。
  • 可容错的 tokenizer/parser:兼容中文注释与换行分段。
  • 纯静态部署:Vercel 一键上线。

Try it

看完介绍,继续探索

建议沿着项目的核心流程进行体验(如搜索、预览、导出、播放等),以评估信息结构与交互一致性。

简谱播放器 cover

Live preview

部分站点可能因为安全策略无法被嵌入;遇到空白时请用上面的 Open live。

Explore next

推荐你看这些

根据标签与类别做的相关推荐(不想继续看也能快速跳走)。