建站学习网,专业提供各类建站教程,网页素材,SEO资讯等建站资源!

网站模板_网站源码_网站素材_建站教程_建站学习网

当前位置:建站学习网 > 网页设计 > HTML5教程 >

如何做一个有温度的H5?

更新时间:2017-04-14整理编辑:建站学习网阅读:0

   移动互联网的时代,H5已经不仅仅只是一个展示工具。

  H5+游戏=互动

  H5+图片=移动海报

  H5+动画+音乐=微电影

  从早期的单屏滚动,到后期的立体交互,H5+时代已经来了,几乎所有的创意表现,都可以通过H5来展现。随着H5模版开发的快速更迭,人人都可以制作优质的H5,如何才能脱颖而出,一鸣惊人?

  2014年的某一天,一款名为《测测你的帐号价值》的H5风靡了整个朋友圈。在那段时间里,原本低调的好友纷纷开始炫富:“我的QQ居然价值18栋海边别墅““我的QQ价值3800个王思聪同款电脑桌“……

  2015年的春节,在红包漫天飞的朋友圈里,又杀出一款《任性派发年终奖》的H5,好友们在大晒自己上百万的“年终奖“同时,还很豪气的给老板也发一份,博个新年好彩头。

  这两款浏览量和参与量均破千万的H5都由电脑管家出品,旨在表现蕴藏了关系和情怀的QQ帐号价值的重要性,从而提升帐号宝这款产品的品牌效应。娱乐性的H5,总是昙花一现,热闹过了就消失不见,至多作为“经典案例“给后来人参考。

  很少有H5会像《帐号价值》一样,前后跨度近半年,参与人数达到1400万,总PV数更是达到4000万之多,即便是半年后的今天,每天的参与人数依然数以万计。不用奖品诱导分享,仅仅只是虚拟货币带来的虚拟价值,就足以活跃整个朋友圈。

  一、参与

  微信是一个与众不同的关系平台,它和QQ一样,把朋友、同事、亲人、爱人,构成了关系稳定的朋友圈,有可以同步展现所有与我相关的动态,因此,在这里所分享的东西,大多也是与我有关的,或者有我参与其中,又或者让我觉得有趣。

  于是,H5的互动性就成了用户参与的重要因素。场景化的H5能让人们有代入感。例如在《帐号价值》的H5中,就能让人们很好的置身其中,为自己找到一种角色定位。H5的技术不断在发展,如今的HTML5能轻松实现绘图、擦除、摇一摇、重力感应、擦除、3D视图等互动效果。

  但并不是只要有交互效果就能引发参与。擦一擦或许能诱发受众动手,但并不能进一步引发用户的兴趣。交互只是一种表现形式,真正吸引人的是与人们相关的场景化体验。

  二、情怀

  随着互联网的发展,每个人都有了自己的判断力,怎样的内容谓之好,怎样的内容值得分享,每个人的心里都有自己的评判标准,而情怀正是这标准之一。讲个好故事,容易引发受众的情感共鸣。这个故事,就是H5的灵魂,如何讲好一个故事?这就要求我们赋予H5情怀。

  情怀这个互联网热词已经被提及太多次了。但是,依然不能丢弃。在一个H5中如果只有品牌输出或者只有交互,那么这个H5定然是缺乏灵魂的。一个好的H5能在情感上引发共鸣,揣摩之后,人们能够延伸到生活中。

  《任性派发年终奖》H5很恰当的在年终奖大热的时期,率先引发一种自我意识觉醒的潮流。受众可以主动给别人派发年终奖,这让人们不由得进行自我价值的肯定,且又不失趣味性。所以说让受众感觉有情怀的最好办法,是站在受众的角度去思考。

  三、背景

  互联网时代,受追捧和被冷落有时候是无厘头的,比如《我的滑板鞋》、比如“张全蛋“、再比如“duang“。但没有任何一个受追捧的内容是无背景的,质朴平实造就了滑板鞋,成就了张全蛋,而成龙本人就duang的一下成了背景。

  H5也是一样。2014年,一款《家和万事兴》的H5在朋友圈掀起了一波行动的浪潮,也开启了指纹互动的先河,亲情,就是它的背景。

  大众点评出品的《你我之间只有一个字》,紧张高压的社会环境和人与人之间的距离,就是它的背景。同样,腾讯电脑管家《帐号价值》的H5,也同样有它的背景——大数据。基于QQ的大数据,基于安全的大数据,在产品经理的打磨下,成就了一款生动的H5。这一切,并非偶然。

  四、温度

  温度这个词似乎有些虚化,但它却可以刚好反映出一个H5制作者的态度。温度可能炽烈,也可能清冷,但不可能一成不变。一个成功的H5,必定是会随着时间,随着热点,甚至随着情绪变化不停在变。

  没有一个H5是能永存,每个产品、每个H5都有它的生命周期,但是我们可以尽可能的延长一个H5的寿命。《帐号价值》和《任性派发年终奖》不是跟风的H5,也不是在H5风靡之时大众化的H5。这样的H5能更好的传递品牌价值,引发品牌联想。一个有温度的H5才能历久弥新。

  互动性让人们有参与欲望,情怀让人们有感同身受,最终因为温度,让人们乐于分享给身边的朋友。由名表豪车,到星际旅行,再到大家都关注的年终奖,《帐号价值》H5所幻化而成的价值不停在变,随着热点在变,随着时间在变,让参与其中的人每次分享都会获得不同的关注。互联网+时代下的H5,在收获浏览量和口碑的同时还能收获温度,这可能是下一个进击的方向吧。

