主流媒体H5产品及其设计趋势*

□文│李 戈 钟 樾

自2014年起，基于HTML5（超级文本标记语言第5次重大修改）的数字内容产品，逐渐在移动终端得到广泛传播与应用。《人民日报》、新华社等主流媒体面对媒体转型的破局与浪潮，敏锐地抓住了中国网民的变化需求，创作了大量极具内容创意和技术创新的H5（基于HTML5的创作平台）数字内容产品。这些产品一次次刷新浏览量的纪录，在彰显我国主流媒体传播实力的同时，也引领了新闻媒体H5产品的发展趋势与设计理念。

一、移动端H5数字内容产品及其特点

2014年，南京的一个创业团队设计了《围住神经猫》移动小游戏，创造了3天500万用户和1亿访问量的社交产品神话，从此H5产品进入了人们的视线。H5产品的传播效应主要由两个指标来体现：访问量（PV，Page View）即页面浏览量或点击量，独立访客（UV，Unique Visitor）即同一客户端访客量。基于PV与UV的数据表现，堪称现象级的H5产品不断涌现，商界、学界、政界、媒体界都对H5数字内容产品关注有加。

H5之所以能引发如此广泛的效应，被称为互联网视觉革命的先行军，在于它为下一代互联网创造了新的框架和平台。H5强大的兼容性不仅可以满足音视频、图像动画的本地存储、承载各种酷炫的互动功能，还可以应用在各种不同的开放平台上，打破了平台间各自为政的局面，显著地降低开发与运营的成本，使移动互联网也能够轻松实现类似桌面应用带来的用户体验。目前网民日常使用的社交应用首推微信，超过85%的网民社交活动是通过微信朋友圈（见图1）。H5产品可以通过微信平台一键转发，满足了广大用户参与和分享信息的需求与习惯，是移动互联网时代具有颠覆意义的创新性媒体产品。

图1 CNNIC典型社交应用使用率

二、主流媒体H5产品的数据表现

2017年8月中国互联网络信息中心（CNNIC）发布的第40次《中国互联网络发展状况统计报告》显示：截至2017年6月中国网民规模达到7.51亿，互联网普及率为54.3%。其中手机网民规模达7.24亿，占网民总数的96.3%，手机上网比例持续提升，移动互联网主导地位强化。[1]可见阅听行为集结在移动终端已然成为人们的一种生活方式。11月17日，腾讯新闻和企鹅智酷发布《未来地图:中国新媒体趋势报告（2017）》提出：移动互联网带来用户阅读习惯改变，人们在碎片化的时间里，通过移动终端，获取更为个性化、碎片化的文字与视频，接近60%的用户偏好幽默的、调侃的内容，而不是传统的冷静、严肃的风格。即使是对于新闻资讯信息，轻量化和互动性的诉求也非常高。这意味着，人们对主流媒体产品的内容和形式都提出了新的要求。

2017年，我国70%以上省级媒体发布了H5可视化新闻，传播覆盖面佳绩连连。主流媒体基于自身的内容和渠道优势，通过H5产品满足用户个性化和多样化的新闻阅读需求，使用户参与性大大提高，获得了强烈的沉浸体验和情感共鸣，从而实现了裂变式传播效果。

1.《人民日报》的现象级H5产品

《快看呐！这是我的军装照》是《人民日报》为庆祝建军90周年推出的交互型H5产品。产品创意选定了中国人民解放军11个阶段的22张照片，用户可以通过这个新媒体产品生成、展示自己的虚拟“军装照”。该产品7月29日推出，7月30日浏览量破6000万，7月31日上午10时浏览量破1亿，7月31日17时浏览次数破2亿。随着访问量迅速上升，出现两次服务器宕机，截至7月31日18时，军装照图片合成峰值达到每分钟117万次，并在8月1日13时浏览次数冲破5亿万，并继续上冲破10亿浏览次数（PV），独立访客（UV）达1.55亿，真正在亿万网友的手机上成功“刷屏”。10亿PV使其成为一款“现象级新媒体产品”，《人民日报》已提交吉尼斯世界纪录申请。

“军装照”H5中运用针对性算法，将用户上传的照片与特定形象进行脸部特点融合，并对生成的虚拟照片在肤色、光照等方面进行“优化”，最后成型照片帅气英俊。人们分享自己的军装照，传递对中国人民解放军的向往、崇敬之情。《人民日报》借助社交网络平台，把爱国主义题材植入融媒体产品，激发了大众集体意识和情感共鸣，成功实现了内容产品的创新式传播。

2.其他媒体H5产品

随着用户对H5产品认知度的提高，主流媒体制作了形式多样的H5产品，多个H5作品成为爆款，被用户广为传播和分享，这也让基于H5的报道形式受到媒体热捧。

