视频代替动画，手机游戏新玩法大揭秘

视频代替动画，开启交互视频时代

咱们试着用视频代替动画？这“动态图”可不仅仅是看电影那么简单，还有更多互动玩法。我们这儿弄出了点儿新意思，给手机上的HTML5游戏带去了不少新鲜创意！

解决音频与视频在移动H5开发中的实际问题

玩游戏老碰到音乐和视频的事儿挺闹心的？尤其在iPhone上，还得手动选歌，安卓旧版的更容易出错。其实，有这几个小窍门儿就简单多了。比如，找个新音乐站，能省很多麻烦事儿；再者，用手机自带的功能也能轻松搞定！

交互视频技术在实际生产中的应用

最新潮的互动视频帮你解决各种疑难杂症！瞧左边那块屏幕，原始的沉闷动画消失无踪，取而代之的是全新效果和背景遮罩功能，就算环境很暗也照样看得准。这个神奇的玩意让你对着任何事物，不管多小的都可以互动，比如点点，滑动啥的，让你乐此不疲地玩耍。

//修复ios 浏览器不能自动播放音频的问题 在加载时创建新的audio 用的时候更换src即可
Xut.fix = Xut.fix||{};
if (Xut.plat.isBrowser && Xut.plat.isIOS) {
    var isAudio = false
    var fixaudio = function() {
        if (!isAudio) {
            isAudio = true;
            Xut.fix.audio = new Audio();
            document.removeEventListener('touchstart', fixaudio, false);
        }
    };
    document.addEventListener('touchstart', fixaudio, false);
}

挑战与解决方案：移动端视频标签应用问题

手机看视频总卡顿，特别是安卓机。这次我们用了混合开发技术，从系统深层解决问题，还有很厉害的VideoJS帮忙。看，连iPhones自动播放视频也没问题！模拟人工操作，就是这么神奇！

//如果为ios browser 用Xut.fix.audio 指定src 初始化见app.js
if (Xut.fix.audio) {
    audio 
=
 Xut.fix.audio;
    audio.src = url;
} else {
    audio = new Audio(url);
}
audio.autoplay = true;
audio.play();

压缩图片需求：从精灵路线到视频代替动画

省内存好办法来！我们这儿有个神奇秘诀，让复杂的动画变成傻瓜式视频。压缩视频技术现在强大得很，720P画质也能压到超赞效果，不仅如此，还能适应你的动作变化，处理掉背景等等各种操作~

探索交互视频技术下的图像处理挑战

谈到互动视频，别忘了图像处理是个重要环节！Canvas和Video两个工具能帮我们搞定画面问题。先搞点前期工作——抽取每秒图像的像素数，再整修下背景什么的。别忘记利用缓存功能，调节下RGB颜色值，让后台效果更好看。

未来展望与思考

现在大家都爱看那个短视频~手机 H5可是有无限可能！首先，得让它们玩起来更有趣、更快、更好用！然后？那就是把这些技术啊方案啊啥的做得更好