本文网址:https://www.dedexuexi.com/wysj/html5/2946.html

本站部分文章搜集与网络,如有侵权请联系本站,转载请说明出处。

标签:前端
收藏此文 赞一下!() 打赏本站

如本文对您有帮助,就请建站学习网抽根烟吧!

支付宝打赏
微信打赏
深入解析HTML5中的IndexedDB索引数据库
« 上一篇2017年04月14日
H5移动端页面设计心得分享
2017年04月14日下一篇 »
  • CSS代码鼠标经过图片变换图片的几种方法
    0阅读
    CSS代码鼠标经过图片变换图片方法如下:方法一:在css中,可以利用“:hover”选择器和“background-image”属性实现鼠标滑过改变图片效果,只需要给图片元素添加“图片元素:hover{background-image:url(新的图片路径);”样式即可。
  • 如何利用html+css设置菜单栏缓慢下拉效果?
    0阅读
    如何利用html+css设置菜单栏缓慢下拉效果?解决方法和相关代码分享如下:方法一:过渡(transition)对forum_box开启绝对定位(absolute),让里面的li从其父元素中脱离出去,不然会把之后的内容往右挤,并且设置overflow:hidden,设置高度为0,鼠标移入后再设置相应...
  • 纯css3实现下拉箭头、关闭按钮旋转效果
    0阅读
    说起css3的旋转效果,那就要说为什么不用js去实现,CSS3的动画效果,能够减少对JavaScript和Flash文件的HTTP请求这是原因之一。但是css3可能要求浏览器执行很多的工作来完成这个动画效果的渲染,这有可能导致浏览器响应缓慢,因此,在使用一些复杂的特效时,大家需要考虑清楚。不过这样的...
  • 使用HTML5的Canvas绘制曲线的简单方法
    0阅读
    Canvas2D自带的曲线方法 最近在研究3D柔体的计算,所以在狂补一些知识。经常会涉及到一些数值分析方面的东西,主要是曲线的各种插值算法。突然想起了Canvas2D本身也是可以绘制曲线的,使用
  • html两个文字之间有一个空格的解决办法
    0阅读
    碰到过这样一位朋友,在编写的html代码里面出现两个文字间有空格的情况,两个文字之间他没有加空格符,也没有代码。 这个情况在html编码使用不太多或不太熟练的情况下,很难找出问题。
 
QQ在线咨询
×
欢迎您登陆建站学习网
QQ一键登陆 建站学习网账号登录