SPARKFUL
죄송합니다. 이 페이지는 해당 언어로 번역이 되어 있지 않습니다. 열심히 노력 중이니 조금만 기다려주시면 감사하겠습니다!

Blog

Insights from the SPARKFUL x Fourdesire teams

逐步揭露資訊的設計原則

Wei-Fan Chenuser-interface-design
name

本文有大量圖檔遺失,我們正在努力恢復中了!

你一定有看過這種電視遙控器,開關、數字鍵、換台和音量按鍵放在顯而易見的地方,遙控器的下面還有一個蓋子,拉下蓋子之後可以看到更多不常用的按鍵:切換輸入頻道、修正顏色、修正對比等進階功能鍵。

逐步揭露的設計方法

這種遙控器都是採用逐步揭露(Progressive Disclosure)的設計方法,逐步的揭露不同程度的資訊,並且提供不同程度的控制範圍給使用者。當使用者是初學者的時候,他們只需要知道最簡單的功能(如遙控器上的換台、音量、開關等),而當他們慢慢上手,會用到的功能就會越來越多了。

因為下拉式的蓋子遮住了五花八門的功能按鍵,大量的減低了介面上的雜訊,也相對的減少了使用者的認知負擔,讓初學或一般的使用者只接觸到最常用的功能,便可以輕鬆的操作電視畫面。

當使用者需要更進一步的功能的時候,他就可以拉下蓋住進階功能的蓋子,揭露出更多的功能。此時使用者可以接觸到更多他們所需要的資訊,進行進階的功能操作:修正電視畫面的對比程度、調整畫面比例等等。

UI 的逐步揭露設計

逐步揭露這項技巧被廣泛的運用到許多圖形化的操作介面上,例如 Mac OS X 的錯誤問題報告:簡單的畫面僅告訴一般使用者發生錯誤必須關閉應用程式,並回報錯誤報告。若使用者點下顯示詳細資訊,介面則會提供問題詳細資訊和許多系統設定給進階的使用者或是系統開發人員。

此處的逐步揭露技巧可以巧妙的避免一般使用者看到一堆無法理解的系統資訊而茫然失措,而面對系統開發人員,則只要簡單的一個按鈕就可以獲得他們所需要的資訊。

另一個明顯的例子是軟體安裝精靈,軟體安裝精靈的每一個步驟都只顯示少量的選項,讓使用者可以在一定的範圍內選擇,追隨著精靈的腳步一步步的完成安裝步驟。每一次揭露給使用者的資訊都只會消耗少量的使用者認知,增加安裝過程的流暢性。

同時配合老手與新手

設計使用者介面的時候要小心的將使用者分群,對不同的使用者揭露不同程度的資訊。或採用一步步揭露的方式減少使用者的認知負擔,將會大幅的提升介面的可用性。

對於初階的使用者來說,簡單的介面選項較少,資訊容易吸收,也讓他們更容易操作。透過精靈也可以一步步的帶領他們完成一個複雜的任務。但對進階的使用者來說,進階功能也要容易取得。精靈的多步驟對高階使用來說可能會覺得囉嗦且麻煩,應該要小心使用。


Reference

Photo by Foxunno on Unsplash

Wei-Fan Chen
Wei-Fan Chen
CEO / SPARKFUL and Fourdesire
喜歡開發與創作各種有意義且有目的的遊戲以改變社會。 《玩心設計》作者、偶爾寫部落客與擔任講師。樂於參與大學和行業活動,興趣涵蓋遊戲設計、遊戲理論、行為設計、人機介面和交互設計。熱衷於雲端運算,同時也是一個活躍的獨立遊戲開發者 🎉
divider
Related Posts
name

電影色彩學:這些經典電影如何運用「色彩」引導觀眾情緒

電影裡的弦外之音無論是電影、圖畫或任何形式的創作中,「色彩」都是非常基本且重要的元素。好的色彩運用可以讓人一眼看出創作者想表達的情緒。因此,如何恰當的運用色彩是一項相當重要的課題。平常在看電影的時候,除了關心劇情,也可以...Read more
name

藏於字句間的創作:產品中的在地化翻譯

產品辛苦開發了,但要吸引其他語言使用者的使用,並不是那麼簡單的一件事。即使產品已經在某個國家(例如台灣)有了足夠的使用者數量,也不是翻譯成日文,就會憑空冒出許多日本的使用者。網路是連結的,但社群不是許多人...Read more
name

視差設計:如何在狹小的手機畫面中製造「空間感」

在行動裝置小小的平面螢幕裡,無論是平面風格(Flat Design)還是仿真介面(Skeuomorphism),我們是否能夠在手指滑動之間,跳脫出二維的空間,為使用者創造出額外的層次與空間感呢?也許以下影片能夠給你一些想法: ...Read more