小睡眠APP:偷眠小鬼捕获指南

2019-08-15 H5案例分享 H5案例分享
小睡眠APP:偷眠小鬼捕获指南


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

识别图中二维码

偷眠小鬼捕获指南-查阅二维码

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


案例:偷眠小鬼捕获指南

品牌:小睡眠APP

亮点:

  1. 创意定位

熬夜成瘾,睡眠都去哪儿了?快来捕捉让你失眠的可爱小鬼,做好睡眠规划,小睡眠APP帮你更好更早进入优质睡眠状态。

 

  1. 策划逻辑

作品大致有三个阶段

①初始界面是一位睁大眼睛躺在被窝里失眠的男生,上方是大大的标题,点击“开始捕获”进入作品。

②页面出现很多白色的圆形“小鬼”,它们的名字是各种失眠的原因,“追剧”“玩手机”“焦虑”等,每次会呈现六个小鬼,点击“换一批”会换六个,用户根据提示选择最少三个,最多五个,点击已选的小鬼可以重新命名或将其移除,选好后点击“马上召唤”进入下一环节。

③上一轮选择的小鬼会带着他们的名字出现在屏幕上睡觉的人物旁,用户选择自己的性别和被子的花纹,点击“我选好了”,阅读“捕获须知”,勾选”承诺每天按时睡觉”,输入名称,生成海报。

④海报名称是“XX捕获的证明”,包括一副主图(内容与上一环节相同,人物性别与被子花色与用户上一轮的选择相符),海报生成时间,出品方名称和游戏二维码。

 

  1. 设计上

手绘的卡通风格,每一个小鬼都根据自己的名字有不同的表情和姿势,拿手机追剧的,拿电脑做工作的,喝奶茶的,因焦躁而头发炸毛的等等,很可爱的展现了各种失眠原因,被窝里的人物表情也很符合人们失眠时候的样子,还贴心的设计了各种被子的花色供选择,增加游戏趣味。

 

  1. 体验上

失眠原因罗列起来原来有这么多,作品中的失眠鬼真的超可爱,正面对待小鬼,才能把失眠的小鬼养好放掉,按时睡觉,迎接健康好身体!



技术实现: html5



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

标签

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

相关推荐:

网易新闻 x 乐敦眼药水:乐敦护眼工程,开启移动验眼新时代

丁香医生X即刻APP:测试你的黑夜人格

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~