背景音乐对提升整个H5作品逼格的重要性不言而喻，《每个不曾起舞的日子都是对生命的辜负》里的音乐在整个作品至少占了30%的分量。那如何找一首惊艳的背景音乐呢？是先确定背景音乐还是先设计好动效呢？像作品《料儿》一个作品里有时有五六个不同背景音乐，他们是如何做到自由流畅切换的呢……
本文将主要从音乐素材收集、选择、剪切、设置四个方面浅谈，欢迎吐槽！
音乐收集
音乐收集，首先要喜欢音乐这个应该没必要多说了！那大家一般是在哪里发现新音乐呢？
我推荐国内最早的轻博客——点点网，虽然官方停止了运营，但是上面的大多音乐达人还在，搜索音乐、电音等相关标签，热度过五，值得一听！大牌广告片也是一个收集音乐的好方式。
《料儿》作者Mr.u等分享的爱给网也不错，里面有很多音效素材。
音乐识别的话，推荐国外的Shazam和国内的音乐雷达，Shazam曾上过App store的精品推荐，很多国外的小众纯音乐都能识别出来；“音乐雷达”是酷我、唱吧等优质音乐APP技术支持方之一，支持哼唱识别，据说中文歌曲识别率比较高，当然现在的微信摇一摇识别体验也不错！
对于音乐收集，总结一句就是“处处留心皆音乐”。
音乐选择
背景音乐的选择要契合主题相信这个大家都有共识，在这里我想提醒的是，很多人有喜新厌旧的心理，背景音乐最好要新。
比如Epub360-H5超级平台发布会这个作品，大家很容易想到史诗音乐比较适合，或者直接想到了很有名的Breath and Life，但是我直接Pass了这首，原因很简单，这首被用的太泛滥了，在Epub360精选作品里我至少就听到过两次。
再比如Geak Watch UI这个作品，我开始想到的是充满科技和宇宙感的Green Sun-Distant Star，但我自己马上Pass了，因为这首也略泛滥，后面马上决定启用Moonlight迷幻空灵的前奏，一是前奏很惊艳，二是这个前奏被用作背景音乐的也比较少。
音乐剪切
由于是移动端作品，所以背景音乐不能大，一般是截取其中一小段循环播放，那音乐剪切工具用什么好呢？
迅雷看看、QQ影音播放器、酷狗铃声带的“音频截取”功能都能满足普通的剪切需求，个人觉得迅雷看看播放器用户体验稍微好些，但是建议用专业的音频编辑工具，推荐的是Adobe Audition。专业的工具精度高，能解决上面那些不容易一次剪切好，要反复剪切试听的痛苦。
音乐设置
《料儿》系列一个作品里有时有五六个不同音乐，但是他们是如何做到自由流畅切换的呢……
1.确定了音频是作为背景音乐使用的，也就是需要跨越多个页面之间，因此，需要把音频放在Masterpage中。（如果是某一页中使用，直接放在那一页中就好啦）
2.把所有用到的音频元素依次插入到Msterpage中。
3.音频元素本身属性的设置，这里要清楚，我们是要特定的模块播放对应的音频，所以，“自动播放”是不需要勾选的，因为不能确定读者在每一页所停留的时间，因此，我们要将“循环播放”勾选上，这样就保证了读者在当前页时能够感受到所营造的氛围。
4.控制在特定的模块播放对应的音频。切换到“Page”页面。
选择需要播放音频的页面，切换到“页面信息”面板，选择“页面触发器”中的“切换到当前页面时”。
添加两个动画事件“播放音视频”和“暂停音视频”
-
“播放音视频”设置（记得点下“M”以切换出Msterpage中的元素）：
（勾选本页要播放的音频元素）
-
“暂停音视频”设置：
（除了刚才播放的音频，其他的都勾选）
Ok，这样一页设置完成，剩下的其实就是体力活了，只需要在本模块中的其他页面做同样的设置就好了。其他模块也是这样喽，只要仔细点就好啦～
怎么样，是不是很简单呢，总结下就是，在每一页将需要暂停和播放的音频分别进行设置就好啦～记住，每一页都要设置哦～这样就不会出现音频混乱的情况。
嗯，以上呢，是说的多个音频的使用，那若是一个音频（作为背景音乐使用）呢，很简单，只需要在“文档信息”这里插入音频就好啦，不用做任何设置：
可以去把这一期复制下，具体的来看下设置～好，派友们，抓紧操练起来吧～
最后，我想分享的是，建议先确定背景音乐！
我之前就吃过这方面的亏，因为之前音乐都是很嗨的，动效也比较欢快，结果后面朋友不满意，要用轻一点的音乐，结果我的动效又全部改，全部调慢。先确定背景音乐，然后边听边做，也许更有感觉些！
关注更多H5设计、案例、资讯