阿里巴巴公益基金会:《旅行青蛙》公益之旅

2018-06-10 H5案例分享 H5案例分享
阿里巴巴公益基金会:《旅行青蛙》公益之旅


案例演示,请长按/扫描以下二维码 ->

识别图中二维码

《旅行青蛙》公益之旅-查阅二维码

完整欣赏此案例大约需要2分钟


案例:《旅行青蛙》公益之旅

出品:阿里巴巴公益基金会

亮点:

  1. 策划上,以《旅行青蛙》为主题的公益H5。首先是旅行青蛙庭院的信箱,点击信封,弹出一封信,是写给蛙蛙,讲述一起去寻找珍稀动物,点击“这就出发”,进入旅行青蛙的小屋,主视觉是摆满菜肴的桌子,点击背包,选择物品,而后点击“出发吧”。再次进入庭院,有三个方向,点击上面的箭头,有3种场景随机出现,对应12种珍稀动物;点击左侧箭头固定1种场景,对应12种珍稀动物;点击右下角箭头,有4种场景随机出现,对应24种珍稀动物。无论选择哪个方向,根据3次引导,点击找到珍稀动物,点击小动物,有小动物的分布地域和保护级别。点击“拍个照吧”生成对应动物的海报照片,可以保存分享,也可以选择“去找其他小伙伴”,返回庭院界面,重新选择方向,查找其他珍稀动物。
  2. 设计上,手绘风格的界面,主色调绿色,和《旅行青蛙》游戏的界面一样。
  3. 体验上,引导很明确,很容易根据提示,查看各个珍稀动物。生成的“美丽中国,我是行动者”的海报照片很漂亮,乐意分享。海报下面的品牌宣传,也得到了传播。整体公益海报,大家乐意积极参加。



技术实现: jQuery



以上为“H5案例分享”团队原创文章,转载请注明出处!

标签

分享:
海报
案列链接
下载截图
收藏案例
已收藏
分享到微信朋友圈
打开微信,点击底部的“发现”,
使用“扫一扫”即可将网页分享至朋友圈。

相关推荐:

新浪:抓萌大作战

雀巢咖啡+IFAW:我和朱亚文一起为动物发声

关注微信号:h5-share,获取更多创意H5案例分享!也可访问H5案例分享网站www.h5anli.com,搜索查阅~

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

对汉语支持不错,别对小五说英文

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~