彪炳史册!1997,那个成为永恒瞬间

2022-07-17 H5案例分享 H5案例分享
彪炳史册!1997,那个成为永恒瞬间


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

识别图中二维码

彪炳史册!1997,那个成为永恒瞬间-查阅二维码

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


案例:彪炳史册!1997,那个成为永恒瞬间

品牌:

技术实现: html5

亮点:

  1. 创意定位

为庆祝香港回归25周年,唤醒国人共同的记忆,特推出“彪炳史册!1997,那个成为永恒的瞬间”创意H5来回顾当年香港回归瞬间,并展示25年香港建设的成就。作品最后,用户可以上传图片,生成“香港一瞬25周年”纪念海报。

 

  1. 策划逻辑

主流程:Loading → 主题页 → 幻灯片 → 横向长图 → 分享海报。

 

Loading:日历快速翻动动效,从1997年7月1日到2022年7月1日。伴随着加载进度条加满,进入主题页。

 

主题页:伴随着激奋人心的背景音乐,主题文字逐次出现:彪炳史册!1997,那个成为永恒的瞬间——庆祝香港回归祖国25周年。轻触“点击开启时光行旅”按钮,进入幻灯片部分。

 

幻灯片:用五张图片快速切换的幻灯片方式,快速把用户拉回到1997年的夏天。根据提示“向左滑动继续浏览”,进入横向长图部分。

 

横向长图:内容分为两部分,前半部分是回顾1997香港回归交割瞬间,后半部分展现深港建设成就。一朵粉色的紫荆花随着用户的滑动,贯穿整个“时光旅行”。

 

回顾1997香港回归瞬间:中国解放军在雨夜中完成交接仪式,五星红旗在1997年7月1日零时零分零秒准时飘扬在香港的上空,点击查看视频,还可以看当时升国旗的激动瞬间。人声欢腾,汽笛鸣响,一河之隔的深圳,为庆祝香港回归,游行人群扭起大秧歌。

 

深港建设成就:2007年7月1日,深圳湾大桥通车,连接深圳和香港,深港联手,协同发展。中国(广东)自由贸易试验区深圳前海蛇口片区建成,粤港澳大湾区在国家政策的全面支持下,正蓬勃发展,未来可期。

 

点击“分享你和香港的瞬间”进入“分享海报”部分。

 

分享海报:分两步,一为选择海报背景,二为点击上传图片。海报背景有8个香港特色手绘景点,可以任选其一。点击上传的图片,会显示在“香港一瞬25周年”海报模板镂空的数字25里。顶部有用户头像,以及参与位次。海报生成后,可以长按保存海报到手机相册,也可以点击“重新生成海报”按钮,重新选择海报背景再次生成。

 

  1. 设计上

手绘风格,结合实际视频素材,红色贯穿其中,色调鲜亮明确,带入感很强。内容上很完整,选取的事件很有层次感和代表性,可以让用户在回顾香港回归的同时,了解大湾区的发展与成就。交互方式主要是:点击、滑动、上传和长按。 

 

  1. 体验上

整个案例体验过程中,多次被感动到。人民解放军在交接时洪厚的口令和气势,瞬间汗毛倒竖,真心感叹国强才能家安。25年,弹指一瞬,香港,未来会更好。





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

标签

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

相关推荐:

闪电新闻X中共临沂市委宣传部:沂蒙老区新画卷

国务院客户端 & 网易新闻:360°总理记者会

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~