腾讯3D创意H5,挑战解锁10种改变人类的药物

举报 2019-11

腾讯3D创意H5,挑战解锁10种改变人类的药物

人类一直在找疾病的解药,现在使命交给你,你会花多长时间?

11月1日,腾讯医学ME大会推出一支3D创意H5。用户扫描二维码,即可进入3D拼图游戏。游戏共设置10个医疗药物的碎片拼图,用户需要用手指顺时针或逆时针360°滑动屏幕,来将分散的碎片拼到中心,生成完整的药物插图。

该游戏比普通H5难度更大、更富挑战性,每份拼图要花费1分钟左右的时间,这也侧面反映出人类医学探索的艰难历程。

扫描二维码,马上解锁药物拼图!
(数英App用户需点击放大二维码后,长按识别)
1572928300889034.png

腾讯3D创意H5,挑战解锁10种改变人类的药物

腾讯3D创意H5,挑战解锁10种改变人类的药物


1、阿司匹林

1572929048900703.jpg


2、HPV疫苗

1572929050270875.jpg


3、胰岛素

1572928094905150.jpg


4、链霉素

1572928096486098.jpg


5、天花疫苗

1572928098681197.jpg


6、青蒿素

1572928102362211.jpg


7、免疫球蛋白

1572928103735846.jpg


8、HBV疫苗

1572928105812101.jpg


9、青霉素

1572928107503441.jpg


10、维生素C

1572928108758080.jpg


项目背后

1574706228121825.jpg

10.1国庆来临前夕,我们的好朋友CP+B的同事发来的加班,不对,是合作消息邀约,腾讯ME大会这一医学界的大会需要制作一支H5,而Concept大概也有了,“斯芬克斯之谜”,好抽象啊,认真的听完后,这是一个谜语的Idea,而谜语就是影响人类几千年的疾病本身。 

这个简单有趣啊,用细胞等元素谜题整几个虚幻一点的形式,让用户参与解开就好了,什么阴影啊、剪影啊、角度啊、拼图之类的。

在和CP+b我们一同Brainstorming几轮后,嗯,事情好像没那么简单。这是一个“严肃”的大会,也不能太恶心(特制病毒独有原型)太视觉了,所以,他一定可以更有趣一点。哦,更重要的是。它将运行在HTML5页面里。

腾讯3D创意H5,挑战解锁10种改变人类的药物

所以我们一起先找到了10种对人类影响深远的疾病,文献资料以及长什么样子,突然发现,微观的世界也挺好看的。

病毒本身也挺有特点的,不如?对,不如直接让病毒本身成为谜面。于是我们找了大量的参考,一起让这个idea继续了下去。

腾讯3D创意H5,挑战解锁10种改变人类的药物making of.002.jpeg

同时,我们也注意到交互的重要性,于是现在三维软件里实验了一下安全的方案,比如,将图片本身打散撕裂来拼合。显然,这样的效果很假。然后又先模拟了破解组合的方式,貌似可行。

胶囊.2019-11-24 04_08_07.gif错位.2019-11-24 04_06_16.gif

我们的同事小天才加了一会儿班,我们第一个测试DEMO出来了(我们叫它火龙果)。

making of.004.jpeg

考虑到最重要的是运行效率和优化,我们无法100%的呈现三维软件的效果,所以我们又做了不同材质的测试(向下兼容至iPhone6)Demo

making of.005.jpeg

当原型准备好以后,我们将目光再次对准了病毒。时间不等人,先做原型设定!

making of.006.jpeg

再加一点点细节。

making of.007.jpeg

确实有一些病毒天生长相邪恶,在和客户的沟通之后,大家觉得适当的空间以好看为主,于是我们又迭代了几个版本直到最终。

1574707444711327.jpegmaking of.009.jpeg

这期间,我们迎来和客户沟通最为频繁的一个话题,到底是有一些挑战性的游戏,还是游戏性的广告?

最终,感谢CSIG的客户们最终决定了一个平衡且效果不错的方向,从最后的数据来看大约有1:1.57的关卡游戏率,一半多的用户会再次继续玩其他关卡。(数据来自腾讯MTA分析平台)

making of.013.jpeg

在整体的Flow上面,我们主要迭代了以游戏或者是医学角度为主的版本。结合了客户的宝贵意见,我们摒弃了传统的landing页面,进来直接进入小游戏界面,减少了用户的操作路径。

1574707547109492.jpegmaking of.011.jpeg

而朋友圈外层的视频交互我们也尝试很多别的版本,最终决定一个能引起好奇心的交互版本。

making of.012.jpeg

在和客户一起创作的过程中,最惊喜的就是文案了,从一开始的学术角度,到最后大家都喜欢的大老师的文案版本了,将这次的破解病毒的话题变得轻松有趣。又保留了知识点。

个人最喜欢的就是治疗糖尿病的胰岛素:“百年前,人们对抗糖尿病只有一招:挨饿。而胰岛素,能让患者吃饱了和糖尿病打持久战。”

making of.014.jpeg

最后,感谢CP+B的所有同学们和CSIG的朋友们。

我们一起努力在不到一个月内让这个项目成功的完成。也了解了医学史上的知识,完成了ME大会这一有意义的的项目,无论是一个H5还是一个Campaign或是一支video,我们都将让它变得更出色,感谢AmusedArt我们所有的同事们!

希望看这篇文章的所有创意人健健康康,远离疾病!

1574707621884294.jpeg

PS:最后上我司后期一哥生生将它玩成了竞速游戏,求打破记录。

making of.016.jpeg

扫描二维码,立即体验!
1572928300889034.png

数英奖case video——[ a _ a ] Amused Art,制作公司

创作企业名单:

AmusedArt
CP+B


创作人员名单:
创意 Creative : Fashion.fan樊申  
美术指导 Art Director : 刘铮 樊申
项目管理 Project Manager : 朱紫玉


数英奖参赛项目说明——[ a _ a ] Amused Art,制作公司

【背景与目标】
腾讯旗下的腾讯医典《2019腾讯医学ME大会》是Me大会的一个细分科学领域子品牌,在这个召开之际,我们为他的发布传播打造一支可供互动的H5。

【洞察与策略】
医学是个比较冷门的领域,而通常听起来比较严肃,话题也比较敏感,而将角度放眼全世界医学又是改变人类的一大学科,那么我们找出了医学历史上10大改变人类的药物。

【创意阐述】
为了直观的去感受医学史上伟大的成就,我们在近百年最伟大的医学奇迹和成就里面找出10种发明,并用拼图这种发现发掘的方式来呈现,并加入了时间概念,让这些药物的发明时间与游戏的发现来呈现直观对比,让用户去了解这些医学奇迹并产生兴趣!

