▲点击"三分设"关注，回复"社群"加入我们
欢迎来到专业设计师学习交流社区
三分设｜精选全球用户体验设计知识
文来来自：阿里云设计中心
编辑：张梦如
共 2443 字 26 图预计阅读 7 分钟

Part 1

数字冰雪

2022 年的冬奥会是奥运史上首次由云计算替代传统 IT ，承载奥运组织和运营的赛事，通过上云将奥运最核心的赛事成绩、赛事转播、信息发布等信息系统迁移到阿里云上。作为阿里云的设计师和数字巡展产品的孵化者，我们有强烈的使命感，希望能通过互动性、沉浸感、趣味性的方式，为广大用户带来不一样的数字冰雪体验，于是在北京冬奥会的云展平台上，我们打造了“阿里巴巴云展厅”虚拟展厅，用数字化的方式呈现冰雪与科技之美、铺设竞技与温暖的赛道。

1 月 25 日，北京冬奥会倒计时 10 天之际，奥运史上首个云展厅“北京 2022 云展厅“正式上线，这是一个集奥运合作伙展示与线上趣味互动为一体的云聚合平台，由阿里巴巴集团提供技术和运营支持，为公众打造一个与奥运会零距离接触的线上会场！

展厅广告图

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

Part 2

冰雪数化

空间质感

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

空间质感设定

体验设计

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

导览路线图

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

空间设计总览

展厅1 初始视角

展厅1 室内场景

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

展厅2-入口

展厅2-虚拟转播台

展厅3 初始视角

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

· UI设计

除此之外， UI 界面的设计上我们采用了 2D 与 3D 空间结合的方式

空间层-在 3D 空间中展示最关键的一级信息（图片、视频、标题性文字），让用户像真正线下逛展般沉浸游览；
UI层/内容层-在 2D 空间中通过醒目的标签绑定 3D 空间中位置信息来展示次要的二级信息，用户点击标签后可以看到该展位的详情内容；

声音层-为了配合 UI 视觉层的信息立体展示，我们植入虚拟人 IP 通过声觉层穿插讲解，给用户打造声光电立体沉浸的信息可视方案；

多层级信息结构图

虚拟IP声音层讲解

· 技术亮点

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