杏耀註冊平台官網_為什麼 macOS 的設計是魔鬼:探究官方設計原則

HIG 為 Human Interface Guidelines 的縮寫,是 Apple 官方提供的設計指導。「HIG for macOS 解讀」專題是我對 HIG 中 macOS 部分的研究。從相對冷門的 macOS 設計中,我們或許能更好地理解主流的移動端設計。

設計原則就像是設計的憲法。要充分理解設計原則,就要從其提出的背景、面向的平台、用戶的構成等方面聊起。現在,就讓我們對 macOS 的設計原則一探究竟。

macOS 設計原則

macOS 有四項設計原則:

  • 靈活定製 Flexible
  • 全面展現 Expansive
  • 擴展賦能 Capable
  • 凝神專註 Focused

1. 靈活定製 Flexible

People expect macOS apps to be intuitive, while simultaneously adaptable to their workflow through customization and flexibility. Many apps offer configurable preferences, customizable interfaces, and alternate ways of completing tasks. Windows can often be resized and interface elements hidden or repositioned. Tasks can be initiated from toolbars, menus, controls, keyboard shortcuts, the Touch Bar, accessibility features, and more. A flexible app facilitates learning through discoverability.

相對於移動端,桌面端的 UI 可定製度更高。常見的定製場景如下:

調節偏好設置:

更改窗口尺寸、位置:

自定義工具欄:

創建、執行自動操作:

定製觸控欄(Touch Bar):

需要注意的是,這裏的定製是以生產力為訴求點的,目的是創建一個更適合用戶自己的工作流(workflow),強調效率。但在移動端,定製則更多以「彰顯個性/身份」為訴求點(如換膚、會員掛件等),強調感受。這一不同,源自桌面端與移動端的一項重要差異:桌面端的使用場景更多是「工作」狀態,而移動端則是「娛樂/生活」狀態。

另外,對於移動端中的 iPadOS,Apple 將其定位為「未來的電腦系統[1]」(同時也將 iPad 描述為「生產力工具」)。因此,我們會在 iPadOS 上看到越來越多由 macOS 進化而來的交互形態。讓我們拭目以待。

更高的可定製度,會帶來更高的複雜度。對此,Apple 推薦運用啟發性(discoverability)高的設計手段,引導用戶從新手用戶向熟練用戶(甚至高級用戶)晉陞。關於用戶引導的設計,我們日後再談。

2. 全面展現 Expansive

Large, high-resolution displays are typical for most Mac users, and people often extend their workspace by connecting additional displays. Apps can leverage this expansiveness and provide value by utilizing a wide range of interface components—like tabs, sidebars, sheets, and panels—and supporting immersive features like full-screen mode.

面對複雜任務,我們常常在多應用、多文檔、多視圖間切換(在 macOS 中使用 Mission Control 在所有已打開的窗口、桌面空間、全屏應用和 Split View 空間中切換)。得益於桌面電腦更充裕的显示空間(更大的屏幕、額外的显示設備),macOS 是複雜任務、沉浸體驗的首選平台。

展示空間越大,設計的可發揮空間也就越大。由此,桌面端的設計就比移動端更自由,同樣的情況也存在於 iPad 與 iPhone 間、iPhone 與 Apple Watch 間。

3. 擴展賦能 Capable

Macs are extremely capable in terms of hardware and software. Apps can harness this power to offer an extensive range of features and workflows that meet a wide variety of simple, advanced, and niche user needs.

除了充裕的屏幕空間,桌面電腦還可以外接豐富的軟硬件。最基礎的外接設備就是鍵盤與鼠標了。除此之外,普通用戶還常常外接移動硬盤、麥克風;對於插畫師,還可以外接數位板;對於音樂製作人,更可以外接 MIDI……

外接設備的意義主要在於:

  • 增加信息的輸入輸出渠道(如外接投影儀,能獲得更佳的展示效果)
  • 簡化屏幕上的複雜交互(如外接數位板后,插畫師就可以獲得像在傳統紙張上的繪畫體驗)
  • 多平台無縫銜接(如 Apple 的「接力」)

剛剛提到的「接力」(Handoff)也屬於外接的一種,只不過這種外接是無線的。隨着技術的發展,越來越多的外接將會以無線(甚至是雲)的方式實現。

如此這般豐富的外接軟硬件,彰顯了 macOS 強大的可擴展性。充分利用這一點,便能構建一個良好的桌面生態。

4. 凝神專註 Focused

