99公益日 × 腾讯公益:你有几朵小红花

2022-09-01 H5案例分享 H5案例分享
99公益日 × 腾讯公益:你有几朵小红花


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

识别图中二维码

你有几朵小红花-查阅二维码

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


案例:你有几朵小红花

品牌:99公益日 × 腾讯公益

技术实现: HTML5

亮点:

1.创意定位

腾讯公益打造的99公益日线上营销创意H5,以“你有几朵小红花”为主题,用过往数据和创意主题激活老用户参与活动,引发裂变,让更多的人知晓腾讯公益、99公益日,拉低做公益的门槛,使更多新用户参与其中,为社会贡献自己的一份公益力量。

 

2.策划逻辑

主流程:Loading → 爱心回忆 → 获赠小红花及捐赠小红花 → 捐赠海报。

 

Loading :用99公益日小红花Logo的五个花瓣聚拢为加载动效,配上走心文案:你做过的好事,也许你已经忘了,但是我们记得。加载完成,进入爱心回忆部分。

 

爱心回忆:按引导文案“点击时光传送门找回那些年的爱心回忆”点击小手指着的小红花花心位置,进入“爱心回忆”的数据展示部分。包括:加入腾讯公益的天数、捐款的项目、捐款的金额,以及获得的小红花数。整个数据展现过程用卡通视频动画展现,右上角有“跳过”按钮。

 

获赠小红花及捐赠小红花:爱心回忆数据展示完,获赠一定数量的小红花。进入长图场景,可以选择心仪的公益项目,进行捐赠。长图场景是画得很美的绿草蓝天,小红花IP形象植入其中,可以通过左右滑动浏览全部场景,点击嵌入在场景中的各种项目,可以看到项目相关介绍。选中项目,点击“捐出小红花”,即完成了捐赠,随后生成捐赠海报。

 

在长图场景的左上角,是名人捐赠的动态弹幕消息,点击明星头像,可以看到明星捐赠海报。右上角有三个图标:主会场、获赠小红花和爱心回忆。点击“主会场”,直接跳转99公益日主会场页面;点击“获赠小红花”,弹出各种可以参与获赠小红花的活动页面;点击“爱心回忆”,即展示过往的互动数据。

 

捐赠海报:捐赠海报包含用户微信头像,捐赠项目,活动主题“用小红花一块做好事”,以及品牌方Logo。

 

3.视觉交互

整体画面以蓝天白云绿草红花等鲜亮自然色为主的卡通版面,生机勃勃,让人感受到希望和旺盛的生命力,契合主题。交互上,主要以点击、左右滑屏和长按保存等方式。

 

4.用户体验

小五以个人名义曾经参与过腾讯公益捐款,确实有些时间了,自己都忘记了,现在用数据唤醒记忆,还是很开心的。今天又借助99公益日捐了一朵小红花,大家也可以尝试一下。





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

标签

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

相关推荐:

腾讯公益:女排国潮秀 乡村妈妈绣

99公益日X腾讯游戏:急!寻找“国宝”守护人

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~