複雜UI界麵的8個核心設計法則

複雜應用大多情況下是偏專業和B端的一些UI界麵，它們大多出現在桌麵端使用環境，並且終端用戶類型多樣，涉及流程、鏈條、業務也大多呈現出多變複雜的特征。今天就跟大家分享下複雜UI界麵的8個核心設計法則！這篇文章，來自UX設計領域的頂級存在NNGroup，作者為凱特·卡普蘭。

到底什麼是複雜應用？

我們之前將「複雜應用」界定為特定專業領域當中，需要經過廣泛培訓之後使用的，有著非結構化目標、非線性工作流程的任何應用程序。這個概念可能聽起來有點抽象，不過這麼說你可能會 更容易理解：從科學研究到專業人員，諸如金融分析師，它們常用的那些專業軟件應用。這類應用通常有著這些特點：

為有專業知識和訓練有素的用戶提供支持

幫助用戶瀏覽、管理大型數據庫，並提供高級的數據分析和處理的功能

通過可變和多樣的基礎任務功能來解決問題或者達成目標

需要在多個角色、工具、平台之間進行協作或者切換

可以用來減輕高影響力/高價值任務的風險，降低損失

盡管不同的複雜應用之間差異很大，但是他們的共同點是，專業的從業人員對於這類工具有著極強的依賴性。

考慮到設計師和開發者在麵對這類工具的時候的挑戰，我梳理總結了 8 個複雜應用的設計原則和指南。

1、采用邊做邊學的用戶流程

很多研究表明，對於複雜的應用和工具，用戶更加青睞可以立刻上手開始使用而不受它複雜度影響的那類工具。

與大量的教程、文檔、幫助和設置說明相比，能夠立刻開始的任務和項目，對於用戶有著莫大的吸引力。這種現象被稱為「活躍用戶悖論」。

雖然在專業領域當中，倚靠摸索和試錯學習是不恰當也不安全的，但是一定程度的邊做邊學是必須的，因為不可能在培訓和手冊當中涵蓋所有的使用場景。

所以，在設計的時候應該提供「跳過教程」的直接上手的偏好設置，同時進行相應的安全性設置，避免新手的莽撞操作導致損失。比如可以限製這個階段的用戶執行長流程多任務的操作，讓控製麵板實時顯示操作結果或者預覽結果，這樣用戶無需執行全部操作就可以知道大概的結果。

在 Salesforce 控製麵板當中，就可以實時預覽麵板編輯的效果。

2、為用戶提供有效的方法和建議

絕大多數用戶都不是進階的專家級用戶，他們在絕大多數時候會使用基礎但是效率沒那麼高的操作和執行方案。很多用戶形成習慣之後，通常不會主動做出改變，而這在日積月累之後導致大量的時間浪費，效率低下。

值得一提的是，這個時候依賴冗長的文檔和教程其實很難達成效果，更合理的方式是結合用戶所處的上下文環境，通過界麵工具提示的方式，適時地告知用戶「有更高效方便的方法」。

通常，可以使用懸停提示，或者是彈出式工具提示來實現這一功能。

ArcMap 是一款地理信息係統類工具，它通常會通過上下文環境下的信息引導，來幫助用戶了解技巧。

3、提供靈活而流暢的功能路徑

複雜的應用程序，通常會有很多功能是分散的而非線性的，不同的功能組合起來可以實現特定的功能。在這類工具當中，用戶日常可能也不是很確切知道最終的目標是什麼，而需要通過數據分析來逐步推進，同時，在知道確切目標的情況下，也應該可以遵循不同的路徑靈活地達成目標。

設計師這些應用的時候，設計師應該避免使用固定、唯一、 僵化的實現路徑，迫使用戶必循嚴格按照某一固定路徑來做事情。一方麵，允許用戶跳過某個步驟，或者回滾到更早的路徑，另一方麵，允許用戶遵循不同的方式和路徑來達成目標。

比如萬事達卡的自助服務就可以通過交互式的圖表來引導用戶完成不同的任務。

