騰訊這個H5的套路太深！大部分人沒看懂
這兩天QQ出了一個H5，明明6到不行，很多人卻沒看懂。
H5的主題是在國內上映3天，票房就破10億的電影《速度與激情8》，用的是騰訊特別喜愛的全屏視頻。
接下來，揭秘騰訊給自己挖的坑到底是什么，并整理出交互視頻的其他N種玩法。
1、用視頻來翻頁！
這個H5的名字有點長：6666！QQ全球植入《速度與激情8》！
當你按住屏幕，速8視頻中會突然出現QQ的身影（這植入也是夠隱晦的）。
然而，因為QQ是隨機出現的，而且和電影場景的契合度太高，很多人長按手機后壓根沒注意到畫面變了，還以為本來就有QQ的存在（這坑就大了）……
這種玩法，騰訊去年10月就玩過了，也是長按視頻就會出現“第二現場”。當時騰訊要推廣穿越火線，和品客薯片合作出了個H5《放開那個姑娘，讓我來！》。因為兩個視頻的畫面沖擊力都很強，而且有一定呼應，效果非常驚艷。
下載H5的源文件后，你可以看到原視頻是這樣的——
說白了，視頻就是上下分割、一式兩份，只是通過改變視頻的位置，讓上下兩部分的視頻分別顯示！太會玩了。具體實現上，到底應該怎么做？
2、視頻豎著雙開！
由于橫屏視頻需要比較多的提示，后臺還需要對手機傾斜情況進行設定，用垂直視頻會方便得多。
比如道里全生態鏈創意平臺，就做過一個雙垂直視頻類的H5《如此拉轟逗趣的珠海漁女你見過？我不信！》，在業內反響很不錯。
后面以道里廣告的這個H5為例，說明這種手動切換雙視頻的H5，在iH5中怎么實現。
從上面這張圖，你會看到雙垂直視頻類H5，原始視頻的排列和橫屏類不同。一個是左右，一個是上下。具體實現如下：
（1）視頻開啟安卓微信全屏
安卓微信全屏模式能隱藏視頻的播放進度，還可以在視頻上疊加素材——安卓瀏覽器本來是不支持的，微信端則需要QQ瀏覽器的授權。
視頻播放結束，安卓端會自動退出這種全屏模式；該模式不會影響蘋果設備的效果。
（2）設置舞臺剪切為YES
這一步，目的在于讓視頻超出規定的顯示范圍時，不會顯示。這樣才能讓多出的視頻部分隱藏。
（3）手指按下時，視頻修改X坐標
珠海漁女這個H5，原始視頻的寬高為1280×1136，默認X、Y坐標為0、0。
所以你需要為視頻上層的按鈕設置：“手指按下”時，視頻的X坐標變為-640。
（4）手指離開時，視頻X坐標恢復
同樣地，為了重新播放第一個視頻，還需要設置：“手指離開”時，視頻的X坐標為0。這樣，就恢復為左側畫面的效果了。
（5）為了安卓，還需要一個小功能
如果用戶忍不住手動退出安卓全屏模式（點擊頁面左上角的“返回”LOGO），頁面會變成視頻當前播放的靜態頁面。
所以最后提醒一句，你還要設置一步：點擊視頻時，讓視頻“繼續播放”！
3、用視頻來翻頁！
還有一種H5的新玩法，把視頻當成普通的頁面來切換。
用這個點子的是芒果TV的新作《偶像那么多，我又算老幾》，宣傳最近新出的綜藝節目《超次元偶像》。
這個H5有兩個小心機：
（1）視頻播放到主文案時，突然停頓，用戶必須點擊屏幕才會繼續播放；
（2）視頻末尾的動畫就是最終落地的720°全景，銜接很連貫。
使用iH5制作時，有兩個關鍵點需要注意：
（1）設定視頻的播放時間
為視頻添加事件，設置“播放時間”為N時，視頻暫停，“點擊開始”的動效出現。
（2）讓全景容器提前顯示
上面是偶像這個H5的基本層級結構（獲作者許可進行展示）。
因為全景容器內圖片的緩存需要時間，在這里建議：當視頻緩沖得差不多時，提前讓全景容器顯示，而不必等到播放結束。
4、你不動，它不動！
前面那個H5，通過控制視頻的播放、暫停起到普通H5的翻頁作用，而且能保證視聽效果的和諧。
其實設計師做這個H5的時候，出了兩套方案，下面就是被斃掉的那個H5的部分截圖——也非常炫酷！
雖然這個H5沒有面世，但它的視頻播放技巧很值得借鑒。它用的是長按按鈕，視頻才會播放的交互方法。
具體操作上，可以使用“手指按下”、“手指離開”這兩個觸發事件，分別讓視頻繼續播放、停止播放來控制。
H5交互視頻這么好玩，你是不是也手癢癢，想要試一下了？
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）