新东方：一堂远行的课
案例演示，请长按/扫描以下二维码 ->
识别图中二维码
完整欣赏此案例大约需要2分30秒
案例：一堂远行的课
品牌：新东方
技术实现： jQuery + swiper + video + touchjs + html2canvas
亮点：
- 创意定位
新东方教育公益活动总结作品，介绍了2002年至2020年新东方的几项公益项目及取得的成果，最后邀请用户一起助力，为教育事业加油，提高项目影响力，打造品牌形象。
- 策划逻辑
滑动屏幕让一位教师形象的男士在一条路上行走，每到达一个地点，屏幕上都会逐行浮现总结语，然后光标闪烁引导用户点击查看公益活动介绍海报，在海报界面可返回继续让男人前行和查看下一海报，地点与海报的对应如下：点击希望小学的红旗查看新东方希望小学助力乡村教育基础建设；点击教学楼的窗户查看让教师不再孤单的烛光行动；点击教学楼的门查看用科技推动教育均衡发展的双师课堂；点击邮筒查看新东方乡村儿童一对一助学计划。最后用户输入名字，为活动助力。
- 设计上
一位外形淳朴的手绘男士形象，在月光下徜徉到不同地方，引出具体项目介绍，海报页面包括了项目精神，具体措施和取得的成绩，让用户对公益项目了解得很充分，画风温馨，让用户愿意为其助力加油。
- 音效上
背景音乐很温馨，烘托教育事业带给孩子教育和心灵上的温暖感受。
以上为“H5案例分享”团队原创文章，转载请注明出处！
标签
关注微信号：h5-share，获取更多创意H5案例分享！也可访问H5案例分享网站www.h5anli.com，搜索查阅~
微信扫一扫
关注该公众号
京公网安备 11010802030403号
