本文系网易沸点工作室《网易H5》栏目（公众号：wangyih5）出品，每天更新。（网易H5原创）
H5最出彩的就是它的互动设计，做互动时需要注意用户体验。
交流互动用得好，可以让用户产生充分的代入感和参与感；用得不好，则是满满的违和感，让用户失去玩下去的兴趣。
H5有哪些互动手段？怎样能够留住用户？如何让用户有完美体验？
复杂酷炫的H5信息加载量大，一些手机不支持H5的交互设计，手机会出现卡顿现象。
试想你在打游戏，对面BOSS残血要倒，酝酿了大招想要释放。可是这个大招的准备程序极其复杂，操作途中突然觉得无趣，甚至直接把游戏关了。
游戏没有打完不要紧，可是H5不能不看完就关 。
很多H5在开始情节只是在做铺垫，真正核心的部分其实放在最后。
用户如果在中间就关闭H5，极大可能还不知道H5真正想表达的核心思想。一个H5不能流畅的播完，肯定会流失大量用户。
交互复杂的H5完播率不一定很高，所以用户的转发率也会不高。
《测测你是欢乐颂中的谁》只有一个页面，根本不需要翻页，只要下滑就能把测试做完。
而且这只是个简单的测试H5，用户不用脑子想都能知道这个H5只需点击就能完成。
《测测你是欢乐颂中的谁》
《重返那五年》制作精美，耗费时间长，可是点击量没有《欢乐颂》多。因为这个H5信息量太大，图片元素多，加载时间长，用户有可能无法顺利的把故事看完。
《重返那五年》
所以H5的互动并不是越复杂越好，要根据内容和玩法来定。
《2019新年flag》的开始页面需要用户按照提示，沿着虚线滑动。但是按照用户的惯性思维，H5是需要点击或者向下滑动的。
页面既显示了画圈滑动，又会让用户产生向下滑动的想法。交互手段不明确，用户很难找到开始游戏的方式。
创作团队在修改了页面设计后，让滑动方式变得更加明显，这才用户顺利的解锁了H5。
《2019新年flag》
H5的互动做的简明易懂，用户就会买账，我们的策划就不会打水漂。
用户每天都在使用手机，手指是接触手机频率最高的部位。H5的简单互动最有可能留住用户，所以我们可以利用触觉，结合手势激发H5的亮点。
1.视频类（无操作）
视频H5一般一上来就播放一段视频，很少存在交互操作。内容如果无趣则很容易让用户产生脱节感，所以视频对H5故事情节和表现方式有很高的要求。
时间地点碎片化是设计视频需要注意的因素，用户的碎片化时间不支持视频播放过长。
5分钟的“梨视频”、30-60秒的“抖音”是短视频的代名词。无操作的视频类H5一定要注意严格把控时长。
《一个只属于独生子女的故事》是网易在2017年出品的视频H5，这个作品仅用一个视频就触动了无数80后子女的心。
用户没有操作不代表没有互动，剧情的设计也是一种互动。
《一个只属于独生子女的故事》
2.点击
点击是最常见的手势，单纯的点击不会产生什么化学效果，结合H5画面设计个性化元素可以产生更好的效果。
《穿越百年我心不变》里故事的开始按钮是一张车票，用户点击取票才能进入故事主线。H5用车票代替按钮，为用户建立穿越的场景，代入感很强。
《穿越百年我心不变》
3.长按
这个操作用户比较熟悉，常用在一镜到底形式的H5中。一镜到底往往考验故事的衔接和镜头的转换，运用得当可以带给用户很好的体验。
《二零一八年娱乐圈画传》让用户利用长按动作，以画中画形式畅快的观看所有内容，回顾一年娱乐圈发生的种种大事。
《我不是药神》电影大获好评、选秀节目流量扎堆、清宫宇宙在线博弈，18年大事盘点统计，用户看了连连点头。
《二零一八年娱乐圈画传》
4.滑动
滑动从一处迅速移动到另一处，中间不需要缓冲停顿，整体是一个流畅的过程。这种操作十分常见，一般用于页面切换。
网易哒哒的《自白》利用这种方式，向下滑动推进故事剧情，把主人公的变化呈现给用户。
H5借用滑动手势控制故事的播放，让用户更有参与感。
《自白》
5.拖动
拖动区别于滑动，按着屏幕不松手，从一个点拖到另一个点，移动速度由用户控制。
拖动类的H5适合图片展示类或者叙事类的策划专题，播放快慢可以自行调节，不影响观看体验。
《态度日历》使用一张长图，拖动图片的时候还会有一些小元素穿插过场，使得整个H5看起来既炫酷又丰富。
《态度日历》
H5的设计理念要求作品与用户有一个好的沟通。交互形式是H5的长处，好好利用定会吸引更多用户。
成也交互，败也交互，始终都离不开交互。
那么不如用心把它做好，拿出H5的优势，打造一个爆款吧。
想要获得案例链接，请关注网易H5（ID：wangyih5）公众号，查看公号文章链接。
创意方法、选题策略、交互设计、文案秘籍……搜索关注网易H5微信公众号，（ID：wangyih5），分享你想要的知识。
本文来源：网易H5
责任编辑：
张鹤_NBJS5113
