UTS:UTS 360 virtual campus tour

2022-03-11 H5案例分享 H5案例分享
UTS:UTS 360 virtual campus tour


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

识别图中二维码

UTS 360 virtual campus tour-查阅二维码

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


案例:UTS 360 virtual campus tour

品牌:UTS

技术实现: Three.js

亮点:

1、创意定位

悉尼科技大学(英文缩写UTS)的沉浸式游览宣传H5,允许潜在学生自由探索UTS校园,根据用户自己的兴趣进行游览参观。

 

2、策划上

① 点击首屏对的开始旅行按钮开始参观,进入参观页后,需要选择用户学习的领域(相当于对学校专业了解)和描述语言(有简体中文,大家可以选择);进入正式校园游览;

② 校园游览的首页中,会有一个虚拟人物用英文进行校园介绍;如果你开始选择的简体中文,那么屏幕下方会有中文的同步描述说明,语言开始选错也没有关系,屏幕右下角可以重新选择语言;屏幕左下角是校园的整体地图;屏幕左上角是两种游览模式,默认是导游模式,还有一个是自由行,点击两种模式切换;

③ 点击全景中的向上三角,切换不同的校园空间;点击全景中的三条横线,是图文+视频介绍具体的地点说明;

④ 一共18个全景空间介绍,涉及不同专业、图书馆、住宿等。

 

3、设计上

 真实的720度视频全景,超级真实的沉浸式体验;

 

4、交互上

① 屏幕的左上角的浏览模式:导游模式+自由行,提供不同的体验方式;

② 导游模式中,只需要点击屏幕右下方的箭头,就可以依次参观学校;

③ 自由行模式中,转动手机,可以切换空间的位置会有圆形图片引导点击,随心浏览,没有具体的位置,跟着心情和喜好慢慢看校园;

④ 左下角的地图,也是重要浏览引导。





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

标签

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

相关推荐:

国家林业和草原局 + 腾讯:国家公园寻虎

Weleda:Welcome to the Weleda® Open Garden - a 360 nature experience

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

阅读原文

微信扫一扫
关注该公众号

收藏

微信极速登录/注册

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

微信公众号

提交案例

请pc端输入网址

"h5anli.com"

下载截图压缩包~

标签已提交成功

小编正在审核

请等待一下下啦

哎呀

标签已存在

换个新的呗~