下载安卓APP箭头
箭头给我发消息

客服QQ:3315713922

html5教程:国外大品牌的HTML5案例学习

作者:html5教程     来源: www.kokojia.com点击数:1130发布时间: 2015-09-18 10:39:15

标签: html5教程html5游戏开发html5开发

Web开发

本期的HTML5案例学习内容:我们在html5网站中挑选出几个国外大品牌的HTML5案例进行分析学习。相信大家在学习html5之前对HTML5游戏并不陌生,当Html5在国内呈现出不断发展升温的趋势,我们不妨静下心来看看国外一些不错的HTML5案例进行对比学习,本期的html5教程中我们为大家精心挑选了5个国际大品牌的html5案例推荐,感兴趣的朋友可以接着往下看看!
1、. 阿迪达斯:FW15 X & Ace Introduction
广告主:阿迪达斯
推广产品:ACE & X 系列足球鞋
代理商:DDB & Tribal / Amsterdam Superhero Cheesecake
体育品牌的互动广告就应该酷炫,这是没有疑问的。阿迪达斯为本季新上架的两双顶级足球鞋制作的移动网站即是如此。在信息量较大的前提下,文案、视觉设计以及动效果的完美配合并没有给人累赘或者炫技的感觉,而是很好的传递出了产品与足球运动本身的澎湃激情。
国外大品牌的HTML5案例学习
一样是无限下拉流,如果所国内部分作品简直是PPT,那阿迪达斯的这作起码也是Keynote。
2、宝洁Old Spice:Muscle Surprise
广告主:宝洁
推广产品:Old Spice 沐浴露及香氛系列
代理商:Wieden + Kennedy / MediaMonks
你的BOSS和客户会为了一个流程超过30分钟的移动网站买单吗?“短平快爆”似乎成了互联网营销法则的铁律,稍微给消费者可怜的大脑增加一点点负担都是大逆不道。宝洁旗下“最男人”的香氛与沐浴露品牌Old Spice反其道而行之,在老熟人Terry Crews身上埋了数十个(反正我没数清)机关,全部找到并看完动画绝对不止15分钟,反而谋杀了无数不通关会死的强迫症用户的手机电量。
那么问题来了:全球创意本土化是我国互动广告公司的看家本领,有时候是甚至是大救星。W+K为Old Spice做的广告一向飞得要死,咱们有什么品牌可以效仿吗?
国外大品牌的HTML5案例学习
3、宝马MINI:The MINI Story
广告主:MINI
推广产品:MINI系列汽车 品牌推广
代理商:AKQA
对于MINI这类品牌来说卖情怀简直比卖产品还要重要。下面这一部作品可不仅仅只让你看个MINI的内饰而已,对于品牌的全部车型和历史,你都可以在这个网站中通过手机可能操作的交互方式了解。值得一提的是,相对有限的屏幕空间和较多的内容层级,这部作品提供了恰到好处的指引,避免用户在探索中因为迷路而失去兴趣。
汽车品牌通过手机内置运动感测器来模拟驾驶仓视角这件事老早不稀奇了,同类作品比的就是完成度。这部“The MINI Story”可称为高完成度的标准。
国外大品牌的HTML5案例学习
4、全日空:ANA Pl.Net
广告主:全日空
推广产品:全日空 品牌推广
代理商:BIRDMAN / Neandertal / TOHOKUSHINSHA FILM CORPORATION
同样是一款解密主题的活动,这次是ANA与星球大战来跨界合作,足足37关啊亲,37关。玩家需要根据屏幕下方的提示在ANA已开通的航线目的地上找到通关的钥匙,等闲的蛋疼的玩家最终解锁了星球大战的主题壁纸,相信已经潜移默化得记住了不少航线。完成挑战不仅需要充足的手机电量,对于地理知识也有小小的要求,不知道这个ANA为这个Campaign设定了多少KPI?
国外大品牌的HTML5案例学习
5、 标致:Peugeot Catch the Dragon
广告主:标致
推广产品:标致208 两厢汽车
代理商:DPDK
又一则利用手机运动传感器的案例,不过这次可不是在让你坐在4S店里的车上当安静的美男子,而是在山路急速狂飙的同时追逐一条龙!标致208平价外表下暗藏着一部有小钢炮(Hot Hatch)的心这件事,完完全全通过该作品的速度感给表现了出来,令人热血沸腾。
谁说A0级车的卖点只有实惠和省油?
国外大品牌的HTML5案例学习
总结:以上即是本期为大家精心分享的5个国际大品牌的html5案例推荐学习,html5这对身处于移动互联网大时代,随着各种H5游戏和专题页纷纷崭露头角,对于设计师和开发者,是一个都将是一次契机,如果善用html5 开发工具可能会制作出相当有创意的作品,而已对于各大企业、品牌来说,也是一次机会难得的营销方式,尝试利用HTML5进行新的营销推广。更多的html5教程和相关的视频教程可登陆课课家官网查询相关课程。

赞(17)
踩(1)
分享到:
华为认证网络工程师 HCIE直播课视频教程