什麼是用戶界面和體驗設計

來自專欄 交互進階

本文譯自 Mikos Philips 的 UI vs UX? — ?A Guide to UI Design

因為發現仍然有小夥伴跑來問我比較基礎的專業劃分問題，所以翻譯了這篇科普文。

——

用戶界面（UI, User Interface）設計是設計軟體產品所涉及到的幾個交叉學科之一。不論是用戶體驗（UX, User Experience）、交互設計（ID, Interaction Design）還是視覺/圖形設計（Visual / Graphic Design），都能牽扯到用戶界面設計。

什麼是用戶界面設計？

廣泛來講，用戶界面是人與機器交流的媒介。用戶向機器發出指令，機器隨即開始一段進程，回複信息，並給出反饋。用戶可以根據用戶反饋進行下一步操作的決策。

人機交互（HCI, Human Computer Interaciton）所關注的主要是數字界面，即過去的打孔機、命令行，直至今天的圖形界面（GUI, Graphic Design）。

用戶界面設計對於數碼產品來說主要關注的是布局、信息結構，以及界面元素在顯示屏和各種終端平台上的展示。電子遊戲和電視界面也包括其中。

1981 年的 Xerox 8010 信息系統（圖片來源：DigiBarn ，圖片有裁剪）

用戶界面設計師根據設計原則來創作符合用戶需求的設計，而不是單純地提供技術解決方案。在這過程中往往需要在平衡取捨用戶功能需求和展示效果（由品牌定位和視覺設計決定）。

B2B 儀錶板用戶界面設計

優秀的用戶界面設計利用清晰、統一的視覺層次和內容結構來引導用戶完成任務，並減少非必要的內容和元素。

出色的用戶界面通過真實世界的符號隱喻傳達信息——例如按鈕、聲量滑塊、日曆、軟盤樣式的保存圖標等。

用戶界面的組成元素主要包括：

• 輸入：讓用戶可以進行選擇或輸入信息，包括複選框、單選框、下拉框和文本域等交互組件等。
• 導航：用於選擇目的地和篩選信息的組件，包括下拉菜單、滾動條、麵包屑、頁簽和分頁等。
• 信息：向用戶提供反饋的交互元素，包括圖標、文字、媒體、進度條和提示等。

圖片來源：Thrive

高效的設計師會參考優秀設計案例、設計慣例、標準以及可用性原則來確保界面方案符合用戶需要。其中最重要的設計原則包括：

• 統一的界面元素能讓用戶快速熟悉並掌握使用方式
• 清晰的元素層級和頁面結構能讓用戶一眼看到最重要的內容
• 用顏色和字體等樣式來向用戶暗示元素的優先順序以及作用
• 發送系統狀態變更、錯誤以及用戶操作時，提供反饋信息，以便用戶了解進程並進行下一步決策
• 了解用戶喜好和需求優先順序，讓操作過程更順暢自然
• 利用留白及合理布局讓界面更加清晰易懂

植物澆水App，圖片來源：Tubik

用戶界面設計和體驗設計的差別

用戶界面設計和用戶體驗設計很容易混淆。雖然二者有重合之處，但是各自有截然不同的技能需求。

用戶體驗設計注重產品的全局架構和功能，以及用戶使用感受。相較於界面設計師來說，體驗設計師的工作集中在通過信息架構來組織內容；通過用戶調研、任務測試和商業分析進行方案決策。以電子商務的賬號創建和下單流程為例，體驗設計師使用用戶流程、體驗地圖、低保真線框圖和交互原型等方法，並通過用戶測試來驗證和優化設計理念。

Apple Watch 原型動畫，圖片來源：Alex Dovhyi

用戶界面設計與體驗設計的對比

界面並不是產品的真正解決方案。界面設計通常在體驗設計師的工作中占重頭戲，但並不是全部。你可以這樣理解：如果說用戶體驗是消耗品的話，那麼用戶界面就是工具（使用消耗品的工具）。

用戶體驗設計是包含很多個步驟的設計策略流程，其目標是創造產品具有吸引力、方便使用、易於理解的產品。通過用戶體驗設計這個流程，我們可以獲得正確的用戶界面解決方案。

用戶界面設計師做什麼？

用戶界面設計師在用戶體驗設計師提供的線框圖的基礎上，創造更加接近最終形式的產品界面方案。他們需要遵循體驗線框圖所表達的信息層級和優先順序，並將合理統一的視覺和交互規則運用於整個產品。

電商界面概念設計，圖片來源：Remco Bakker

用戶界面設計師的職責範圍包括視覺層級、構圖、間距、對其、標題和文字的視覺比重、組件使用規則（按鈕、表單等）以及配色規範和Logo。

由於現如今用戶界面越來越多的涉及到動態交互及過渡，而不限於簡單的靜態頁面，界面設計師也會需要與動效和交互設計師合作，並優化用戶體驗設計師所提供的基本交互理念。

用戶界面設計也包含數據可視化和信息設計的工作，這些能通過簡單的信息展示幫助用戶快速理解複雜的數據。

珠寶電商概念設計，圖片來源：Tubik

用戶界面設計師提供最終的頁面高保真原型給程序開發人員。上文提到用戶界面設計有時與用戶體驗設計有重合之處，其實它也可以涉及到前端開發，尤其可能參與建立前端組件庫、和頁面模板。

為了提高用戶體驗優化效率，我們的工作方式正在變得越來越成熟。因為當今世界的數字化進程，用戶界面設計扮演的角色愈發重要。在接下來的數十年里，用戶界面設計將突破二維屏幕，朝著3D和VR（虛擬現實）、AR（增強現實）和MR（混合現實）的方向演化。

無論技術、屏幕、場所和環境如何，界面設計的關注點都會堅持聚焦於人機交互與體驗的高效性。

推薦閱讀：