想掌握Vision Pro空间设计？先掌握这12个基础概念！ - 优设网 - 学设计上优设
source link: https://www.uisdc.com/vision-pro-12-concepts
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
编者按：近期 VR 和 AR 相关的公司频繁地拿到高额的投资，足见 Vision Pro 整个行业的推动效果。今天的这篇文章是系列文章的第一篇，如果要针对 Vision Pro 进行设计，需要知道的相关的 12 个关键的设计概念。文章来自设计师 Hajira 的搜集整理，以下为正文。
虽然苹果的 Vision Pro 明年才会正式开卖，但是随着开发与设计文档的公开，持续的关注就没有停过。整个领域正在蓬勃发展，对于多数设计师而言，Vision Pro 所涉及到的用户体验和设计规则和以往有着根本性的区别，从基础知识开始学习和理解个领域是非常合理的。
「空间设计指的是在 3D 的空间环境下进行用户界面和体验设计，提供更加身临其境和直观的方式与数字内容交互。」
在开始学习规范之前，有必要先弄清楚涉及的 Vision Pro 的 12 个核心概念。
更多Vision Pro 干货：
5000字干货！Apple Vision Pro 空间设计基本原则拆解
AR 设计，是基于已有设计基础的一次设计升维，在短短 20 分钟的官方视频中，给出了五个基本空间设计原则：熟悉感、以人为中心、空间维度、沉浸感、真实可信。
阅读文章 >1、窗口（Windows）
- 窗口作为承载内容的容器，可以显示 2D 和 3D 的内容。
- 窗口可以单独存在也可以多窗口同时操作，并且窗口的比例可以做任意调整。
2、体块（Volumes）
- 可以从任何角度随意查看的 3D 内容和对象就是体块。比如在线购买商品之前，可以在电商网站上直接多角度查看商品的细节，了解它的整体外观。
- 对于体块类的内容和对象，并不会在它的周围显示窗口和框架。
3D 的体块对象，可以放置在 2D 的窗口旁边
3、配饰（Ornaments）
- 配饰是一个用来承载和窗口相关的操作控件和信息的
- 配饰可以是工具栏、选项卡栏，也可以是视频播放组件这与的控件载体。比如，当视频在窗口中播放的时候，控制播放的暂停、快进、后退等按钮，可以放置在配饰控件当中。
4、工具栏（Tool Bars）
- Vision Pro 中所提供的工具栏一般都是水平放置的，它们通常被放置于配饰控件当中，在三维空间当中，它们通常在Z轴方向上（垂直于窗口）更加靠前的位置。
- 工具栏承载常用的按钮控件，和当前窗口相关。
5、标签栏（Tab Bars）
- 标签栏的选项卡都是垂直排列，浮动在窗口靠前的位置
- 标签栏的主要功能是提供导航功能，方便用户在应用的不同功能之间快速跳转切换。
6、侧边栏（Side Bars）
- 当选中侧边栏的选项卡的时候，侧边栏会向前移动，展开现实更多的附加的导航选项。
- 比如在上图当中，在侧边栏当中选择 Library 图标下的选项卡时，相应的选项卡下属的菜单会相应展开。
7、菜单和弹出框
- 菜单和弹出框可以拓展到窗口之外
- 被选中的按钮，按钮的背景变为白色，其中的图标变为黑色，这可以帮助用户了解和弹出框关联的是哪个按钮，而菜单也无需使用箭头标识关联图标的位置，更加优雅。
- 作为平台的通用规则，按钮的背景要避免使用白色，除非当它被选中的时候。
8、工作表（Sheets）
- 工作表是一个模态的悬停弹出表单窗口，它通常会向前悬浮于它的父窗口之前。当用户向界面请求特定的信息、交互的时候，工作表会弹出，呈现出相应的详细信息，或者承载简短的交互。比如当用户请求订阅音乐服务的时候。
9、空间（Spaces）
- 共享空间：默认的空间范畴，多个应用的窗口可以并排存在，用户可以将它们重新放置在任何自己喜欢的位置。
- 全空间：为了获得更加身临其境的体验，用户可以将单个窗口扩展到全空间，占据整个空间范畴，其他的 APP 会隐藏，只有被选中的这个程序会呈现。此外，在全空间还支持更强的沉浸式体验，比如打开一个全新虚拟世界的门户进入其中，沉浸于完全不同的场景中。
10、沉浸光谱（Immersion Spectrum）
- 窗口（可以位于共享空间和全空间）
- 全境视图（全空间）
- 环境（全空间）
APP 在 Vision Pro 内可以的呈现是动态的，并且可以丝滑地在不同的沉浸状态之间流畅地转换，而这也成就了光谱式的沉浸状态切换。不同的 APP 可以以窗口的形式，在共享空间内共存。如果它需要更多的空间，那么它可以隐藏其他 APP，它可以独占尽可能多的空间。默认情况下，窗口会在共享空间模式下打开，这是沉浸度最低的状态，用户也可以轻松控制沉浸的程度。
在下面的范例当中，Keynote 在共享空间中以窗口模式打开，当需要播放幻灯片时，它会切换到全空间模式，并且默认情况下，会调低环境光，让目光尽可能集中在幻灯片内容上。
调光是一种增加内容和环境对比度的有效技巧，无需将用户带出环境即可创造出更高的沉浸度。
在排练演讲的时候，周围可以形成一个舞台环境，让人沉浸在这样的环境中。像这样的沉浸式的体验需要更大的空间，这个时候唯有 Keynote 位于画面当中，而其他的 APP 则被隐藏起来了。
下面显示的案例则是照片库，当你浏览器照片的时候，周围的环境会变暗，以这种聚焦而栩栩如生的方式浏览回忆是非常神奇的。当查看全景照片的时候，它会以全空间的模式展开，让人身临其境感知到拍摄时的场景。
11、通透（Passthrough）
- 通透功能让用户在佩戴 Vision Pro 的时候，能够通过设备外部的摄像头，实时看到周围的物理环境。
- 转动数字表冠能够调整通透的程度，改变周围环境可见的范畴大小，从而控制整体的沉浸感。
- 增加通透度，能够让真实环境的可见程度标高，减少通透度，能够带来更强的沉浸感。
12、过渡和微妙的动画
- 设计平滑、可预测的过渡，可以增加不同体验状态之间的连续性。
- 与现实世界有效地融合：当用户准备进入一个全新的沉浸空间场景的时候，周围的物理环境逐渐淡出，请确保 APP 使用柔和微妙的边缘动画，避免使用突兀的过渡，让用户尽量专注于内容本身。
- 最鼓舞人心的经历能够让人感觉充满活力，而微妙的动画则能够给整个场景注入活力。
还有很多东西值得探索。下一篇文章，将会详细探索用户使用手和眼睛在空间中的交互。
Recommend
-
94
粉色店、黑金店、LAB概念店……喜茶的空间设计你学不会！36氪的朋友们·2017-10-09 23:00随着品牌和门店数量的不断增加，摆在很多新茶饮品牌面前的难题是，保持“千...
-
54
喜茶是一家被茶饮“耽误”的设计公司。
-
69
天猫优品店铺空间设计——灯光设计小结
-
45
前言这是一个极好的时代，我们看到了电子游戏的蓬勃发展，也能感受到电子游戏带给我们的快乐。从早期简单的像素游戏到现在的3A大作，游戏发展如此迅速，琳琅满目应接不暇。随着设计思路和硬件水平的提高，越来越多
-
7
你爱吃小肥羊火锅吗？ 文章转载自：餐饮视觉研究室 ID:cysjstudio 图片来源：艺鼎设计 编辑：zkey 说起小肥羊火锅，可以算是火锅行业里面走在头部的火锅品牌之一了，在其产品上聚焦“羊肉”这个品类，可以说是垂直品类里面做的相当好的，也是开创了吃火...
-
7
太空未来风与工业风的新疆菜空间设计，真的很会玩！ 卧野空间设计事务所 /
-
6
hi，我是鱼先生，终身学习践行者。 作为设计师，色彩中的渐变色是我们经常需要用到的一种设计形式，今天鱼先生为大家总结了
-
5
技术的进步为用户体验的形式带来了更多样的实现可能性，比如在生活服务平台上，用户可以通过构造的虚拟空间来进行模拟和内容获取，而业务人员也可以通过虚拟空间的呈现来更好地传递信息，从而助推业务的价值转化。那么，如何根据实际业务需求做好虚拟空...
-
7
Apple Vision Pro设计规范之空间设计原则篇 Vicky。 2023-07-03 1 评论...
-
8
IT领导者应该掌握的12个业务概念 责任编辑：cres 作者：Mary Pratt | 2023-07-03 10:22:00 原创文章 企业网D1Net 如今的CIO更多地将自己视为业务领导者。考虑到技术对运营组织和服务利益相关者(无论是客户...
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK