本期的HTML5案例學習為大家講解一下最近比較熱門的案例：**突擊_吳亦凡H5方案交互示意案例，將為大家帶來不一樣的感覺，讓大家感受一下HTML5的魅力，弄懂這個H5創意完成的整個過程。如果大家是從事HTML5游戲開發工作的話，對于HTML5的新特性或多或少都有所了解，網頁設計師和開發人員可以使用這些特性以及相關的html5 開發工具可以制作出更加**的網站，體現更好的效果出來的，在學習HTML5游戲開發的朋友不妨借鑒一下這個案例的價值，制作出更多精彩的創意。
在html5游戲開發中創意永遠是命題作文，項目初期團隊了解到：吳亦凡簽約全民突擊將會是一個立體完整的Campaign，***隊希望TGideas在Word視頻教程">Word視頻教程">Word視頻教程">H5這個模塊，通過出彩的創意引爆話題，沒有任何素材，吳亦凡只能在拍戲間歇給出1個小時的時間來錄制一些內容，因為這段時間吳亦凡在拍古裝戲，他的頭發沒了。
在種種條件限制下，只能用巧勁解決問題，在懸念設計上需要有一個能抓住人的點，吳亦凡簡短了頭發風格變得犀利，全民突擊又是一款軍事題材的游戲，那參軍入伍這件事情結合上述條件貌似巧妙的合情合理，在大眾，特別是粉絲眼里，自己喜愛的明星參軍這是一件大事，一定會引起關注和討論。確認這個概念之后，剩下就是形式的問題，一篇娛樂新聞一定會引起廣泛的關注，所以我們提出用新聞頁的形式，來做創意落地。
這個案例有趣的地方是：大部分人真的會用讀一條新聞的心態來關注這個新聞，但突然動起來，并跑出畫面的吳亦凡，一定會超出用戶對內容的固有預期，于是創意中最重要的一個引爆點就此形成。相信很多人轉出來，都希望他的朋友也能夠“嚇一跳”（后來看到很多分析貼說鬼節當天出這個創意太犀利，其實我想說素材本來是打算在今天12點再發的，無奈有人提前在朋友圈做了曝光…）
至于視頻通話的創意概念，其實并不是什么新鮮的玩法，在這之前這種形式的案例也非常多，這個模塊的關鍵點在于：與明星面對面的溝通，這是一個很核心的粉絲向內容，喜歡吳亦凡的人一定會看著心愛的明星和自己近距離對話，所以這里就是用用戶熟悉的形式，道出了廣告內容的真像而已。
刨去創意模塊，其實在我看來更關鍵的還是執行，做到比想到更重要。
TGideas內部臨時組成了項目小隊，由視覺，前端，開發，創意，多媒體的小伙伴快速開始就執行難點進行評估。
技術方面，視頻如何流暢播放？HTML5在IOS，Android，微信，手Q，微博，騰訊新聞客戶端打開時瀏覽器的兼容問題如何解決？大量技術問題，到現在我們的前端攻城獅們仍在優化解決。設計方面，新聞頁打開后什么時候讓視頻自動播放？整個體驗過程如何能制造驚喜？如果用戶再PC端看到這個消息，點開后的PC頁面展示形式如何，能否依然有互動樂趣？我們的設計獅也還在迭代優化中。素材的籌備方面，為了讓吳亦凡在1個小時內快速的完成素材的錄制，TGideas的設計師親自上陣，輸出了完整交互原型之后，還輸出了完整的互動demo，方便吳亦凡能夠快速理解創意點，并在拍攝過程中全程跟進監制。整個過程中也有外部伙伴積極配合藝人拍攝的協調和執行，以及文案的最終潤色。
**突擊_吳亦凡H5方案交互示意
（以上是原型稿的設計方案）
**突擊_吳亦凡H5方案交互示意
（以上是TGideas設計師為了方便吳亦凡理解，自己表演輸出了demo）
**突擊_吳亦凡H5方案交互示意
（以上圖是創意同期輸出PC版，確保多端體驗）
移動互聯網時代，優質的傳播素材是核心引爆點，創意與技術**結合，就會有奇妙的化學反應。
回想起來，這次的吳亦凡入伍案例，就是以前PC端富媒體廣告創意形式在移動終端上的巧妙再現而已。其實是一個嚴苛條件命題下執行比較到位的小聰明，想必行業里做互動的伙伴們一定也會這樣認為。
總結：話說近年來，H5方案以及相關的html5 開發工具猶如雨后春筍的出現，不過質量也是參差不齊的，本期給大家篩選的H5精品案例：**突擊_吳亦凡H5方案交互示意，還是蠻有創意的，盡管HTML5簡稱過來的詞匯，在大多數人聽起來，仍十分陌生且難以理解，但HTML5似乎正在走進成為各大公司的市場、公關等負責推廣和傳播的部門人員的視野當中，本期的html5教程通過這個**突擊_吳亦凡H5方案交互示意案例進行分析，希望對大家學習有所幫助，更多的html5教程可登陸課課家官網查詢相關課程學習:http://www.kokojia.com/s/163.html

資訊來源：http://www.kokojia.com/article/5055.html