专栏名称: 站酷网
关注站酷网公众账号,随时随地了解最新的原创设计作品、设计师招聘信息。
目录
相关文章推荐
字体设计  ·  厚重纹理的破旧处理方法的秘密 ·  3 天前  
庞门正道  ·  这些漫画少女,长得也太好看了吧~ ·  4 天前  
字体设计  ·  2025设计师们的年賀状 ·  5 天前  
51好读  ›  专栏  ›  站酷网

简单一步,助你成为H5创意高产达人

站酷网  · 公众号  · 设计  · 2017-05-24 14:48

正文


创意从来不是凭空捏造,你总能嗅到似曾相识的味道。

 

在时尚圈,时尚潮流就是不断轮回的一个过程。


裙子与裤子向来都是分开穿的,然而今年春夏,裤裙叠穿竟然成为了新的潮流趋势。


其实早在上个世纪60、70年代,已经流行过Dress over Pants,各大时尚杂志都有刊登这种时髦穿法。



H5营销界同样如此,创意不断被复用,形式不断被更新。

 

  • 前不久引起争议的《此处故意留白》H5,长幅漫画触动许多广告人的心。殊不知H5的很多原画来自法国的一个APP《Phallaina》,一本广受国际业界好评的数字漫画书。


 

  • 3月网易出品的魔性H5游戏《迷雾世界》,朋友圈很多人大呼惊奇与好玩。但是很少人知道,这款H5的玩法和一款APP游戏《Steppy Pants》一模一样。


 

  • 去年年底网易有两个H5同时刷屏,一个是《二零一六年娱乐圈画传》,画中画的形式让人眼前一亮。但随后有人扒出,这种形式最早来自作家伊斯特万.巴尼亚伊的无字绘本图书《变焦》(1995)。


 

  • 另外一个刷屏级H5是《我猜,你的2016在这里》,长按换词来到不同交互场景,很有意思。不过行内人却从该H5认出一些国外大牛的影子,比如音乐互动网站Because Recollection。


 

  • 就连14年大火的《围住神经猫》H5小游戏也不是原创。鼻祖是日本游戏师Taro Ito 在2007年制作的Flash游戏《 黑猫Chat Noir》,而“神经猫”直接采用了日本漫画《全是猫》的形象。



类似的案例还有很多……


我们发现,很多刷屏级别的H5页面,创意的来源是Flash游戏,是APP,是网站。


以前的Flash游戏搬到原生应用上,火了!

再搬到H5上,又火了!


而奇怪的是,那些游戏的源头/灵感来源/抄袭来源则基本无人问津?


举个例子,你听说过《2048》的创意来源《Threes》吗?



这是因为时代在变迁,内容的载体也在变迁。


结合时代趋势,踩中用户萌点或雷点的东西,才能抓住用户的心。


而当今大火的内容载体是H5,随用随走,无需下载,体验更佳!


去年11月底,Facebook Messenger就推出H5游戏平台Instant Games,你可以和好友一起PK吃豆人、打飞机、Bingo等经典游戏。


iH5也在最近推出了功能更加强大的iH5 3.0版本,全新引擎,对网页应用和H5游戏支持更好,同时支持代码植入。



可以预见H5未来的发展趋势会是重度营销、网页应用、H5游戏。


同时,H5的传播能力非常强。


当今有很多经典有趣的游戏都以flash或app的形式存在,如果用H5做载体,可能经典就会变成流行


接下来给大家介绍6款非常好玩有趣的APP,是我沉迷游戏数周,玩了几十款游戏挑选出来的。


这6款应用的交互都很简单有趣,基本上都是一个手指就能操作,逻辑简单。最重要的一点,大多可以用iH5的3.0版本进行开发。


1. 阅读空气


这是一款来自日本的情商测试APP,教你“读空气”,用简单的小游戏揭示微妙的人际关系。


你有没有“眼力见”,你生活中有哪些地方做得不到位,一玩便知。

 

不同于以往的测试题,阅读空气的每一道题都是一幅互动漫画,黑白图像中,红色部分是可操作的。玩家要做的,就是用手操作(有时不要操作),让画面中的人物(有时不是人物)做出恰如其分的行为。每答完5题会有反馈。

 


阅读空气2013年时在日本韩国台湾风靡,累计有300多万下载量,还出了第二版。

 

iH5制作要点:动画的制作可用动效、时间轴或序列帧。测试结果可用事件来进行判断。


2. 忍者Spinki挑战

Ninja Spinki Challenges!!


忍者Spinki挑战是Flappy Bird 开发者Dong Nguyen在今年年初上线的新游戏,该游戏继承了Flappy Bird的操作简单和高度虐手,只要一个手指就能玩遍所有关卡。



含6个小游戏,每一个游戏都非常简单但又魔性,光是看忍者Spinki走来走去就可以看一天,很容易上瘾。

 

给大家找了个短视频,瞅瞅这个虐手游戏到底有多虐:



