Pages

08/11/2018

computer science - 10 heuristic of usability testing



杜芬宅 較早時侯完成了一篇 約4千字的 論文,大學所有功課都冠以 paper, article, essay。
所以不要以為杜芬宅很厲害,只是那聽起來比較威猛一點。

分享一下



背景

杜芬宅不是讀博士學位,那篇 論文(essay)不是論文(thesis),也未到達 畢業論文(dissertation)的程度。
不過也消耗了杜芬宅一點心血,拿來分享一下。

承上一篇,
網頁前端的解決方案
computer science web client solution

當中有一項關於HCI 的考慮,人機互動 (Human-Computer Interaction) 是一個科學範疇,當中涉及很多其它的科學領域,透過一系列的方法,檢視人類反應回饋,為互動系統的設計、實施、評估 帶來貢獻。

包含的專業領域︰
  • Computer Science
  • Engineering
  • Ergonomics 人體工學
  • Graphic design
  • Linguistics, artificial intelligence 語言學,人工智能
  • Psychology 心理學
  • Sociology 社會學
  • Anthropology 人類學

那些杜芬宅都不會說,如果教授告訴大家︰要讀 HCI 那個科目先要讀其它10科。
那到下下下下下下下年也不可以畢業,
杜芬宅會直接離開演講室,今天的天氣真好,做什麼好呢 的發展。

所以今天集中說 Computer Science 中的 Human-Computer Interaction 中的 Usability 中的 評估方法中的 10 Heuristic。

什麼是 Usability

杜芬宅比較討厭在那些關節位用中文,那什麼中文翻譯因地區而異,

Usability 的定義︰
The extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use
杜芬宅中譯︰
一項產品能被指定用戶群,有效地、有效率地、滿意的達成指定目標

杜芬宅 顯淺的理解是 使用者 對系統功能容易上手,易學,易記,易用,沒有不安的體驗。
那便足以稱系統的 Usability 達到一個令人滿意的水平。

當然你會問,每人的定義不同,他用起來沒有不滿,我用起來超不滿。
那按鈕,那文字表達很差,那麼多步驟……

沒錯,好像杜芬宅那種感性又理性,但是非常敏感又纖細的動物,很高興有您明白。
看見一些未曾使用的系統 或 被迫經常使用的系統 都想一個鐵鎚 把它破壞,或是抓相關的持份者出來用砂紙幫他洗臉,咳,杜芬宅 因為反對暴力所以沒有做😁

所以 Usability 有部份理論建立在 統計學上,10個人9人說很滿意,總結這項設計就是符合 Usability。

那些理論的部份,當然不是杜芬宅做,也沒有錢做,歡迎 讚助訂閱 鼓勵創作更多文章、音樂……

Usability Evaluation


那三位是在 HCI 打滾多年的學者,他們都為 Usability Evaluation 發表過 理論及出版過書籍,今次杜芬宅就選用了 Nielsen 學者的 Ten Heuristic。

那三種方法沒有最好,它們都是權威人士,杜芬宅 初步了解過 三種,可能是杜芬宅的感性發作,特別喜愛 Ten Heuristic。

Ten Heuristic

杜芬宅在資料搜集發現很少很少,少得可憐的中文資源。
杜芬宅患了看見英文敏感的病,看見英文便頭暈啦,辛苦了當時的杜芬宅。

順手翻譯一下,可能對你也在找相關資料有用,
不保證有專業翻譯水平,因為杜芬宅中文不好
但原文是英文,對呢,杜芬宅的英文也不好

所以杜芬宅已努力的減少 理解的偏差 和 翻譯的偏差

1.Visibility of system status

The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
直譯是︰
系統應維持可以令使用者明確了解現在狀況,在一個合理的反應時間內給予使用者回應

2. Match between system and the real world

The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
直譯是︰系統說使用者說的語言
意思是︰系統應該可以被使用者理解,不論是透過語言、文字、用語、概念,都應該是使用所熟悉的,而不是技術性專有名詞。可以參照現實,符合自然和有邏輯地顯示關聯訊息。

解說完好似更複雜,補充一下
實例︰資源回收筒 使用 垃圾筒 圖示 作為代表,使用者很容易聯想到 刪除的東西會移到資源回收筒,在資源回收筒 可以找到過往被刪除的東西。
不應該︰不要在系統使用潮流用語,系統『說』大家明白的語言
你不會想看到錯誤訊息是︰發生了 嚇到吃手手 的狀況,你決定
然後按鈕是︰[我不要不要嚇到吃手手的] [我不在乎]

