作者丨Mike Wolfson

译者丨李睿

策划丨云昭

审校丨徐杰承

设计系统使开发人员和设计人员能够快速开发在所有平台上都能保持一致的产品，并可以将现有的设计标准直接应用于元宇宙。但是许多概念对于 3D 环境来说是独特的，需要重新定义。

在开发过程和设计方面具有丰富经验的 Android 开发专家 Mike Wolfson 为支持混合数字工作空间(包括 VR 环境)的企业提供了很多建议。他表示，团队通过扩展他们在 2D 设计系统中建立的原则，有效提升了构建平台时的研发效率。

顶层考虑✦

Wolfson 指出，2D 和 3D 体验都受益于遵循基于基本设计原则的规范。这些规范引导产品设计和开发朝着一致而积极的用户体验发展，并防止过度定制。

标准规范是指导方针，而不是严格的要求，因此现有标准有时不符合需求，这是可以预料的。在需要时允许例外情况，而且至关重要的是，需要确保清楚地记录例外情况，以便相关人员都能理解为什么要进行更改。

Wolfson 表示，元宇宙标准建立在基本设计原则之上，以确保这些体验能够与现有产品良好集成。因此，网络、移动和印刷体验都是使用相同的基本设计语言开发的。

存在感✦

设计良好的元宇宙体验的目标是确保运行环境感觉自然，用户在空间中感到舒适，并且用户能够有意义地体验内容(而不是逃避现实世界来处理导航或视觉干扰)。而在 VR 中用于感觉身临其境的术语是“存在”(Presence)，这个术语最初是在梅尔·斯莱特的存在理论中创造的。

正如马克·扎克伯格在去年一次新闻发布会所言：“元宇宙的决定性品质是存在，也就是你真的和其他人一起在另一个地方的感觉。创造、化身和数字对象将成为我们表达自己的核心，这将带来全新的体验和经济机会。”

Wolfson 说，团队与元宇宙相关的设计规范的目标是建立模式以确保用户感到舒适，并能够以自然的方式与内容交互。Wolfson 表示可以使用设计规范来实现自我体现的错觉，并建立强制物理交互错觉的交互模式。

哪些 2D 规范可以直接沿用?✦

Wolfson 发现，许多传统设计标准可以直接应用于 3D 环境。毕竟，元宇宙仍然是一个由代码构建的可视化媒介，必须由开发人员实现。

(1)设计令牌

Wolfson 表示，其团队为各种颜色、尺寸和排版规范创建了一致的、可读的设计标记，这使得设计和开发过程更加简单。因为使用的标准令牌数量有限，这些令牌很快成为其设计模型中使用的语言，使其团队能够使用一致的语言进行交流。

通过确保设计规范都使用相同的语义名称，他们降低了引入自定义值的可能性。

YES: AccentColor, SideMargin, Headline4
NO: #bada55, 16px, Montserrat/14px/Bold
1.
2.

(2)颜色

Wolfson 并不支持使用光谱中的每种颜色;与其相反，他们团队定义了一个具有更便于管理的、数量有限的调色板，仅使用与特定令牌相关的几个选项。

在他们支持的式相平台上，使用有限数量的品牌特定颜色可以带来一致的美感。这确保了元宇宙体验与 2D 或印刷媒体品牌相匹配。

由于颜色集中且一致，可以轻松地将它们切换为品牌重塑。这种控制有助于保持应用程序的访问，因为可以确保每种颜色都能满足最低对比度的要求。

然而 Wolfson 发现，他们用于 2D 设计的有限颜色范围并不一定能转化为沉浸式空间。由于元宇宙的空间涉及亮度，并吸引用户直观地掌握周围环境的深度。因此需要为沉浸式环境支持更广泛的颜色。

调色板的选择需要考虑到空间的意图和氛围。对于 3D 空间，他们使用设计系统中指定的基本颜色，但允许设计师调整其亮度或饱和度，以保持整体美学并与品牌一致。

沉浸式环境中的照明会营造氛围，因此他们设置了最小和最大亮度级别来管理这一点。亮度会影响文本的易读性和应用程序的整体可访问性，因此需要密切关注它。在突出某些内容时，他们使用了较短范围的柔和和刺眼的对比色和互补色，以形成强烈的焦点。

(3)排版

创建少量排版样式的 2D 优势，可以直接在元宇宙里沿用，他们没有进行任何更改。这并没有直接影响存在感，而且使开发过程更加简单。

(4)间距

重要的是要用一个令人难忘的参数来设定空间系统的范围，并记录对其使用方式的明确期望。这使得其布局与网格对齐，这在视觉上让用户感到愉悦。

他们使用了 Base8 系统(允许其尺寸可被 8 整除)。使用这个系统是因为可以与许多浏览器的 16 像素(8×2)基本字体大小相匹配，并且因为许多流行的屏幕尺寸在一个轴上可以被 8 整除。

Base8 测量值始终可以被 2 整除，因此避免了在 Base5 系统中导致 0.5 像素偏移的缩放问题。偏移量为 0.5px 的像素将显示由于其应对锯齿而模糊的边缘。

嵌入式资源(视频和图像)的标准✦

在创建元宇宙环境时，用户往往希望媒体形状不规则，以适应形状奇特的空间。因此需要努力调整 3D 空间以适应形状独特的媒体。标准化媒体尺寸简化了设计，因此不会试图将无限数量的形状融入 3D 环境。

限制这一点的最简单方法是定义有限的几种纵横比：

• 9:16(16:9)
• 3:4(4:3)
• 1:1

