一个还不错的H5是怎么产生的?

   电影鬼吹灯之寻龙诀“活蒸大粽子”思路解析

  端午节前的时候,我们 [亚当实验室] 为了寻龙诀电影做了一期线上H5的推广。借着鬼吹灯寻龙诀即将上映之际,分享下创作思路。希望大家能得到一点小小的启发。

  看过鬼吹灯的朋友都知道,粽子是一句在盗墓者中流传的暗语,就像山里的土匪之间谈话也不能直接说自己杀人放火,都有一套行业内的术语,就好比lol中不叫蓝buff,叫蓝爸爸一样。粽子呢,即指的是墓里的僵尸。

  H5讲究借势营销,正好端午节有蒸粽子的风俗,而鬼吹灯中又有粽子,正好是一个结合点,那就做个活蒸大粽子的游戏吧。

  一、交互原型

  考虑一下产品原型、交互机制,总体原则是:


  大家不要被上图精细的手法所蒙蔽,我们来看下流程。

  从一个loading开始到分享出去,这是一个用户流程(user flow),逗比用户除外。为了防止用户流失,把复杂的留给自己,把简单的交给用户。这里采用了1个btn的交互形式,这也就是所谓一巴疼交互方式。(button音译:巴疼)

  二、形象设定

  交互机制有了,新的问题又来了。如何结合僵尸的形象和粽子的形象?


  作为一个国产商业片的H5,为了不吓到大多数的观影群众,总不能弄个真的僵尸出来吧?清代米原康正——德艺双馨的袁枚老先生在《子不语》中对僵尸做了一下分类,分为:紫僵、白僵、绿僵、毛僵、飞僵、游尸、伏尸、不化骨(对老先生有兴趣的可以自行百度,就不在这个严肃的技术帖中讲述了)。看,古代人总结的僵尸的视觉识别系统也有以颜色来分的,别老闷着头做设计,多读点书。

  为了简化执行,这里我们采取了五种颜色来区分粽子的方式。

  经过一系列的讨论,可爱的僵尸粽子形象就出炉了,红黄蓝绿青靛紫,而且这绝对不是葫芦娃,一个藤上七个瓜。这是为了差异性,考虑到用户蒸完粽子之后,得到的结果不同,这才有意思嘛(集齐几种颜色粽子可以召唤超级大粽子),这也很重要。


  三、视觉设定

  粽子形象弄出了之后,下面开始设计蒸粽子的场景。


  这。。。这个原型图。。。现在看起来。。。画的像一坨金山。。。不过不要在乎这些细节。这里我考验一下大家,根据这个原型图如何来设计一个酷炫叼炸天的主视觉?比如下面?


  是吧?好像看起来也不错呢!但是,按照原型图上直接设计出来,这和按钮上面加一道光有什么区别?说好的狂拽酷炫叼炸天呢?也许我们可以自己头脑风暴一下。蒸!蒸!蒸!蒸功夫?杭州小笼包!?在此省略N步。

  蒸汽朋克风格应该挺不错的,找参考看看!好像有戏。感觉端午节终于可以安心回家吃粽子了,想想还有点小激动呢。


  参考也看了,开始构思吧。作为一个人们口中所谓的大神中的大神,呵呵呵呵,我是不会告诉你我的十多年浸淫的手绘水平是这样的。


  听说这种手绘会掉粉,我就呵呵了。我用的可是24b的铅笔呢,又不是粉笔,怎么会掉粉呢。

  构思图都出来了,收集各种素材,放到Photoshop里面各种啪啪啪,主视觉就完成了。

  四、成果展示


  案例详情:http://www.digitaling.com/projects/16067.html

  扫描二维码,立即体验!

  (数英APP手机用户,需点击放大二维码后,长按识别)


  做了一大堆动效,loading的动态,蒸汽的喷射,灯笼的摇摆,老电影的效果。。。慢着,微信没办法直接转发,还得做个右上角的指示动画,每个地方都要求细致,导入AE中,继续啪啪啪。


  动图展示:

时间: 2024-09-29 09:59:07

一个还不错的H5是怎么产生的?的相关文章

如何做一个有温度的H5?

  移动互联网的时代,H5已经不仅仅只是一个展示工具. H5+游戏=互动 H5+图片=移动海报 H5+动画+音乐=微电影 从早期的单屏滚动,到后期的立体交互,H5+时代已经来了,几乎所有的创意表现,都可以通过H5来展现.随着H5模版开发的快速更迭,人人都可以制作优质的H5,如何才能脱颖而出,一鸣惊人? 2014年的某一天,一款名为<测测你的帐号价值>的H5风靡了整个朋友圈.在那段时间里,原本低调的好友纷纷开始炫富:"我的QQ居然价值18栋海边别墅""我的QQ价值3

任意图片实现垂直居中的三种方法(兼容性还不错)

