广东广播电视台触电新闻:村支书们的手账本
案例演示,请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要1分30秒
案例:村支书们的手账本
品牌:广东广播电视台触电新闻
技术实现: vue,css3,ergret
制作:触电融媒创意中心
亮点:
1、全貌概括:
场景由手账本的形式进行呈现,内容依托建设小康社会的具体案例展开描述,以简单的交互动作推动故事进展,渐进式串联展示出整条故事线,不断呈现建设小康社会以来的研究与探索等内容。
通过不断完成每一页的寻找线索和交互动作,用户完成该事件的图标解锁,收获图标时的成就感会鼓励用户继续寻找。最终用户将收获1张自定义名称的标语式海报,并附有已解锁的图标列表,完成整个体验。
2、具体展现形式:
①以一本手账本为故事线索,用户进入H5后,填写手账本昵称(需经敏感词审核过滤)开启完整场景。
②场景中,手账本呈现翻开的状态,每一页将由故事背景的不同匹配相应的手绘图标元素,主要为小康建设工作中具有代表性的农产品、物件、道具等。用户点击图标后,将根据提示进行选择、交互动作,将提炼的多位典型人物故事真实案例嵌入其中完成展示。手账本随着用户完成当页其中一个交互,提示进行点击继续翻页。
③画面右方设计状态栏,收集用户通过交互而解锁的图标数量,待解锁的内容框还可以提示用户的交互完成进度。
3、分享展示形式:
①场景展现到最后,用户完成所有画面的浏览和简易交互,将匹配该用户填写的用户昵称,生成与用户有关的海报引发分享。
②海报页面列出用户“已解锁XX%种奔康技能(对应已解锁的图标数量)”文案。
③根据完成的程度不同,匹配不同等级4种标语。
④转发链接将个性化标题,呈现用户昵称和完成状态。
⑤结果页“更多奔康故事”按钮,展现原创微纪录片聚合专题。
标签
关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~
微信扫一扫
关注该公众号