AR/VR 的界面是否可沿用扁平化設計？

最近兔斯霽回答了這個問題：ARVR的界面適合延續現在手機的扁平化界面設計嗎？，然後把答案搬運過來了。

結論：扁平化界面設計可以被沿用於 AR/VR 的界面

首先希望大家能明白：Flat Design 是一種視覺設計風格，不僅適於電子產品的 GUI 設計，也適用於一般的海報、冊子、宣傳畫等傳統印刷載體，同時又不局限於 2D 平面設計。它更多是著重於視覺傳達，與人機交互的關係不是那麼緊密。

PS：後續的內容主要以 AR 舉例為主，主要分為3部分。

1.扁平的風格，追求更好的信息展示

我們都知道，AR 技術可以將虛擬物體疊加到真實世界，融合併進行互動。不過要以複雜的真實環境作為「背景畫布」，GUI 的設計則要重點考慮如何更好地呈現信息，便於瀏覽與交互。那麼 Flat Design 的優勢就體現出來了：

• 更好地呈現內容和數據，避免過多視覺元素對信息辨識造成干擾

• 適用於透明化的效果，便於用戶觀測外部環境

這是 Hololens 中 Holographic 的在兔斯霽的桌子上的真實效果，你可以看到 Menu （三個方形的按鈕），輕巧的 Metro UI 很快讓我了解可以進行的操作，這跟你在地鐵里看指示牌是一個道理。

很多影視作品中的也有很多 FUI 的設計：

《Iron Man》

《Psycho Pass》

《エウ?ァンケ?リオン新劇場版：破》

2.扁平的風格，不代表扁平的內容

目前很多 AR 都是給基於 SLAM 技術（如 Hololens），可以對空間進行重構，這也讓 AR 的交互從傳統 2D 平面轉為 3D 空間，從 xy 軸變成了 xyz 軸。這也使得虛擬的數字內容，更多地都將以 3D 模型的形態呈現。 GUI 的風格可以是扁平的，但是 GUI 當中的內容其實也可以立體的、擬物的、豐富的，人與內容的交互也是可以立體的。

這是兔斯霽辦公室里能看到的 Holographic，它們處於 3D 的空間中，但你能說這不是扁平化的風格嗎？PS：圖中的 Holographic，比如地球、雲朵、冰山，本身就是 Low Ploy 風格，講究低細節、抽象化，也可以理解為是另一種 Flat Design。

順便提一下手機產品設計中對於空間的應用，能讓各位意識到扁平的設計也可以是立體的。

Google 的 Material Design 其實早就引入了 Z 軸的概念，將整個場景立體化而不局限於平面。通過不同的層級位置，去影響視覺的顯示效果。

The material environment is a 3D space, which means all objects have x, y, and z dimensions. The z-axis is perpendicularly aligned to the plane of the display, with the positive z-axis extending towards the viewer. Every sheet of material occupies a single position along the z-axis and has a standard 1dp thickness.

參考鏈接：如何理解 Material Design 的 Z 軸 - LCLの海 - 知乎專欄

參考鏈接：https://material.google.com/what-is-material/environment.html#

3.扁平的風格，與擬物兼容並包

不談需求談設計，就是扯淡。不同的設計風格，適用於不同的產品。即使是在 Flat Design 大行其道（可能）的今天，還是很有應用仍在使用擬物的設計，比如部分追求畫面寫實的遊戲。我想說的是，設計風格並不受使用設備和技術的約束，而是取決於應用場景。

這是 Hololens 中的 Holo Studio 的 Holographic，也是官方演示視頻中的一個 Demo，它呈現出一個很擬物的工具箱。官方演示視頻中，用它可以製作一個逼真的模型，那麼勢必需要將物體渲染地更加真實。

來做一個小火箭吧！

說了這麼多都是關於 AR 的，其實 VR 也是同理。

舉個 Google tilt brush 的例子。這是軟體中提供的 Color picker，跟我們平時在桌面軟體中使用的也差不多（扁平式的風格），而不是給你一盒「顏料」慢慢調色。

再次強調：Flat Design 是一種視覺設計風格，不局限於2D平面設計。

推薦閱讀：