2014 / 10 / 23
Home > UX Myths > 使用者經驗設計之迷思13:icon可以增強易用性

使用者經驗設計之迷思13:icon可以增強易用性

Myth #13:Icons enhance usability

許多研究顯示,icon很難記住且往往效能非常的差。微軟Outlook工具列是一個很好的例子:之前只有icon的工具列usability很差,即使改變icon和位置也沒有太大的幫助,有幫助的反而是在icon旁邊加上文字標籤。他們立即修復usability的問題,人們也開始使用的工具列。另一項研究中UIE團隊觀察,人們是記住按鈕的位置,而不是記住功能的圖形解釋。在大多數的項目中,icon很難正確的被識別也需要大量的測試。對於抽象的東西來說,icon很難做得很好。


關於有效的icon的研究結果和文章

  • UIE進行了兩個實驗來測試人們如何使用icon。首先,他們改變了工具列上icon的圖片,然後讓他們保持在同一個位置。人們很快就適應了這個變化。後來,他們保持了這個icon,但把位置打亂,這個變化讓參與者感到困惑,對他們來說也造成了問題。 – Orbitz Can’t Get A Date
  • Michael Zuschlag說,“icon違反直覺,你不一定能夠幫助使用者找到比單純只有文字標籤更好的選單(見 Wiedenbeck S 1999年的-在最終使用者應用程式的icon與標籤的使用:一個學習和保留的實證研究,行為與資訊科技,18(2),P68-82)。它不值得。“ 他也在UX Exchange討論他的看法。
  • 微軟Outlook工具列的故事:直到標籤被加到icon上,非專業用戶沒有使用工具列上的按鈕(除了“刪除”之外)。之後,“開始嘗試不同的修改:新的icon、重排icon、將icon放在選單下面。最後,一個修改徹底改變了:歸類工具列上重要的按鈕。工具列的點擊率立刻大增,且所有人都開始使用它們“ – The Importance Of Labels
  • The Problem With Icons的文章裡提供了一個很好的例子,到底多難猜到沒有文字標籤的icon的含義。
  • 37signals讚揚蘋果的MobileMe服務,改變了他們電源按鈕的“登出icon“,變成“登出文字標籤“。 – UI Sighting: Clear over clever on MobileMe
  •  Peter Steen Høgenhaug進行了一個測試,為了衡量人們如何理解一個CMS編輯器的icon。結果顯示:只有35%的使用者理解“插入連結“的icon,甚至是經典的“上一步”和“重做”icon也只有一半的使用者認識。

Icon的附加價值

  • 被大家普遍理解的icon有不錯的成效。(例如:列印、關閉、播放/暫停、重覆)。
  • icon可以當成bulletpoints來使用,來建構一個網頁。(例如:PDF、docs文件等)。
  • 好的icon可以讓網頁更賞心悅目。
UX Myth

出處:http://uxmyths.com/post/715009009/myth-icons-enhance-usability
UX Myths 授權悠識數位翻譯為中文。
轉載中文文章,請註明出處HPX Party http://www.hpx.tw 網站。


迷思4:「設計」就是讓網站變好看
迷思3:人們不滾動捲軸
迷思2:所有網頁應該要在三次點擊內到達
迷思1:人們閱讀網頁
.. 迷思0: 你讀了這些文章之後,就不用做使用者研究了 (正解:就算是看過這些研究報告,還是要自己做自己的使用者研究才對!)

看更多關於使用者經驗設計的迷思

About Uxmyths

UX Myths http://uxmyths.com 是 Zoltán Gócza 與 Zoltán Kollin 的文章。UX Myths 蒐集使用者研究資料,包括事實數據,還有來自知名設計師與專家們的名言與文章,揭穿網站設計上的常見誤解,目的是幫助介面設計者作為參考。 UX Myths 將許多使用者經驗研究整理出來,用來協助設計決策者當作參考,避免仰賴主觀的個人經驗來做判斷。建議你閱讀之後,還是應該做自己的使用者研究,檢視你的設計是否滿足使用者需求。 UX Myths 授權悠識數位翻譯為中文。 轉載中文文章,請註明出處 HPX http://www.hpx.tw 網站。

1則留言

留言

您的Email並不會被顯示出來。 * 星號為必填 *

*

你可以使用這些 HTML 標籤與屬性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>