通常，H5都是由1家品牌產(chǎn)品，并只代表自己，從來沒聽說過，能有這么多品牌聯(lián)合在一起，制作項(xiàng)目的？這H5究竟是什么來頭？？？咱們還是來先睹為快吧！

掃描二維碼，立即體驗(yàn)！
（成都App用戶需點(diǎn)擊放大二維碼后，長按識別）

這H5要怎么操作？

可能有些朋友，直接打開H5就懵逼了，這H5怎么用呀？使用方式很類似于，蘋果手機(jī)的 Assistive Touch（輔助觸控）的操作方式，通過觸控按鍵，來進(jìn)行APP氣泡的添加和刪除，在調(diào)出的APP列表里，還有搜索界面，可以查找，你想找的APP。

氣泡之間也有著非常真實(shí)的物理還原效果，你可以通過拖拽，搖動手機(jī)的方式來體驗(yàn)，這就是H5的所有操作和效果了。

這支H5效果很特別，但它要做什么用？

效果真的很特別，也非常出乎意料。但是，這么做有什么用，看的我是一頭霧水？

其實(shí)，H5想表達(dá)的是一個(gè)類似“屏幕時(shí)間”的概念，簡單說，就是用可視化的方式來直觀呈現(xiàn)你使用各種應(yīng)用的時(shí)間比例。

一個(gè)屏幕中，應(yīng)用所占用的時(shí)間

屏幕時(shí)間的二維效果圖

你應(yīng)該注意到了吧。H5當(dāng)中，所有氣泡是有大小的，同樣的APP，大氣泡代表時(shí)間投入多，小氣泡代表時(shí)間投入少，整個(gè)屏幕的氣泡展示，就視覺化呈現(xiàn)了一個(gè)人的習(xí)慣、特征和行業(yè)，這也是設(shè)計(jì)者的初衷。

不同人的不同屏幕時(shí)間

如果從概念本身出發(fā)，每個(gè)人的“屏幕時(shí)間”，應(yīng)該是自動進(jìn)行生成的，而不是手動設(shè)置的，這樣才會更加的逼真和可信。

道理雖然如此，但受限于目前技術(shù)的限制，所以，H5還無法調(diào)用每個(gè)手機(jī)的數(shù)據(jù)信息。最后，才只能以這種方式來展示。

不同人的不同屏幕時(shí)間其實(shí)，咱們是沒必要糾結(jié)這些問題的。而應(yīng)該看到的是，原來H5是能呈現(xiàn)如此逼真和復(fù)雜效果的，這確實(shí)是讓人腦洞打開的實(shí)踐和想法。

屏幕時(shí)間示意圖

這支H5是誰做的？

看到這里，小呆也終于發(fā)現(xiàn)了，這支H5雖然涵蓋了多個(gè)品牌，但并非是任何一家出品，而是由一人作為自發(fā)項(xiàng)目，獨(dú)立制作完成的。

雖然，H5在完成度方面，還有很多問題，但當(dāng)我得知，這支H5是由1人完成的時(shí)候，我還是有些震驚的！

必定，一支H5涉及到了策劃、設(shè)計(jì)、原型、開發(fā)、上線等等多個(gè)環(huán)節(jié)，而且這所有的環(huán)節(jié)，還都能做到如此的深入，這可就是非常困難的事情了。

就實(shí)現(xiàn)方式來說，這支案例的技術(shù)涉及到了 Processing、Cinema4D、After Effects、Houdini等工具，而主要的工作量集中在了代碼開發(fā)，而非設(shè)計(jì)圖的繪制。

小站之前也分享過作者另外一個(gè)H5項(xiàng)目——《國內(nèi)1000名知名設(shè)計(jì)師，一起被做成了一支H5！》

說到缺點(diǎn)么，主要還是完成度方面，就一支作品而言，這其實(shí)更像是一個(gè)DEMO，而非一個(gè)完整作品，沒有具體的結(jié)束與開始的感受，體驗(yàn)很不完整。

不過，雖然很多人覺得看不懂，但是，H5還是會有一種很驚艷的觀賞體驗(yàn)，大家更驚奇的是，原來H5還能實(shí)現(xiàn)如此復(fù)雜而真實(shí)的效果，如果稍加故事化，或者內(nèi)容化，這支H5就會非常有意思了。

看來，只用營銷的標(biāo)準(zhǔn)看待H5，還是太過于狹窄了，他的很多延展性，還有待于被發(fā)覺，這次的自發(fā)項(xiàng)目，就有這樣的一個(gè)啟示。

分享這樣的技術(shù)腦洞給大家，也希望能給大家?guī)硪恍﹩l(fā)，同時(shí)，這支H5也讓小呆感慨，這個(gè)行業(yè)也真的是人外有人，天外有天！很多大神都在悶聲做研究呀！真是長見識了！

好了，這就是小呆這期的分享了，讓更多人看到好的創(chuàng)意作品，讓更多人看到作品背后的價(jià)值，希望今天的分享能讓你有所收獲，歡迎關(guān)注小呆的H5小站！歡迎大家留言與我互動~

注：本帖所有圖片來源于公眾號：壞打印機(jī)

成都用戶原創(chuàng)，轉(zhuǎn)載請遵守規(guī)范
作者公眾號： H5廣告資訊站（ID：H5-zixunzhan）