希望图片垂直居中的情况在网站开发过程中会遇到很多,我总结了一下,曾经使用过的几种方法来使图片垂直居中,除了第一种方法只限于标准浏览器外,另外两种方法的兼容性还不错,感兴趣的朋友可以了解下   在网站开发过程中,可能会有希望图片垂直居中的情况,而且,需要垂直居中的图片的高度也不确定,这就会给页面的布局带来一定的挑战.我总结了一下,曾经使用过的几种方法来使图片垂直居中,除了第一种方法只限于标准浏览器外,另外两种方法的兼容性还不错. 方法一: 将 外部容器的显示模式设置成display:table,这

如何快速搞定一份看起来还不错的PPT?

  纸面功夫30%.素材收集30%.软件制作20%,今天这篇是阿里巴巴的资深交互设计师@Heidixie 在内部分享的干货,重在帮你摆脱工具,直击PPT「沟通传达」的本质. 新年除了做工作规划,还做了一些个人2016年学习和提升计划,其中,"聚焦"又是工作中项目的关键词,也是个人提升这块的关键词. 所谓厚积而薄发,在我理解,反而是之前要做大量的积累(所谓厚积),而之后更多的是垂直向下深挖打透,在这个基础上,才能够薄发一些可给别人以启迪的东西. 那么我的2016,想要聚焦于[可视化]话题

cocos2d-x-alphaBeta算法做象棋还是很笨而且很卡,有没有好的AI算法效率还不错的

问题描述 alphaBeta算法做象棋还是很笨而且很卡,有没有好的AI算法效率还不错的 有没有对算法非常了解的大神,小弟在学做一个cocos2dx象棋游戏中使AI困难模式的算法使用alphaBetaSearch搜索算法,不过本人对这个算法的了解不是很深,整个游戏框架基本搭建完成,但是就算使用了减枝优化后,实际运行的时候还是卡的有点久AI才做出反应,有没有在此基础上还可以优化的方法.有懂算法的大神可以点播一下么. 我总觉得按他们那个alphaBeta算法做象棋AI还是很笨,我随随便便就下赢了,我是

我只用asp.net和sql server 可以开发一个相对不错的网站吗?

问题描述 我只用asp.net和sqlserver可以开发一个相对不错的网站吗?对于我刚刚入门,对于网站还不是很了解,就会asp.net和sqlserver并且技术都很平平的,想请专业的人士给指点下,我就用这两个技术可以开发出来一个可以上传下载和留言(差不多和论坛一样的功能)的网站吗? 解决方案 解决方案二:ASP.NET+SQL可以开发这样的网站,比这个功能更强的网站都可以开发问题是你有没有信心去开发它,加油啊,兄弟,有不懂的问题,就到这上面来发帖解决方案三:该回复于2009-05-03 14

发现1个还不错的美女视频联盟分享给大家

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 做了2年图片站,做了N个适合图片站做的联盟,一路经历了多少的风风雨雨,有过多少次的欺骗和心碎,之前开始做九赢的CPC,几W的IP1天收入很不理想,发现他们的扣量还是很厉害的.后面选择169V的视频聊天,我做CPA,开始每天的注册量还不错,收入远远大于做CPC.做了大概1个月,发现后面几天注册量1天比一天少,一个站长的嗅觉告诉我,他们在慢慢加大

为什么看上去还不错的创业企业会早夭?

导语:创业的方向一定要找准,要充分了解用户需求,千万不要把伪需求误以为是刚需,也不要想着暂不考虑盈利而是一味地做大用户规模--为什么中国有那么多看上去还不错的创业企业早早夭折?那是因为这些创业企业身上有着太多的硬伤.其中常见的硬伤有4类:伪需求.先做大用户规模 暂不考虑盈利模式.股权结构缺陷.路线图和时间表.伪需求"中国早期创业投资交流活动市场,免费参与人群和付费参与人群之间的转化率还不到1%."一次在和17STARTUP创始人文飞翔交流过程中,她谈到了17STARTUP此前一直坚持做

这个教程还不错 大家可以看看

问题描述 解决方案 解决方案二:我也看过缘分哪解决方案三:还不错,书看不进的可以看看..不过还是不如自己多看书多动手,再好的教程也是靠自己解决方案四:同意楼上,赞同哦

还不错

问题描述 呼呼,论坛还不错就是看不懂 解决方案 解决方案二:呵呵,我很开心啊楼主多多给分------解决方案三:----解决方案四:看的懂就没时间来论坛了解决方案五:重点在给分--分:C=懂,分母是常量,楼主,要多懂就看你的分子了!解决方案六:那就多来来呗~~!解决方案七:ding~~~~~~~~~~~~~~~~~~~~~~~~~~解决方案八:楼主是来散分的!解决方案九:确实不错解决方案十:领分来咯解决方案十一:有些看不懂没关系,重点在是否能解决楼主的问题.解决方案十二:接分,你懂的~解决方案十