iH5制作要点:撞击效果主要是运用“物理世界”、“碰撞探测器”、“物体”组件,时间轴动画可以做障碍物的运动场景。


3. 摇摆直升机

Swing Copters


Swing Copters和Flappy Bird可以说是一对双胞胎,同样的套路,同样的虐手。


Flappy Bird是只会上下飞的像素鸟,Swing Copters就是只能左右飞的直升机。


你需要点击左右两边的屏幕来修正它的飞行轨迹,避免被一层又一层摇摆中的巨锤砸到。



iH5制作要点:撞击效果是运用“物理世界”组件的“碰撞”事件,直升机的运动轨迹用了“缓动”组件,而摇摆的巨锤则可用时间轴动画实现。


4. 石头推车

Corocco Truck


石头推车是一款拥有动作元素的解谜游戏,玩家在游戏中要和小石头Corocco一起想尽办法搬运一个行尸走肉般的上班族Norio去上班。

 

游戏只有简单的几个方块、圆圈、矿车、一个表情困倦的石头Corocco以及一个充气娃娃人Norio。


你要做的,就是利用手机重力感应来操纵石头,用尽一切方法,将人装到矿车上,移动到终点。



iH5制作要点:运用“物理世界”和“物体”组件,石头的质量一定要设置比人大,才能推得动人。


5. 神回避


神回避是日本搞笑游戏的经典之作,一款非常有意思的解谜小游戏。


游戏里有各种即将袭来的危险等待着玩家去解决,大家需要在有限的时间内找出关键的道具,帮助主角回避各种奇奇怪怪的事物。


比如回避厕纸、回避黑板擦、回避被球击中、回避人马兽等等,脑洞十分清奇。



游戏采用漫画的形式展开,共分成六页,每格为一关,虽然只有31关,但是这并不意味着游戏的可玩性很低。


相反,这三十关游戏可以让你玩出100关的味道。不像普通密室逃脱,这款游戏即使拿到所有道具,也还是要拼脑洞才能过关的。


iH5制作要点:用万能的“事件”将透明按钮、动效和动画联系起来。iH5 3.0的事件增加了很多判断逻辑,做密室逃脱将会更得心应手!


6. 奇葩钓鱼

Ridiculous Fishing


奇葩钓鱼是一款玩法另类的像素风休闲游戏,2010年时的Flash版本风靡一时,玩法正如游戏的英文名字一样:Ridiculous。



游戏涵盖3种玩法:


①放线:将鱼钩扔下去,利用手机的重力感应倾斜手机控制鱼钩下潜方向,让鱼钩尽可能的深入海底,期间避开任何鱼类。


②钓鱼:一旦碰到鱼,就开始收杆,这时候要尽量碰到鱼,碰到的鱼统统会上钩。


③打鱼:鱼钩升上水面时,所有收获的鱼会华丽地撒向空中。疯狂点击屏幕中的鱼,点到多少就奖励多少。


这款游戏还是个细节控,随着下潜的深度,海水的颜色和能见度等都会随着变化。不升级装备,就无法下到深海啦~


iH5制作要点:“物理世界”制作碰撞,“克隆”事件可以克隆出很多的鱼,计数器可以计算打鱼分数。



这6款APP小游戏很有意思,然而目前还算比较小众,如果能借助iH5开发成H5游戏,传播度将会更高。


不过要注意,不是所有类型的原生应用都适合开发成H5广告!


H5广告的真谛就是要用最短的时间,最好的创意去诠释一个产品或概念。


比如一个周期很长,操作复杂的养成游戏,就不适合应用到H5广告内。


做一个H5不难,因为有iH5这个强大平台;

想一个H5创意却非常难,可遇不可求;

当创意枯竭,束手无策时,不妨找找原生应用获取灵感吧!


作者:Tianxx__

封面图设计:3.1415...




精品内容推荐:


回复关键词“内测码”,获取内测邀请码,体验iH5新工具;

回复关键词“费玉清”,看老司机的开车秘密;

回复关键词“跑马灯”,了解天猫跑马灯H5的台前幕后;

回复关键词“网易”,猪厂的刷屏H5你不要错过;

回复关键词“活口”,围观那个让大家掏了一块钱的H5;

回复关键词“全景”,掀开淘宝两个全景H5刷屏的神秘面纱;

回复关键词“动效”,最全的H5动效介绍&应用都在这儿了;

回复关键词“资源”,你将得到最实用的H5设计资源合集;

回复关键词“2016”,为你揭开2016年H5行业的功与名;

回复关键词“培训笔记”,听说不可外传的H5内部培训秘密;

回复关键词“真假朋友”,教你做腾讯那个真假朋友大质检H5;

回复关键词“100个字体”,免费下载100个可商用设计字体;

回复关键词“SVG”,免费下载SVG格式文件&AI源文件;

回复关键词“神器”,免费下载几何抽象风格素材制作神器。



不想错过新鲜的H5干货资讯?

加我:ih5_cn