3.User control and freedom

Users often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.

使用者經常在使用過程中出錯,他們需要一個"緊急出口"去結束現狀,而不需要透過一連串
額外的操作。請支援 上一步 和 下一步。

4.Consistency and standards

Users should not have to wonder whether different words, situations, or actions mean the same thing.

直譯是︰使用者不需猜測不同關鐽字的意思和作用,而那些關鐽字最後可能代表同一樣事物。
意思是︰系統需要灌切執行一個標準,達致統一

5.Error prevention

Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

直譯是︰
與期提供一個能準確描述錯誤的訊息,反而應該設計成避免錯誤發生。
在使用者執行任一動作前
應該 消除易於發生錯誤的因素 或 檢查和要求使用者確認
意思是︰
與期提供一個能準確描述錯誤的訊息,不如在源頭堵截不要讓錯誤發生

6.Recognition rather than recall

Minimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

直譯是︰
透過製作物件、動作、可見的選項,最大減少使用者的記憶負荷。
使用者應該不需要在一個位置記下資訊,再在另一個位置使用。
系統的使用指引應該是 可見的或容易獲得。
意思是︰
人類對Recall memory (回憶)較困難,例如他們在系統什麼位置,如何進入到那個位置
Recognition memory 是一種能力可以辨別之前體驗過的事物。當舊的經歷再體驗時,較容易喚醒記憶。

杜芬宅字典,當中寫道︰
使用者是愚者,
杜芬宅都是愚者
不要讓杜芬宅記憶太多步驟才可達成一個動作,好節省內存空間。

7.Flexibility and efficiency of use

Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.
直譯是︰
加速器,新手看不到,老手才知道
老手可以加快完成系統工序
系統可以同時滿足缺乏經驗和有經驗的使用者。
充許使用者 自訂通常用的功能
意思是︰
為經驗使用者提供彈性和增加效率的功能,令他們更快地完成系統工作。

8.Aesthetic and minimalist design

Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.
直譯是︰
系統對話不應包含"額外資訊",即是很少用途的資訊,甚至沒有用途的資訊。
假如一段有意義的訊息中包含"額外資訊",都會減少使用者對兩者的關注
意思是︰
不要顯示一樣意義不明或無關重要的訊息,緊記訊息的對象是使用者。
訊息需要帶出什麼給使用者,需要簡單直接。

9.Help users recognise, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.
直譯是︰
錯誤訊息應該要簡潔簡明(不要顯示程式碼),準確的指出問題並提供建設性的解決方法。

10.Help and documentation

Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.
直譯是︰
即使是最好的系統,可以不需要說明文件也懂得使用。也應該必需提供協助文件和使用說明。那些資訊應當容易搜尋,對照使用者的工作,列出具體步驟,也不宜過長。

當然啦,以上十項,不可以搬字過紙。
因為大學會使用很可怕的 turnitin系統,
turnitin 會比較網絡上的資源,學生提交的論文,找出抄襲的成份。
計算出有多少%是抄襲的/重覆的,%愈高愈易容觸發支線劇情。

有些教授會先開忠明義地定立規則︰

  • 高於15%的不給甲/拿不到A
  • 高於20%的請重交
  • 高於30%的請重交附加分數8折效果
  • 高於40%視該作業為0分

未打 BOSS先中毒就不好了。

Software Evaluation

好了,進入正題,教授要求大家應用Usability Evaluation。
對任何軟件作出評估、再設計進行優化、辯解 (justification)
P.S 杜芬宅不知道 Justification 在此是不是譯辯解(逃...)

最基本是找個網站作對象就可以。
但那感覺超無聊的,隨便找一個網站,那個網站又未必有齊那10個致命傷(雖然很難)。
網站按照不同的種類也會有各自的較好和較差,杜芬宅認為較難掌握那個標準。
一個網站的好壞很有可能地視乎網站所提供的服務和所在的界別。

杜芬宅 剛好認識一套化石(被踢),一套有點歷史的系統 做實例。

它本來是那個樣子的

Redesign Options

杜芬宅 概括出 12個 重新設計的點子,分別各自解決19個不同問題。

然後製作一個介乎 medium fidelity prototyping 至 high fidelity prototyping
的模型。





Justification and Evaluation Summary

將 12個 重新設計項目歸納成三類




各自分折三類的利與弊,按照現況,甚於一些假設估算成本。
最後得出結論,建議下一步的行動。

內容就不便披露

題外話

