「北京2022冬奥会·阿里巴巴云展厅」幕后设计大揭秘

2022-3-1    seo达人


 

①数字冰雪

在北京冬奥会的云展平台上,我们打造了“阿里巴巴云展厅”虚拟展厅,用数字化的方式呈现冰雪与科技之美、铺设竞技与温暖的赛道。
1月25日,北京冬奥会倒计时10天之际,奥运史上首个云展厅“北京2022云展厅“正式上线,这是一个集奥运合作伙展示与线上趣味互动为一体的云聚合平台,由阿里巴巴集团提供技术和运营支持,为公众打造一个与奥运会零距离接触的线上会场!

图片

-展厅广告图

同期,由阿里云设计中心和达摩院XR实验室携手制作的【阿里巴巴云展厅】也同步对外,借由虚拟现实技术,为观众呈现一个精彩纷呈的阿里冬奥线上空间。本次北京2022云展厅于1月25日上线后将一直陪伴公众直至3月13日北京冬残奥会闭幕。

 

冰雪数化

〇 空间质感

在项目伊始,我们希望能在这次的项目中实现传统虚拟展厅与沉浸式数字空间的平衡,在有效传达信息的同时能让用户获得耳目一新的体验。因此在整体设计风格上,我们根据北京冬奥会的特点,在最初的设计基调上融入了冰雪、冰丝带和户外运动等元素,同时辅助温暖的橙色、科技元素来展现阿里巴巴集团的品牌心智。比如,展厅的质感选择上我们采用了冰雪、玻璃与金属相结合的搭配;在造型上则会以几何和曲线为主的简洁构造来体现运动感与科技感;而在整个展厅的采光设计中,我们以偏冷的自然光为主,与隐藏于结构中的橙色灯光相辅助,共同营造了明亮干净的视觉氛围。

图片

-空间质感设定

 

〇 体验设计

同时在体验设计层面,我们从冬奥会展厅面向的用户角度出发,将展厅设计为线性的浏览方式,以此来简化操作和提升体验。用户进入云展厅后,会依次经过【让精彩每天出彩】、【云上奥运@北京2022】和【阿里巴巴以电商服务全球奥运粉丝】三个展厅,其中每个展厅都会通过转场视频来衔接,使得用户的观展体验更加顺畅。

图片

-导览路线图

这也使得我们在思考展厅的空间设计的过程中,将不同的展厅通过户内外场景结合的方式依次连接在一起,这让观众的动线更加顺畅的同时,也使得展厅能够更加通透自由和富有层次。

图片

-空间设计总览

展厅1- 【让精彩每天出彩】

图片

-展厅1-初始视角

图片

展厅1-室内场景

图片

展厅1-室内场景

图片

-衔接展厅一和展厅二的走廊

 

展厅2 -【云上奥运@北京2022】

图片

-展厅2-入口

图片

-展厅2-虚拟转播台

 

展厅3 -【阿里巴巴以电商服务全球奥运粉丝】

图片

-展厅3 – 初始视角

图片

-展厅3 – 奥林匹克官方旗舰店

 

· UI设计

除此之外,UI界面的设计上我们采用了2D与3D空间结合的方式
  1. 空间层-在3D空间中展示最关键的一级信息(图片、视频、标题性文字),让用户像真正线下逛展般沉浸游览;
  2. UI层/内容层-在2D空间中通过醒目的标签绑定3D空间中位置信息来展示次要的二级信息,用户点击标签后可以看到该展位的详情内容;
  1. 声音层-为了配合UI视觉层的信息立体展示,我们植入虚拟人IP通过声觉层穿插讲解,给用户打造声光电立体沉浸的信息可视方案;

图片

-多层级信息结构图

图片

 

-虚拟IP声音层讲解

· 技术亮点

相较于传统三维全景展厅,我们本次采用了达摩院XRlab自研的三维渲染引擎,它强大的能力允许我们在视效和内容上做更多创新。在该引擎的加持下我们引入了基于真3D技术的虚拟云小宝讲解员,它可以在不同展位间移动,为观众带来生动的讲解。我们也在本次展厅设计中引入更多动画效果来丰富观众云逛展的体验,例如虚拟转播台的设计。

-亮点1 — 全景技术与动态真3D的结合

针对本次展厅受众群体,我们打造了一个“动画引导+观众主动探索”结合的沉浸式展厅。观众进入云展厅后,我们会设置一个最佳视角的视窗来引导参观流程。当观众准备进入下一个展厅时,视角将自动匹配到转场动画的第一帧,以此来达到顺畅的观展体验。

 

动画引导+全景探索

-主动引导型展厅结构

 

最终线上发布的效果

-PC端体验录屏

 

体验二维码

图片

-识别图中二维码即刻体验

 

冰雪之约

全面体验时代,数字世界,虚拟空间成为了商业数字化转型的潮流和必须。
阿里云设计中心的数字巡展产品致力于在虚拟/现实空间中运用最先进的表现技术对物理世界转译、重构,并进行沉浸式表现。不仅能有创造力地实现具有多元、丰富、有趣的视觉表现力的场景,还能用丰富的游戏化交互形式在保证趣味性的同时将信息准确传达给用户。
借助2022北京冬奥会的舞台,阿里巴巴为奥运打造首个云上展厅,将全景技术、真3D漫游、虚拟IP等前沿技术与创新设计结合形成全域XR综合营销体验链路,未来也将会有更多的企业、商业场景等待我们的发掘和探索。
数字巡展,虚实之间,沉浸生活。

图片

-数字巡展产品海报

 

过往案例

-阿里巴巴云栖大会·互动导览

-阿里云金融峰会·云上数舱

-达摩院数字展厅·云游达摩

-人工智能实验室线上展厅·云游AI

 

原文地址:阿里设计中心(公众号)
作者:阿里设计中心
转载请注明:学UI网》「北京2022冬奥会·阿里巴巴云展厅」幕后设计大揭秘

蓝蓝设计建立了UI设计分享群,每天会分享国内外的一些优秀设计,如果有兴趣的话,可以进入一起成长学习,请扫码蓝小助,报下信息,蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作,也请与我们联系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向给文章原作者及众读者.
免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

蓝蓝设计www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务

UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司


日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档