網(wǎng)易H5 又雙叒叕刷屏了！

2018-04-19 h5案例 h5制作 h5平臺熱門H5 微信h5 刷屏H5 精品h5

網(wǎng)易H5 又雙叒叕刷屏了！

都說假期之前的人都是心情浮躁的，可是小編昨天卻忙了一天。等到下午有空刷朋友圈的時候，居然發(fā)現(xiàn)朋友圈清一色的在轉(zhuǎn)發(fā)一份“使用說明書”圖片。定睛一看，天哪，網(wǎng)易的H5又刷屏了。

朋友圈刷屏.png

記得前兩天大家都還在對網(wǎng)易云音樂口誅筆伐，出了個H5大家就突然忘記了剛發(fā)生沒多久的事。不得不說網(wǎng)易云音樂真的是打了個漂亮的翻身仗，好像之前侵犯版權(quán)和讓用戶花冤枉錢都是上個世紀的事情了。

網(wǎng)評.jpg

不過，僅僅是針對網(wǎng)易這支H5來說，刷屏確實是有道理的。這其中的很多地方是值得學習和借鑒的。

網(wǎng)易云音樂：嗨！點擊生成你的使用說明書！

網(wǎng)易-使用說明書案例.png

這支H5出自網(wǎng)易云音樂的一個叫M2的創(chuàng)意工作室，也就是之前的“噠噠”。這支團隊打造過很多刷屏的現(xiàn)象級H5，比如之前的《來，用五筆畫一個你的愛吧！》、《解鎖你的歡樂頌人設(shè)》等等。

策劃創(chuàng)意

首先從創(chuàng)意策劃上來說，這支H5跟之前網(wǎng)易云音樂刷屏的H5略有不同，從趣味測試的角度為切入點，但是又非常貼切的采用音樂的選題進行制作，符合品牌的調(diào)性。用戶在聽到音樂片段之后選擇感受，然后選擇性別，最后生成一張“個人”的使用說明書。

2+3.jpg

技術(shù)開發(fā)

從技術(shù)上來說，這支H5利用人人秀的答題插件就可以直接制作，套用答題插件，選擇趣味測試類型，把題目設(shè)置成相應(yīng)的音頻內(nèi)容，設(shè)置選項分值，最后劃分不同分值的生成的海報頁面，所以開發(fā)難度不大。這里有一個非常重要的創(chuàng)意點，就是最后生成的是“使用說明書”，而用戶是實實在在的人，人的使用說明書聽起來有點奇怪，但是搭配上對應(yīng)的文案，就是另一番感受，這就是需要說明的第三點，H5的文案內(nèi)容。

4+5.jpg

文案內(nèi)容

整支H5的文案，除了測試題和選項之外，吸引刷屏轉(zhuǎn)發(fā)的就是最后生成的“使用說明書”文案。最后生成的海報，采用讀取輸入昵稱技術(shù)，加上各種暖心或者雞湯的文案說明，激發(fā)用戶的優(yōu)越感以及情感訴求，最終實現(xiàn)刺激轉(zhuǎn)發(fā)的效果。

6+7.jpg

交互體驗

再者就是整支H5的交互設(shè)計上，剛才說到技術(shù)上開發(fā)難度不大，利用答題插件就可以制作。但是在交互設(shè)計上構(gòu)思的就比較巧妙，首先是生成的海報帶有用戶輸入的昵稱，給用戶營造專屬感和優(yōu)越感；其次是可重復(fù)操作，體驗過這支H5的用戶應(yīng)該都知道，這支H5可根據(jù)用戶選項不同，重復(fù)生成不同的海報，這樣可以滿足用戶再次體驗和選擇保存哪一張海報的需求，這也會增加轉(zhuǎn)發(fā)的幾率。

9+10.jpg