HCI 不只可應用在軟件介面上,其它需要與人互動的也適用。
舉列是機票,剛剛隨便看到的例子 - 登機證
https://icons8.com/articles/redesigning-boarding-pass-again/

HCI 治療前 和  治療後的分別

  • 刪除了很多不必要的資訊
    那些細字 杜芬宅不會去看,也不想去看 (親)
  • 重要的資訊都清楚簡明,並且將關鍵的都粗體了
  • 分為三欄可以理解到時序,閱讀的順序由左至右

第一欄的資訊是

飛機編號和目的地
登機大機 2座

第二欄的資訊是

登機時間
登機閘口
登機優先權

第三欄的資訊是

座位
走到座位的示意圖
起飛時間



杜芬宅發現對那些真的很敏感,未往下看內文已感受到 治療後的分別,
可能是嗅到了治療後的美麗,看見治療後的它,那可能就是愛 (杜芬宅發情中……)



那也是為什麼, UI/UX Designer 和 Software Develop / Web Programmer 會水火不容。

試想下

單是實現那個走到座位的示意圖,
首先你需要飛機內座位的位置圖,當然不是一架飛機,是很多很多架飛機
然後你的程式要很有智慧地根據座位生成一張有點差別的示意圖。

單是想到那裡,如果杜芬宅是那名 IT狗 已經嚇到吃手手。

會UX會Code 的進階物種 就是一條龍服務的 Full Stack Developer

那外國傳來的神概念,要成為神話的代價可能是獻出肝臟
因為一樣貼心到不要不要的UX設計,會令程序猿生不如死。


Reference

[1] Randolph G. Bias and Deborah J. Mayhew, “Cost Justifying Usability - read.pudn.com,” 2015. [Online]. Available: read.pudn.com/downloads142/ebook/616237/Cost-Justifying-Usability.pdf. [Accessed: 04-Nov-2017].
[2] J. Nielsen, Usability engineering. Amsterdam: Morgan Kaufmann, 2009. [Accessed: 04-Nov-2017].
[3] Shneiderman, B., Plaisant, C., Cohen, M., Jacobs, S., and Elmqvist, N., “The Eight Golden Rules of Interface Design,” Ben Shneiderman. [Online]. Available: https://www.cs.umd.edu/users/ben/goldenrules.html. [Accessed: 04-Nov-2017].
[4] Ordinances Administered, 24-Feb-2017. [Online]. Available: http://www.ird.gov.hk/eng/abo/ord.htm. [Accessed: 19-Nov-2017].
[5] Completing and submitting your employer's return and notification forms, 19-Sep-2017. [Online]. Available: http://www.ird.gov.hk/eng/tax/ere.htm#a02. [Accessed: 19-Nov-2017].
[6] ORSO, 12-Jul-2017. [Online]. Available: http://www.mpfa.org.hk/eng/orso/. [Accessed: 19-Nov-2017].
[7]  MPF System, 30-Oct-2014. [Online]. Available: http://www.mpfa.org.hk/eng/mpf_system/. [Accessed: 19-Nov-2017].
[8] Labour Department - Employee Rights and Benefits. [Online]. Available: http://www.labour.gov.hk/eng/news/mwo.htm. [Accessed: 19-Nov-2017].
[9] G. A. Miller, The magical number seven, plus or minus two some limits on our capacity for processing information. Washington, D.C.: American Psychological Assoc., 1994.
[10] D. J. Mayhew, R. G. Bias, and R., Cost-justifying Usability: An Update for an Internet Age. Morgan Kaufmann Publishers, 2005.
[11] Karat, C.-M.: A Business Case Approach to Usability Cost Justification. In: Bias, R.,
Mayhew, D. (eds.) Cost-Justifying Usability, pp. 45–70. Academic Press, London (1994)
[12] M. Q. Patton, Qualitative evaluation methods. Beverly Hills: Sage Publications, 1980.
[13] CLINICAL AND TRANSLATIONAL SCIENCE AWARDS CONSORTIUM, et al. Principles of community engagement. Rockville, MD: US Gov. Printing Office, 2011.
[14] Staff, “Turnover Rate and Vacancy Rate (1st half of 2017),” HKIHRM. [Online]. Available: http://www.hkihrm.org/index.php/mb/members-area/hr-statistics/manpower-trend-manpower-change-turnover-rate-vacancy-rate/569-s/mb/member/hr-statistics/manpower-trend-manpower-change-turnover-rate-vacancy-rate/2182-turnover-rate-and-vacancy-rate-1st-half-of-201-en. [Accessed: 28-Nov-2017].

No comments:

Post a Comment