h5anli.com
完整欣赏此案例大约需要35秒
案例：中秋思念地图
出品：爱上街
链接：https://www.h5anli.com/cases/201809/weizhi.html
亮点：
- 创意定位，爱上街品牌在中秋之际推出的品牌宣传H5，通过中秋节你思念的人想见的人在哪里为创意点，生成相关地图海报，进行传播和品牌曝光。
2. 策划上，大致分为四步：①获取“我”的定位：进入地图页面，默认微信授权调取用户位置信息，地图上出现用代表“我”的黄色坐标；②添加“我思念之人”的位置：选择国家城市后，点击“添加”按钮，地图上出现蓝色坐标，添加按钮变为继续添加，提醒用户可添加多位思念的人；③ 分享：点击“生成我的地图”，可以生成带有回流二维码海报，分享到朋友圈，好友参与，选择位置，添加完成后地图上会生成白色的坐标，白色坐标即代表“思念着我的人”；④ 持续互动反馈： 将思念地图分享到朋友圈之后，参与的朋友变多，地图上的白色坐标数量便会超过蓝色，寓意着思念你的人远比你思念的多！并且内容实时更新，所有人同步可见。
3.设计上，一张世界地图，暗暗的深蓝色，却能标注出无限的心情和坐标。
4.体验上，获取用户位置信息时，有些用户习惯上不愿意暴露自己的个人位置信息，可能导致用户本身地理位置并不能如期获取，但只要用户同意，看清文案引导，思念的人，在世界地图上的位置会一一标注：我的心上人，你在哪里，小五在想念你！
即使中秋节没人陪你，但一定有人在思念你！
小五祝大家：2018中秋快乐！！
技术实现： JavaScript+地理定位
h5anli.com
H5案例库：h5anli.com
分享到:
閱讀更多 H5案例分享 的文章
關鍵字: 中秋 JavaScript 上街