macOS is designed to keep the current task clear and in focus. Visual contrast, translucency, and a large drop shadow make it easy to differentiate the active window from inactive windows. Interfaces defer to content and related controls. Throughout the system, adornments are subtle and appropriate.

上文提到,充裕的屏幕空間更適合執行複雜任務,或運行沉浸式體驗的應用。但這並不是說小屏幕就不好,在某些情況下,小屏幕會讓用戶更加專註。只不過,大屏幕(多屏幕)環境下,設計師也可以通過設計手段來達到「專註」的效果,如:

深色模式有助於用戶專註地開展工作,因為內容會較為顯眼,而顏色加深的控制項和窗口則會隱入背景之中。

Ulysses 提供了為專註而生的「打字機模式[2]」:

Apple 各平台設計原則對比分析

我們先簡要回顧一下 Apple 各平台的設計原則。

macOS

  • 靈活定製 Flexible
  • 全面展現 Expansive
  • 擴展賦能 Capable
  • 凝神專註 Focused

iOS

  • 依從 Deference
  • 清晰 Clarity
  • 縱深 Depth

watchOS

  • 交互輕量 Lightweight interactions
  • 軟硬件一體 Holistic design
  • 面向個人 Personal communication

tvOS

  • 自在連接 Connected
  • 清晰易懂 Clear
  • 沉浸體驗 Immersive

先說共通點,四大平台均對可用性有着一致追求,體現在:

  • macOS 的 focused
  • iOS 的所有原則
  • watchOS 的 lightweight interactions
  • tvOS 的 clear

現在來說各平台的不同點及原因。

macOS 面向複雜任務、專業用戶,故對應用的功能數量及設計表現要求是最高的,這裏不再重複闡述。

iOS 是應用範圍最廣的操作系統,故其用戶人群構成也更加地豐富多樣。無論是專家、還是小白,都會使用 iOS 設備。因此,iOS 設備在產品設計的易學性、元素表現的可供性(affordance)上要求會比較高。

watchOS 是為可穿戴設備準備的操作系統。對於基本隨時貼身的智能設備,Apple 推崇「Calm Tech[3]」。在物理性質上,強調「軟硬件一體」;在交互表達上,規避信息過載、注重信息安全。

tvOS 最大的特色,就是它是遠程操縱的,面向家庭(多人)的,場景更多在於影音娛樂。故其設計更多在解決「如何讓用戶更自在地享受」這一問題。從這個角度上來說,tvOS 平台內的設計,可以更多地與傳統遊戲設備進行對比分析。

Material Design 設計原則

我們再來看看 Material Design(后簡稱為「MD」)的設計原則。Google 官方將其分為「設計目標」及「設計準則」兩部分。

設計目標 Goals:

  • 構建 Create
  • 整合 Unify
  • 定製 Customize

設計準則 Principles:

  • 隱喻作為指導 Material is the metaphor
  • 借力平面設計技法 Bold, graphic, intentional
  • 動畫也是信息 Motion provides meaning
  • 張弛有度,定製自由 Flexible foundation
  • 多平台 Cross-platform

可以看到,Google 對於創建「通用型設計語言」(universal design language)的野心已表現得相當明顯。同 Apple「就設備論事」的理念不同,Google 認為體驗、設計、代碼是可以被統一整合的。這是 Google 和 Apple 的重要區別之一。

不過 Apple 也在近來持續推進着「Project Catalyst」,以向開發者提供將 iPad app 帶入 Mac macOS 的方案。從這點看,Apple 也有對「大一統」的追求,只不過其驅動力是出於充實 macOS 較為匱乏的應用生態,而不是出於底層設計邏輯。

在 MD 的設計準則中,最有特色的便是對隱喻(metaphor)的詮釋了。大範圍使用的卡片、多層級的陰影系統、吸引眼球的轉場動畫,這些都是 MD 最具識別力的表現手法。另外,相對於 Apple 平台,MD 更加強調對 UI 中 Z 軸(高度)的運用。

提高80%的效率!寫給設計師的macOS 超實用設置

學會設置好macOS ,你的操作效率起碼提高80%! 對設計師來說,有一些特定的操作和行為頻率會特別高,例如拖拉、抓取圖片等,而眼睛和手部也容易感到疲勞,甚至是造成傷害;因此在這裏推…

閱讀文章 >>

參考資料:

歡迎關注作者微信公眾號:「FXDesign」

未经-摩登3注册-摩登3测速官网-允许不得转载:摩登3注册-摩登3测速官网 » 杏耀註冊平台官網_為什麼 macOS 的設計是魔鬼:探究官方設計原則

赞 (2)