by 棱镜jh 2019.04  http://www.autopiano.cn

产品介绍

人生如音乐,欢快且自由。


自由钢琴(AutoPiano)是利用HTML5技术开发的在线钢琴应用,致力于为钢琴爱好者、音乐爱好者以及其他所有的创造者提供一个优雅、简洁的平台,在学习工作之余可以享受钢琴、音乐的美好。就类似于多年前Flash开发的钢琴游戏,自由钢琴只是换了H5的技术,同时支持了钢琴曲的自动播放功能。


AutoPiano支持键盘按键和鼠标点击播放,同时琴键上会有按键和音名提示。另外,AutoPiano还有教学的功能,一种方式是快速入门,通过简易的谱子按键进行演奏,另一种是演奏示例,通过钢琴曲的自动播放来达到演示的目的。目前这两个功能都在持续完善中,如下图所示:


线上地址:http://www.autopiano.cn

源码仓库https://github.com/WarpPrism/AutoPiano


如何使用

建议使用PC端 Chrome浏览器打开本网站,以提升使用体验。


快速入门 就是依次按键盘上的键进行歌曲演奏,可用的按键有 0-9 a-zshift0-9 a-z 分别代表键盘上的36个白键,按住 shift 则代表启用相应的黑键,黑键的标识用 (^S) 的形式表示,代表黑键S,其他键就用对应的字母和数字表示。


打开快速入门的谱子,依次按键就可以演奏出一首动听的曲子了,但要注意控制音乐节奏和速度,否则就没有感觉了~

如果你没听过相应的歌曲,建议先去歌曲网站听一下,熟悉旋律之后再来演奏,相信会很有成效的。


演奏示例 就直接点开听就好了,慢慢体会其中的技巧,可以帮你了解更专业的钢琴演奏知识。如果想要停止自动播放,直接点击歌曲名右侧的暂停按钮即可。


参与贡献

如果你想为自由钢琴的建设 出一份宝贵的力量,可以点击下方链接:


贡献快速入门简谱,可前往:

https://github.com/WarpPrism/AutoPiano/issues/9WarpPrism/AutoPiano#9

贡献歌词,可前往:

https://github.com/WarpPrism/AutoPiano/issues/12

其他建议直接去评论区留言:

http://www.autopiano.cn

未来规划


赞助我们

AutoPiano是非盈利开源项目,服务器和域名日常维护需要巨大的开支,如果AutoPiano对你有帮助,不妨扫下方二维码支持我们,给服务器续一天:

支付宝

aliqr.png

微信

wxqr.png


更新日志

大家提的建议我都认真看过了,所以在工作之余会逐一完善,感谢大家支持!

2019-06-01

  1. 移动端界面优化,使得操作更方便友好
  2. 增加多首曲子和随机歌词
  3. 性能优化


2019-05-20

  1. 增加预渲染技术,代替SPA,优化SEO,百度总算可以搜到了,虽然排名不靠前。。。
  2. 大量页面细节fix
  3. 兼容ipad

2019-05-15

  1.  重要:域名迁移为 http://www.autopiano.cn,因此也导致原域名下70多条评论全部失效 T_T,只好手动迁移部分评论,扎心
  2. 修改分享组件,百度分享不好用
  3. 增加部分歌曲
  4. 晚安

2019-04-23

  1. MusicXML实验室 beta上线,撒花🎉
  2. 增加几首演奏示例歌曲
  3. 优化网站内脚本加载
  4. 移动端界面微调、优化。但依然建议PC下Chrome浏览器打开

2019-04-08

  1. 增加首页随机壁纸功能,刷新页面随机更换。
  2. 增加几首弹奏曲子
  3. 增加侧边栏歌谱显示
  4. 增加百度分享组件
  5. 增加 babel-polyfill做兼容

2019-04-05

  1. 重要:黑色按键触发键由空格改为Shift,因为空格会导致页面滚动。这样整体按键和国外virtualpiano保持一致
  2. 修复长按单键时,连续播放单个音符的问题(但依然会播放两次)
  3. 添加用户使用指南


2019-04-02

  1. 增加来必力(Livere)评论系统,作为讨论区,韩国产品,国内访问速度一般
  2. 增加多首 快速入门 歌曲 及 随机歌词
  3. 增加歌曲难度星级
  4. 修复多个bug


2019-04-01

  1. AutoPiano上线并开源,感谢阮一峰老师推荐,Github当日获得200+star,Trending靠前
  2. AutoPiano开发历程Readme发布,同步至掘金 + segmentfault