4、 幫助用戶跟蹤行為和思考過程

複雜的任務，通常意味著它需要很多步驟，不同的環節，而在實際的應用場景中，某個分析步驟耗費幾個小時甚至幾天，都是有可能的。在高度複雜的現實生活中，某個步驟可能會換人接手，可能會因為硬件、 網絡等問題而暫停甚至丟失，這也意味著「可追溯性」是很重要的。

所以，在這樣的複雜應用當中，應該允許用戶在使用過程中，可以便捷清晰地記錄、保存、 導出內容和記錄，允許用戶中斷，中斷後可以恢複特定的任務。在任務進行過程中可以進行注釋、保存相關的說明。

在決策建模軟件TreeAge 當中，用戶可以在分析和建模過程中進行開放式的注釋，可以後續在底部快速訪問這些筆記。

5、可以協調多工具並且在工作空間之間轉換

複雜的應用通常還會麵臨一個狀況，就是工具本身的不足，用戶需要在多個工作空間上使用工具和內容的時候，它需要具備切換的功能。對於不具備的功能，應用程序應該允許使用第三方的應用來作為補充。

比如當軟件不支持某個操作的時候，應該允許用戶從線上的其他數據庫中獲取並導出數據來使用，可以依托外部文檔作為支持，允許用戶在應用中做注釋和評論。

減輕工作負擔的一個要點，是盡量使用通用的API、接口和標準，盡量兼容行業標準軟件，比如 Excel、Powerpoint ，盡量使用標準格式，等等。

微軟的商業分析軟件 PowerBI 就提供了標準化的導出和複製功能，非常方便

6、減少混亂而不影響功能

複雜應用通常旨在保持泛用性。使用場景多樣，多種不同的功能，一家汽車生產廠家，可能會和蜜蜂養殖機構采用同樣的工具和軟件來監測機器故障。但是，這種泛用性的另外一麵，就是混亂性。複雜的應用可能會同時兼顧到基礎型的小白用戶和進階型的專家用戶，而後者用到的功能很小概率會被基礎用戶用到。

所以，設計者需要在不降低功能性的情況下，基於應用場景、 用戶需求來進行簡化和優化，在保持功能完整易用的前提之下，降低複雜度和混亂度。

分階段和層級展現就是一種降低混亂度但是不影響功能性的一種常見策略。當用戶進行到特定任務、特定階段、特等級別之後，再呈現特定功能，是有效的設計方法。

7、主次信息之間要能平穩過渡

即使降低了混亂度，在複雜應用當中，信息量可能依然是過載的。通常，對於這種情況可以通過區分信息層級的主次來進行快速的區分，不過，從交互上來說，這可能依然不夠。

對於諸如控製麵板一樣的界麵，用戶可能需要時刻查看麵板上的信息，需要了解次級信息但是又不能離開界麵，這就體現出主次信息之間的過渡呈現的重要性了。

一般而言，使用類似與懸停顯示的方式，能夠比較柔和地將次級信息呈現出來，允許用戶查看詳細的定量數據。下麵這個案例當中就是，懸停顯示更多次級信息。

8、在視覺上突出關鍵信息

複雜應用通常在界麵上包含由大量的信息，而這個時候關鍵性的數據如果不在視覺上做突出顯示，會被用戶錯過。通過視覺區分、提示警報的方式，讓用戶及時注意到，才有可能規避可能存在的問題。

值得注意的是，讓關鍵信息和元素凸顯的方式，並不一定非得是使用鮮豔的色彩和較粗的字體，簡單的放大呈現，使用圖形化的元素輔助提示，或者是提供足夠的留白都可以達到目的，就像下麵的案例一樣：

結論

複雜的應用多種多樣，支持的服務和功能也千差萬別，但是無論如何呈現，此類複雜應用的設計都是非常挑戰設計師的設計功底的，需要設計師了解業務，了解用戶，並且能夠通過設計更好地提供服務。