2017年10月13日新华社创作的系列报道H5产品《点赞十九大·中国强起来》正式上线，首日即吸引1700余万网友点赞，截至10月23日，收获1.2亿点赞量，2亿人次扫码，网友参与人次（UV)超5亿，该系列H5产品总浏览量(PV)达30亿级,创造了媒体互动报道的新纪录。

10月18日，中国江西网制作的《十九大报告学习词典》H5产品推出，迅速被全国网友刷屏。H5将大会核心要点进行全面梳理和简要总结，每个方面用一个最准确的词语来概括，配上鲜艳的背景和振奋的音乐，获得用户一致好评。上线一周，该作品阅读数突破1000万人次，创造了江西新媒体作品宣传史上的新纪录。

除此之外，《解放军报》、国务院APP推出的H5产品，也在信息过剩的今天令陷入视听倦怠的网民眼前一亮。这些H5产品的数据表现如表1所示：

表1 主流媒体H5产品数据表现

可以发现主流媒体H5产品的PV、UV值基本都在百万量级，更有千万、亿万量级产品。这都远超传统媒体的发行量、收视率，同时也让PC端应用的浏览量相形见绌。

三、主流媒体H5产品的特点

随着移动互联网技术的渗透，传统主流媒体的发行量、收视率等已悄然发生着一场翻天覆地的变革。2017年全国“两会”期间，刷屏最“凶猛”的闪卡H5产品《燃爆！史上最牛团队这样创业》《两会喊你加入群聊》等爆品由《人民日报》的“中央厨房”创作发布，其客户端的评论量每天增长数在两万以上，成为融媒体、新媒体创新演兵场。面对越来越年轻的用户群体，主流媒体不断探索、积极创新，创作了大量新颖有趣、冲击力强的H5产品，受到广大网友的欢迎和认同，收获令人瞩目的点击量，获得骄人的传播效果。

1.协同过滤，提高用户黏合性

主流媒体利用自身平台和品牌优势，通过解读信息传播碎片化时代的用户诉求，采取协同过滤的方式为用户提供个性化服务，从而提升了用户的使用满足感，增强了用户黏性。协同过滤把技术的智能推荐和用户的社交关系结合起来，具有更好的针对性与可靠性。2017年10月“津云”中央厨房推出特别策划H5作品《我为中国加油》，用户可将带有各自特征信息的漫画人物海报分享到社交平台获得社交评价，全国34个省级行政区及7个海外华文媒体所在国家，均有网友参与了《我为中国加油》H5互动传播。主流媒体通过激发和培养每个网民创造、传播或转发的能力，不断培育和建立与用户的联系。随着H5的成熟发展以及对用户数据智能分析与反馈技术的更迭，主流媒体在新闻生产中将会创作越来越多契合用户个性化的H5精品，满足用户需求。

2.架构再造，加强用户参与感

H5产品是对传统媒体表达架构的一次颠覆——打破了原来独立的文字、图片、视频的传播方式，将不同媒体内容通过交互的方式整合到一起，实现新闻内容的可视化、交互化、趣味化和易分享。与此同时，主流媒体秉持了用户为上的传播观念,在创作H5产品时把用户作为整个产品中重要的一个环节，用户既是传播对象，也参与内容生产和传播。成为爆品的H5产品，都在事先为用户预设了一定的参与空间，让用户去发挥。用户通过获取信息、参与创作、自发传播的过程，把自身情感融入作品中，在分享转发的同时获得极大身心满足。浏览“军装照”，用户拍照生成不同年代的照片并分享在朋友圈，营造了一种超越拟态环境的虚拟真实。在这个虚拟空间里，人们“沉浸”其中，由此获得强烈的感官体验和情感共鸣，强化了用户参与的传播模式。

3.舆论引导，给用户独特的报道和洞察

随着以互联网为中心的传播格局的形成，具有强即时性和高互动性的H5产品，使信息传播再创新高度。《人民日报》在全国“两会”期间推出的首部闪卡H5《史上最牛团队这样创业》，把中国共产党的这个最伟大的“创业团队”的历史以快闪形式酷炫地呈现出来，这种“燃爆”的形式和节奏拉近了党媒与年轻网友的距离，短短几天产品曝光量超过3000万。H5产品传播集纳了碎片化、短视频、专业视角以及高频呈现，这种方式能缓解审美疲劳，带来强烈视觉冲击，从而把网友对新闻的理解和思考带到一种新的高度。主流媒体通过优秀专业人才对信息内容进行解读和阐释，并与卓越设计师和技术人员创新协同，通过H5产品的研发与推广，在加固互联网话语体系、引导网络舆情、传播社会主义核心价值观方面，取得了显著的成绩。

四、主流媒体H5产品的设计趋势

