滴滴：滴滴顺风车

2018-01-24 H5案例分享 H5案例分享

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

识别图中二维码

滴滴顺风车-查阅二维码

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

案例：滴滴顺风车

出品：滴滴

亮点：

策划上，3D宇宙星空类，① loading结束，点击start，进入到繁星满布的宇宙星空，继而出现走心文案，引出顺风车让陌生人成不了陌生人这一话题；② 然后点击白色星辰即可查看他人与滴滴顺风车的故事，点击屏幕下方带有人物图标的按钮即可进入你的故事，如果你还没有发表自己的故事，通过这个按钮可进入到编辑页，去上传自己与滴滴顺风车的故事；③ 右滑人物图标的按钮，输入手机号获取验证码，还可去回顾一下自己的2017。
设计上，科技风格，① loading页采用极简风格，银色背景，黑色中心点，利于人们的视觉聚焦。② 浩瀚的宇宙采用黑色做背景，香槟色的点点繁星做点缀，并且在前面两段文案的最后一句出现时，星辰化作星海，在屏幕下方起伏，还幻化出星球的形状映衬着文案。③ 故事画面采用上面是主人公的昵称，而后下方是主人公的头像，在下方是故事叙述的方式。
交互上，左右滑动宇宙星空画面即可去在宇宙中寻找白色星辰，查看故事的方式很简单，点击即可。

技术实现：捂得太严了，小编看不到啊~~~

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

标签