引言


    老大常在不同场合谈论创新的重要性,鼓励大家多思考。有次谈到怎么在一些小点上做优做精,就举了个例子,比如在QQ音乐进度条上也可以预览歌词,我们一听,就觉得这也是个不错的点子,既能有效结合音乐的特性,也能满足部分用户的一些需求。


  大家都知道目前市面上流行的音乐播放器中,歌词展现形式一般是面板歌词和桌面歌词两种,这两种基本上能满足用户对歌词的使用需求,再改动无非就是一些显示效果了,那还有没有其他一些需求没服务好呢?


  想象一个场景,一般情况下听歌,我们不需要歌词,所以就把歌词窗口关了,然后在无意识流的听歌过程中,一句天籁之音冲击了下你的大脑,你有点迫不及待想知道这句歌词是什么,但发现操作起来总是有点麻烦,你需要找到歌词按钮,点击打开,如果不幸打开的是桌面歌词,你还要切换到面板窗口,因为桌面歌词只显示正在播放的内容,这之后你才能找到想要的歌词内容,看完之后还要做关掉的操作,如果不巧显示的是“暂无歌词”,你可能还不由自主地来句感叹,“靠,垃圾”。


  虽然表述有点啰嗦,但有耐心的话,你应该明白了,进度条上的歌词,哪里不知,移到哪里,那就开做吧,我们就是要照顾所有需求,所以才这么苦逼。


实现


  实现其实很简单,大家可能都知道优酷、youtube都已经有了这样的预览功能,如下图,

  只是它们的是视频预览,在我们音乐产品里,就可以把关联性很大的歌词拿来预览了。


  先看下QQ音乐的歌词格式,有两种,通用的LRC格式和QQ音乐专有的QRC格式。


  LRC格式的歌词内容如下所示,每行的开始时间以标准格式标记,下一行的开始时间为上一行的结束时间。

  QRC格式的歌词就复杂些,以ms作为时间标签的单位,除了每行有起始时间和持续时间外,每个字都有时间标签,所以QRC很精准,能达到类似KTV里的逐字歌词效果,因此也是我们推广的歌词格式。不过在预览这个需求里,我们只用到每一行的时间标签。

 

  歌曲播放时,我们会读取歌词文件,把歌词的内容按行按字顺序载入到内存中,并为每一行乃至每一个字都附加上时间信息,这是判断显示哪些歌词的关键依据。


  有了上面这些信息后,剩下的就简单了,播放歌曲后,鼠标移动到进度条任意位置,我们都可以很容易的计算出所对应的时间,然后把这个时间放到所载入的歌词中去匹配,就能获得此位置所对应的行歌词内容,接下来就是输出显示的工作了,看下效果。

 

 

  当然这只是原理性的介绍,更多细节的东西,比如怎么控制显示时机,怎么避免闪烁,怎么处理没有歌词的部分等等,这里就不详说了。


感受


  有时候谈到创新,我们很容易就想得很大,要有非常新颖的点子,要有不同寻常的逻辑,要涉及非凡的技术,要会引起轰动的市场,其实带着这样的包袱反倒会束缚我们的行为,因为没有一个大而全的产品是一蹴而就的,包括公司也是如此,今天你见到的可能是先人们之前都不能想象的。所以多在意点平常不起眼的小体验小功能,抱着服务好自己的心态,也许经过不断的演绎,就质变出了一片辉煌。


  别忘了附上我们的体验地址,欢迎砸砖:http://y.qq.com/#type=down&p=index