Nielsen總結的程序設計10宗罪

設計複雜的應用程序(包含桌面應用程序和web應用程序,手機app暫時沒有納入本文研討範圍)是一項具有挑戰性的任務。構建既能深入支持複雜任務又能直觀清楚地說明如何完成任務的應用程序是一個巨大的挑戰。在我們的網頁和應用程序設計課程中,我們花了一整天的時間在這個主題上,但是我們可以很容易就花掉一個月的時間來對用戶研究中遇到的問題進行分類。

我們很難就常見的應用程序設計問題提出一般性建議,因為我們觀察到的許多問題都是局限在特定領域的。11年前,當這篇文章的第1個版本出爐時,情況就是這樣,時至今日依然如此。

因此,我們的第1個建議是,與你的目標受眾一起進行用戶研究:

  • 從任務分析和情景研究開始,了解用戶的需求和工作流程。
  • 借助低保真原型,粗略搭建應用程序的基本結構和功能,無需花費大量資源來去實現那些在觀察用戶會隨時修改或放棄的想法。
  • 進行迭代設計,並讓少量用戶測試每一處迭代。迭代次數越多,應用程序就會越好。

儘管大多數應用程序的可用性問題都具有領域局限性,但在整個行業中我們經常看到這10個常見錯誤。其中有5個問題(#1、2、3、4和6)也在本文的原始第1版中,這也表明可用性指南的歷久彌新。原始第1版中的所有10條指南仍然是正確的,但有5個錯誤相比之前較少出現了(很幸運),它們被本文中的另外5個問題(#5、7、8、9和10)所取代。

下面是我們列出的應用程序設計的10宗罪(錯誤),這些錯誤都是極其嚴重和常見的。希望在未來的11年裡,當我們編寫這篇文章的下1個版本時,大多問題將不再普遍。

1. 糟糕的系統反饋

提高應用程序的可用性最基本的準則之一就是提供清晰的反饋:

  • 向用戶顯示系統的當前狀態
  • 告訴用戶,他們的指令和動作是如何被理解的
  • 告訴用戶發生了什麼

保持沉默的應用程序會讓用戶猜測,一般來說,他們都會猜錯。

好的反饋可以告訴用戶很多事情ーー例如,系統是否正確地將他們點擊的按鈕理解為“點擊” ,系統現在會做些什麼嗎?當前選擇或正在進行的活動是什麼?

體現反饋必要性的場景之一是,應用程序進入編輯模式來修改信息的情況。用戶必須明確當前哪些內容是可編輯的,因為不同應用程序在編輯模式的操作範圍上會有所不同ーー例如,一些應用程序會合併可編輯單個單元格或行的數據表,另一些應用程序則會使整個表可編輯。適當的、清晰的反饋可以向用戶傳達可編輯的範圍;好的反饋可以通過多種方式實現,例如使用不同背景來識別當前可編輯的區域,或是改變與編輯相關的按鈕樣式以明確其功能。

1.1 缺少進度條讓人抓狂

缺乏反饋的另一個情況是是系統沒有告知用戶當前操作需要很長時間才能完成。用戶通常認為營養程序已經崩潰,或者開始點擊其他目標。

如果指令無法在建議時間限度內得到響應,那麼就說出來,讓用戶通過進度指示器知道正在發生什麼:

  • 如果一個指令需要2到10秒,建議此時顯示一個等待動畫,比如“ 旋轉動效” 這種類型的進度指示器告訴用戶耐心等待,在正常狀態的光標返回之前不要點擊其他任何東西
  • 如果一個命令花費的時間超過10秒,那麼建議創建一個明確的進度條,最好是完成百分比指示器(除非你真的無法預測在操作完成之前還剩下多少工作)

2. 不一致

記住雙D原則:差別化對於用戶來說,是難度的提升(differences are difficult.)。當用戶對某些東西的行為方式或達成目標有所期望時,偏離這些期望就會導致困惑、沮喪,並增加用戶試圖解決問題時的認知負荷。人類的大腦渴望一致性。

有幾種類型的不一致在功能綜合的應用程序中特別常見,甚至會使經驗豐富的用戶完全陷入困惑:

  • 同一動作使用不同說法或命令
  • 多個地方放置相同功能的控件
  • 控件看起來彼此相似(從用戶視角) ,但是可以在不同的地方觸發(例如,一個在工具欄中,另一個在菜單中,第三個在首選項對話框中)
  • 操作流程相似,但頁面交互差異特別大
  • 數據輸入規則不一致: 有時允許輸入,有時則標記為無效,缺少比如“為什麼會發生這種情況”等的反饋
  • 某個功能是否可用飄忽不定,有時可用,有時卻因神秘原因不可用(並未告之用戶)
  • UI元素或控件四處移動,違背空間一致性

在我們的研究中,一位建築師有多年AutoCAD的使用經驗,她努力嘗試理解什麼情況下可以將各種浮動面板固定在屏幕的一邊,什麼情況下又不可以如此操作。在一次會議中,她多次嘗試讓一個浮動面板停靠在左側,但都沒有成功。原因是,由於隱藏參數設置,這個特定面板無法被固定,但是這個約束條件並沒有明確的告訴用戶。這個隱藏的設置是為了讓高級用戶能夠更好地定制界面佈局,但是由於缺少反饋,我們的這位調研對像不能理解為什麼面板的固定有時可行,有時不可行。這類不一致即便是經驗豐富的用戶也會感到沮喪的主要原因。

3. 糟糕的錯誤提示

錯誤提示是一種特殊的反饋形式:它們告訴用戶某些地方出錯了。“錯誤提示指南”已經出現將近30年了,但是仍然有許多應用程序違反了這些內容。

最常見的違反準則的情況是:錯誤提示僅僅告訴用戶當前發生了錯誤,而沒有解釋原因和修復方法。這樣的信息讓用戶束手無策。

這個問題在過去的幾年裡越來越嚴重,很大程度上是由於網頁版應用程序: 用戶被提示發生了一些問題。然後重試。接著是沒有詳細說明原因或如何修復的錯誤提示。至少過去的桌面應用程序曾經告訴人們問題是什麼(通常用技術術語說明,外行用戶很難弄清楚問題所在)。

4. 缺少默認值

默認值在諸多方面可以幫助用戶。最重要的是:

  • 如果默認值正好適用,用戶則無須鍵入特定值,進而提升操作效率
  • 提供了一個參考示例,可以指導用戶參照填寫
  • 讓新手的小白用戶在懵圈情況下接受默認配置,引導他們進行一個安全或通用的操作

默認值可以省去用戶在重複性任務中的大量操作,例如多次填寫同樣的表單。表單字段的確切關鍵值可以提高生產力並減少挫敗感。數據分析可以幫助你了解是否有特定內容可作為最常用選項。

下拉菜單是最需要添加默認設置並因此受益的。許多應用程序使用“請選擇” (根本沒有選擇任何有效選項值)作為默認選項,迫使每個用戶都必須點擊下拉菜單並選擇一個值。如果預先選擇一個選項(最好是最常見的選項) ,至少有些用戶根本不需要操作。

在填寫數字的表單中,如果用戶預期與默認值(例如,“數字” 字段)偏差較小,可以使用步進器控件來方便用戶調整數字而不是鍵盤輸入(但是仍然允許用戶通過鍵盤輸入不同的值)。步進程序有2個好處: 它們降低了操作成本,並為仍在學習系統的新用戶提供了一個可接受的起點。

5. 圖標缺少文字標籤

為了便於用戶更好理解,很少有圖標是單獨出現而不需要文字標籤(用於註釋)的。

即使是看起來通用的常見圖標(比如漢堡包菜單),對於用戶來說也不像大多數設計師所預期的那樣熟悉。如果你的應用程序使用了樣式獨特的圖標,情況會更糟,用戶很難正確理解這些獨特圖標的含義。請記住尼爾森定律: “用戶會把大部分時間花在其他網站上。 ”這意味著對於大多數圖標而言,除非它們旁邊帶有文本標籤(text label),否則用戶將很難或無法理解。

給圖標配上文字標籤有4個好處:

  • 增加了整個圖標的尺寸(根據菲茨定律,這樣可以減少用戶點擊控件所需的時間)
  • 與上一條相關,還可以促進界面熟悉(同一個命令建立多個關聯)
  • 幫助用戶在視覺上區分相鄰放置的多個命令

6. 難以識別並點擊的對象

在人機交互中,任何可以單擊(或點擊)的東西都稱為對象:所有“激活狀態(active)”的UI元素都是對象。用戶要捕獲對象,他們必須能夠:(1)識別對象;(2)準確地點擊它。在當下很多應用程序界面中,這兩方面都會出現問題。

6.1 弱指示符(Signifiers)

“示能”(Affordance,也稱作“功能可見性”)是指用戶可以對一個目標對象進行操作。例如,一個複選框可以開啟和關閉,而滑塊可以上下滑動。指示符是一種視覺元素,可以幫助用戶在使用之前通過觀察對象來理解示能(如果是一個物理設備而非屏幕上的UI元素,用戶還可以觸摸感受它)。這些概念在唐納德·諾曼的《設計心理學》一書中有所討論。(譯者註:門把手提供了一種『可被推開』的功能,是一種示能。門上貼有的“推”的標示,是一種指示符,明確地告知用戶該怎麼操作。)

指示符在UI設計中尤為重要,因為所有屏幕像素都是可以被點擊的,即使有時點擊後什麼也不會發生。屏幕上有太多可見信息,所以用戶沒有時間像玩掃雷遊戲一樣四處點擊,去找到一些可操作的東西。(例外: 小孩子有時喜歡四處點擊屏幕)

在現代應用中,最糟糕的設計之一是“超扁平化設計”。很多扁平化設計的指示符都很弱:人們很難區分文字和按鈕,因為按鈕缺乏慣有的3D立體痕跡。

弱指示符的常見“症狀”:

  • 用戶說:“我在這裡能做什麼? ”
  • 用戶並沒有靠近到那個能幫助他們的功能周圍
  • 試圖通過屏幕上的超長文本說明解決上述2個問題。(更糟糕的是,在用戶執行多個步驟的第一個操作之後冗長的操作說明就消失了。)

與此相關的問題是,當單擊一個尺寸過小的對象時,用戶很可能錯過目標的響應區域,甚至誤觸其他目標。即便用戶原本正確地理解了指示符,此時也很可能改變他們的想法,開始懷疑操作的可行性,因為他們發現點擊之後什麼也沒有發生。

(過小的點擊區域對於老年人和有運動技能障礙的用戶是一個需要特別關注的問題。)

7. 過度使用模態窗口

許多應用程序使用模態窗口來實現數據交互操,包括編輯當前數據項、添加新數據項、刪除或展示有關數據項的附加細節信息。模態窗口出現在當前界面的最上層,背景通常是灰度處理(變暗)的(這樣可以減少干擾,幫助用戶專注於當前的任務)。不幸的是,這種設計選擇遮擋了用戶在填寫表單時可能需要引用的信息,從而阻止了用戶對上下文的參考。(請注意,即使被遮擋的頁面不包含當前編輯所需的信息,用戶通常也會復制和粘貼先前鍵入的內容,或者簡單利用其它條目作為模板來解決當前的任務。)

8. 無意義的信息

長字符串的字母和數字,例如數據庫中自動生成的id,經常用於唯一性標記應用程序中的數據項。這些字符串對於用戶來說是完全沒有意義的,但是它們通常被非常顯眼地顯示為表格的第1列,迫使用戶不得不略過第1列來找尋他們所需的信息。雖然這些無意義的字符串在後端很重要,但並非用戶所必須參考的關鍵信息。特別是在高信息密度的頁面上,可以提供一些人們可讀的信息作為主要的展示內容,並把id放到一個不那麼突出的位置。

編碼信息經常被錯誤使用在醫療領域的應用程序、CRM系統(用戶經常需要為每一次的客戶銷售設定1個編碼)、會計軟件和企業級應用中。在所有這些應用程序中,對用戶有意義的信息都以短代碼進行展示,以使頁面佈局更加緊湊。一個短代碼可能比一個完整的句子更適合放在一個微小區域,但是會給用戶帶來更高的認知門檻。他們需要翻譯編碼信息以理解它們,而人類的記憶是有限的。即使是訓練有素的專業人員也不可能記住每一個代碼,而這仍然需要他們花費大量的精力在腦海中進行這種翻譯。

9. 存放垃圾功能的抽屜菜單(Junk-Drawer Menus)

如果應用程序有成百上千的功能,設計者必須把這些功能的控件放置在頁面上合理的位置,並基於優先級考慮對他們進行排序和分類,這樣用戶可以更容易地找到並點選最重要的功能。這種做法經常會導致菜單中會出現“更多”選項: 最常用的選項會直接顯示在主工具欄上,最後一個選項標記為“更多”(操作或工具),或者最糟糕的是…包含了所有其它不適合直接展示在工具欄的選項。

這些菜單的標籤指示性很弱,只有一個胡亂存放垃圾功能的抽屜:放置所有無法分類、但又不想捨棄的東西的地方。它們的出現通常是因為設計團隊有一些必備功能,但是又不知道放在哪裡更合適,或者是在迭代過程中,原有應用程序的一些不能刪去的、但很少使用的舊功能。“更多”菜單的問題在於,就像家裡堆放無用雜物的抽屜一樣,沒有人知道裡面可能放了什麼。換句話說,這限制了“更多”選項中包含的功能的可發現性和可查找性,因為大多數用戶沒有任何理由去主動查看這些菜單。

10. “取消/刪除/放棄”和“確認/保存”按鈕離得太近

將類似保存的操作放在諸如“取消/刪除/放棄”等破壞性操作旁邊,這是一個很常見的設計方式,但這會給用戶帶來很多麻煩。雖然從邏輯上講,這種擺放通常是有原因的(例如,保存和刪除是相關的,因為都決定了一個項目的結果) ,但這也容易讓用戶去點擊錯誤的按鈕或圖標——特別是當用戶在匆忙中、頻繁完成重複動作或有操作困難時。這種無意中用一個動作代替另一個動作的行為被稱為“手抖”。

總結

應用程序設計與其所屬的特定行業高度相關,因此,在領域A一個可用、高效和令人愉悅的應用程序在另一個領域B可能是個十足的災難。設計一個好用的應用程序離不開深度的用戶研究,用以確定用戶的任務流程、功能特性、以及目標用戶的認知模型和期望。

這裡列出的10個應用程序的設計錯誤代表了我們在一系列行業研究中觀察到的共性問題,涉及到創意、金融、企業、醫療保健、工程等領域。

https://www.nngroup.com/articles/top-10-application-design-mistakes/(2019.02.17)

版權聲明

1.本文版權歸:UXRen翻譯組所有;

2. 轉載須註明出處及譯者信息,並保留UXRen二維碼