这样可以确保所有媒体都适合这些有限格式之一，就不再需要调整环境来适应各种尺寸的媒体，既简化了实施，又避免了不必要的返工。

元宇宙设计有哪些独特的规格?✦

Wolfson 发现了各种用于帮助建立用户在虚拟世界中的存在的设计类别。本节将介绍确定的主要类别。

(1)动画

动画必须遵循物理规律，并以自然的方式运动。这意味着物体不会线性移动，但这在人眼看来是不自然的。

在其他媒体中使用的相同动画原理在元宇宙设计中同样重要，且所有动画都必须使用正确持续时间的缓动曲线(通常为 200 毫秒～500 毫秒)。

在元宇宙中，用户对非自然物理的看法比他们在网络媒体中的负面看法要大得多。

(2)声音

在元宇宙环境中，有效地使用音频是用户体验的关键部分。

• 空间

空间音频对用户在空间中的位置有所反应。简而言之，音量是距离的函数。这意味着用户距离内容面板或其他用户越近，音量就越高。

为用户提供方向感的一种有效方法是从一个方向发出更大的声音。举个例子：如果你的朋友站在你左边说话，你的左耳听到的声音会比你的右耳稍大一点，也会更快一些。而缺乏良好的空间音频会使环境音效感觉平淡。

定义这个细节是相当复杂的。例如，为了获得良好的 360 度音效，需要考虑空间的形状，并根据其形状“反射”声音。

• 环境音频

这是一种在整个体验过程中安静地播放的声音，以建立和强化情绪。顾名思义，它应该增强氛围，而不是分散整体体验。当没有其他反馈时，环境音频可以帮助避免不自然的沉默。

Wolfson 发现，对于环境音频，最好逐渐淡入。当用户希望静音时，音频需要立即调整成静音。为了避免影响其他大音量的音频听感，在播放其他媒体时，应该将环境音频进行静音。

• 音频反馈

使用声音触发器在沉浸式环境中引导用户。例如，当用户关上一扇门时，会播放确认声音以向他们提供另一个级别的反馈。这种类型的反馈通常比 2D 设计中使用的视觉方法更好。

(3)化身

用户在虚拟空间中的表现方式直接影响他们的存在。当化身可以成功模仿他们真实世界的动作时，体验会变得更好。当动作真实而直观地强化了这种至关重要的存在感时，用户会感觉更像化身。

让化身成功模仿现实世界的交互非常困难，如果做得不正确，它会让用户感到沮丧，并让他们失去良好体验。糟糕的数字表现可能会让用户感到不安。

如果没有完全具有代表性的化身，一个很好的折衷办法是使用小型视频或图像。这是对用户在视频会议中代表自己方式的自然而舒适的扩展。可以采用指示位置或静音状态的信息徽章装饰个人资料图像。

(4)控制和导航

当开始讨论摄像头控制和导航时，人们很快意识到这是一个极其复杂的主题。 需要定义以下细节：

• 摄像头视角

Wolfson 表示，他们需要定义元宇宙将支持哪些摄像头视角。这可能在第一人称视角、第三人称 / 玩具屋视角或 2D 世界地图之间有所不同。这些观点中的每一个都需要大量详细的描述。

• 控制布局

需要定义用户如何控制摄像头及其在环境中的移动。

Wolfson 团队很快了解到拥有直观的控件很重要，发现有许多不同的控制机制，并且“最佳”方式在用户之间存在很大差异。

例如，他们支持标准的 WASD 键盘命令，但一些用户更喜欢使用箭头键或鼠标移动。这些规范更加复杂，因为不能依赖访问某些控件的用户。例如当键盘不可用时，移动设备需要采用虚拟操纵杆。

• 运动和导航

运动和导航对于确保积极的用户体验非常重要。他们可以轻松移动以及在移动时模拟运动，这对于避免眩晕至关重要。

• 最小距离

他们需要考虑用户在环境中移动是多么容易。如果只是从房间的一侧走到另一侧，这很乏味，也会让用户感到沮丧。他们定义了房间之间的最大距离，并优先考虑用户如何在环境中移动以最小化行进距离。

经验总结✦

Wolfson 在为元宇宙调整设计系统时，团队了解到原有的传统开发规范具有普适性，并将其直接继承沿用在 3D 设计和开发中。这并不奇怪，因为使用的是经过充分研究的既定设计模式，所以希望它们能够很好地沿用。

他们发现了许多方法来帮助用户提升自然“存在感”，并且使用标准来建立模式以确保的用户获得积极的体验。另外，在为元宇宙设计体验时，对用户有同理心是非常重要的，这对于针对该平台的产品成功应用至关重要。

写在最后✦

对于元宇宙，各大巨头都有自己的判断——

Meta CEO 马克·扎克伯格说，“你可以把元宇宙看作是一个具身性的互联网。在这里，你不再浏览内容——而是在内容中。”

微软 CEO 纳德拉则提到，“随着虚拟世界和物理世界的融合，由数字孪生、模拟环境和混合现实组成的元宇宙正在成为一流的平台。通过元宇宙，整个世界都将成为应用画布。”

然而，于开发者而言，任何新事物的出现，必将衍生出新的设计原则和规范。在元宇宙设计和开发过程中，如何去借鉴已有的模式，如何建立元宇宙独有的规则，是摆在开发者面前的一大课题。

关于元宇宙的搭建各位有什么看法呢?欢迎大家扫描下方海报二维码添加 51CTO 小助手，加入我们读者群和大家共同探讨，获取更多技术话题资讯，更有机会抽取大会免费门票

原文链接：

​​https://stackoverflow.blog/2021/11/08/adapting-a-design-system-to-work-for-the-metaverse/​​