【结果与影响】
总PV约10W,并在一周内和当月上榜行业公众号所被推荐,也荣登数英的首页。

 
数英评分
9.7
我的评分
谢谢
数英评分
9.7
我的评分
    2020 数英奖 参赛信息
    参赛类别

    创意单元-互动组-互动广告类(银)

    技艺单元-美术类(银)

    技艺单元-互动制作类(金)

    终审评委(金、银、铜评级全部显示,无奖评级仅显示带评语者)
    创意单元-互动组-互动广告类
    • 郑大明
      深入浅出。眼前一亮。挺好。
    • 在医学这个相对比较冷门的领域情况下,能做到这样惊艳H5很不错,无论是从立意、美术、文案、互动性都非常出色,一来体现出来医学严谨性,二来又从对用户体验上做了较深思考。把一件很严肃的事情,通过H5互动变成有趣的科普性质,拉近人与医学的距离,让大家感受医学探索之路的艰难。
    • 美丽又有趣
    • 赵嘉伟
      概念和想法都很不错,但是量词使用的发现时间,感觉都是几千年人类医学也是在近代才有了发展,所以感知度不够,替换成死去多少人影响多少人损失多少金钱之类的会更有代入感。
    • 医学冷门知识和创意接合得非常好,画面、落地执行也很优秀
    • 新颖,有趣
    • 简单易懂的形式,让用户了解医学奇迹且记忆深刻
    • 蒋彪
      小而美,简单直接,互动环节把交互和结果无缝结合,大大提升可互动性
    • 邹晖
      把复杂的医学问题简单化,视觉化,游戏化,并通过3D互动的方式让人直观感受,棒。
    • Prince Zhang
      简单的互动机制,鼓励用户去探索疾病之谜,互动界面也做得非常唯美。
    • 徐微
      执行精美,交互简单,秒与年的对比强烈,能传达传播主张。简单,好玩是有了,但是震撼性不太够,而且社交属性比较一般,没有强烈的分享欲望。
    • 黄之曦
      把药物用这样生动有趣的方式展现,加强了用户对于品牌和药物的认知和记忆度
    • 单哲 Mark Shan
      设计,交互与最终落地的成品执行程度很高
    • 梁伟丰
      把冷冰冰的医学知识给弄活了。
    • 该体验来源于某游戏app,但与主题的结合到位,仍然有可圈可点之处
    • 孙乐
      在高门槛的技术实现基础上,呈现了由「生命医学」引发的深入思考,互动巧妙,体验流畅,关注「人与健康」这一年度热点,是「科技向善」的又一力作。
    • 曾卓
      简洁高级,互动新颖,一个窄众的话题,做成这样的效果不易。小问题是,因为精美导致loading费时,恐怕会损失流量。
    更多
    技艺单元-美术类
    • 美术形式创新,且交互简单,同时和品牌结合度高。
    • 深入浅出,让难懂的医学知识变成美轮美奂的视觉
    • 李雨 Levi
      国内移动端Html5营销发展到今天,三维引擎实时交互一定是最值得挖掘的表现形式之一,能够区别于视频的单向输出,真正做的实时交互,并能够给产品展示提供更大的可能。往往此类开发需要大量的时间和测试,这么好的表现一定花了非常多的功夫,考虑到加载时间,需要控制图像质量,否则相信可以有更好的表现
    • 苏杭(小呆)
      这是你很好少能够见到的,在3D交互与网页交互上这么有美感的H5营销案例。理疗领域在这个形式下,本身的作品产出就非常少,更何况能让我们看到如此有水准的一支作品了。
    • 科普,有教育意义
    • 猫叔
      让设计成为传播的驱动力,而不只是物料
    • 孙涛 SUN TAO
      美术的功能不光只是展示美学表现,有时候能把复杂的抽象知识通过美术的呈现普及给到大众,更是一件有意义的事情。
    • 美翻了
    • 将不好理解的事物用美的方式传达。
    • 进入微观世界,体验医学的美
    • 抽象的医学知识,用美学的方式去展现出来,更直观,运用互动游戏的方式更好的体会到医学带给我们的奇迹。
    • 兼顾互动性和视觉美感的设计作品
    • Kelly Pon
      This made viruses look quite sexy. The game though, is borrowed from an existing game app Polysphere, nevertheless good idea to educate via a game
    • 孙乐
      美术准确 提升了视觉传达效率
    更多
    技艺单元-互动制作类
    • Art&Tech的完美结合,interactive流畅!
    • 近几年少有的精良制作
    • 教科书式的互动案例!
    • 执行有新意
    • 猫叔
      互动直接有效的增强了用户对枯燥知识的阅读、分享、记忆度
    • 张源 Robin Zhang
      这个H5一点也不“顺滑”,明明照着提示转,却转了好久才能得到答案,但这几十秒相比于医学探索的时间与艰难却不值一提。让你身临其境地感受艰难,再告诉你事实是你体验的数以亿倍的艰难,很难不让人印象深刻且心生崇敬。
    • 技术与艺术的高超结合。
    • 陶为民  Ken Tao
      玩,也是一种很好的治愈!
    • 单哲 Mark Shan
      设计,交互与最终落地的成品执行程度很高
    • 陈琦
      如果病毒的样子可以美一些,人类对病毒的认知会不会多一分,恐惧会不会减少一分。
    更多
    专业评委

      专业评分

      专业评分已截止

      评论

      文明发言,无意义评论将很快被删除,异常行为可能被禁言
      DIGITALING
      登录后参与评论

      评论

      文明发言,无意义评论将很快被删除,异常行为可能被禁言
      800

      推荐评论

      全部评论(19条)