随着用户更多地参与到媒体信息的创作与传播中，媒体格局、目标受众、媒体技术都在发生变化。H5产品打破了传统新闻报道形式缺乏活力的桎梏，让新闻变得有趣、有参与感，深受广大用户的欢迎。然而数据显示当H5加载时间超过5秒，就会有74%的用户选择关闭页面。前两页用户的流失率最高，84.22%的用户在第一个页面就会选择去留，H5产品的内容和设计是产品生命力的根本。[2]在设计H5产品时要加强分析与把握H5产品发展趋势，以及设计赋能，才能使H5作为内容创新的新引擎给媒体带来质的改变。

1.选题契合社会事件、强化产品交互性

通常一个H5上线后的前三天是访问高峰期，一般存活周期为一周、用户访问时间大约为1分30秒，所以结合社会热点事件的H5产品，能吸引更多用户的注意力、激发用户参与的热情。社交网络环境下，用户的社交或者说互动、分享需求会更加强烈。强化H5产品的交互性既是用户的客观需求，也是提升新闻广泛传播的有效方式。2017年《人民日报》推出的H5《两会喊你加入群聊》，模仿微信朋友圈聊天形式，24小时不到点击量超过600万，仅在《人民日报》客户端上的留言就超过了9万条。这个H5的创新之处就是让用户参与两会代表群聊，新颖的交互功能让网友乐于分享。随着越来越多用户参与到H5的传播中，能够结合热点话题、根据用户群的特点与喜好来定制H5内容与功能，以此进行内容宣传是获得较好传播效果的制胜策略。

2.多场景多终端适配、移动端优先

H5的本质是移动Web+，利用任何浏览器都可以打开H5，在PC端观看也很流畅，但人们出于便捷性会更多地使用移动终端浏览H5内容。《Up2017腾讯互娱年度发布会》H5有一个大的亮点，就是对移动端与PC端都做了完美适配。在移动端打开是竖屏的翻页H5，粒子效果通过翻页来进行切换。而在PC端打开这个H5切换为横屏，更像是一个网站，细致的用户体验设计令人舒适。同时PC端和移动端的转换也可以通过诱导海报实现，扫描海报即可进入H5，线下创意海报与H5相结合，打通了线上线下的隔阂。H5软件中的“设备”功能可以在舞台下添加一个PC设备和移动设备，用户扫描海报时软件可以自动识别用户持有的设备类型，为用户创造适配的场景化体验需求，这大大提高了用户打开和分享H5的欲望。

3.融合先进技术、跨平台合作

新华网利用全息技术创作的《身临其境看报告》H5产品，一经推出就吸引了大众眼球。该H5采用虚拟全息技术呈现两会会场，营造的虚拟空间让用户有身临其境之感，当日点击量达1.1亿次。重力感应、体感交互、人脸识别、机器学习、AR、VR等高科技正逐步渗透新媒体产品，让主流媒体有更大的空间去策划和设计H5产品。主流媒体只要抓住核心，发挥优势，整合、调动最新的媒体技术和最强的运营资源，充分利用各平台雄厚的技术实力和强大的资源运营能力，必定能够保障H5海量用户的需求。未来大数据、神经网络、自然语言理解、自动学习等人工智能技术都将参与到媒体的生产和研发中，“不求所有，但求所用”将是新媒体时代新闻生产的常见模式。[3]

4.完美感官体验、微视频嵌入更流行

H5产品打破了传统的单一媒体形态和线性传播模式，将平面媒体、电子媒体、网络媒体整合在一个空间载体内，将各媒体的原有内容进行解构和重组，带来多维度的感官体验。为保证用户流畅的体验感，弥补H5技术上的不足，微视频嵌入将被广泛应用在产品设计中。以往的H5制作要有炫酷的“特效”，需要对设计和交互做大量的开发，成本大耗时长，设计的元素和环节越多，产品打开的流畅性就会越低。微视频将文字、画面、色彩、声效、模拟交互等提前设计封装，虽然用户点击互动的频次会降低，但是交互的效果没有减弱。[4]随着基于VR、AR的沉浸式微视频的发展，内容的交互将越来越多地结合用户的形体交互及传感器感知，并能充分保障用户社交需求，这都是未来H5创作的新挑战。

五、结语

主流媒体H5精品的涌现重塑了人们对传统主流媒体的认知，也让主流媒体用户数和活跃率再创新高。经过各大媒体的大量应用实践，H5已成为移动互联时代媒体内容创新的理想技术引擎。对H5产品设计趋势的分析有助于主流媒体在转型浪潮中掌握主动权，生产出更多具有“裂变”传播效应的新闻产品。

注释：

[1]中国互联网络信息中心.中国互联网络发展状况统计报告[EB/OL].2017-08-04.http://www.cnnic.net.cn/

[2]腾讯.移动页面用户行为报告.2016（2）

[3]余荣华.“军装照”H5为何能刷屏朋友圈[J].新闻与写作，2017（9）

[4]王培志.H5场景化视频化创新引领传播新风向[J].新闻战线，2017（10）