如何設計出高完成度的人機介面 智慧應用 影音
Microchip Computex
ST Microsite

如何設計出高完成度的人機介面

  • DIGITIMES企劃

iPhone的成功,除了觸控螢幕與MEMS感測器,軟體讓人機介面發揮的親和力,也是大功臣。古榮豐攝
iPhone的成功,除了觸控螢幕與MEMS感測器,軟體讓人機介面發揮的親和力,也是大功臣。古榮豐攝

前言:人機介面的種類包羅萬象,面對不同的終端產品,人機介面自然不同,本篇主要探討IT產品的設計思維,基本上以軟體介面為主要的分析方向,因目前的IT產品為了講求人機介面的親和化,多半使用螢幕式的控制模式取代按鈕,加上iPhone成功帶起的觸控介面風潮,都讓IT產品的人機介面,好像少了「螢幕」即很難用,也讓其靈魂人機介面軟體的重要性更加凸顯。

本文:
目前最熱門的人機介面,在iPhone採用的多點觸控裝置帶起觸控旋風之後,大螢幕加上觸控的模式成了人機介面的當紅炸子雞,也帶起了相關硬體產業的發展,例如觸控螢幕面板,控制或驅動IC等。仔細分析,多點觸控螢幕的研究,大部分都在分析硬體方面,例如電阻式或電容式觸控的規格以及適合的螢幕,但同樣在多點式觸控的硬體到位之後,真正的決戰點是軟體,因使用者接觸的人機介面不是冰冷的IC規格,而是螢幕上看的見的符號。

MAC System 1.0。Apple

MAC System 1.0。Apple

Windows 1.0。Microsoft

Windows 1.0。Microsoft

實IPhone的成功,多點觸控的軟體設計亦無可否認的居功厥偉,如兩指捏緊或是張開表示網頁(或圖片等)的縮小與放大,讓許多使用者感覺相當好用,這種與硬體規格無關的軟實力,一直是蘋果(Apple)架構下的IT產品為人所津津樂道之觸,而蘋果確實也有下過苦工。

第1個MAC介面由來 實際體驗工作情境

蘋果在1980年代初期開始設計MAC人機介面時,採用的方式並不是閉門空想,而是實際找了超過100位會計師,利用錄影技術,錄下其上班時間的工作狀況。蘋果研究後發現,會計師們通常將未處理的資料放在右上方,左上方是處理過的資料;正中央的工作區右下方,還會放置垃圾桶,於是整個System 1.0的桌面與資料夾並整合成視窗等概念,就跟隨現實的需求形成。

這樣的概念看似容易,但比對同時代的Windows 1.0,就可以察覺由使用者觀點與工程師觀點設計出來的人機介面,結果會大不相同。其後推出的Window 3.1介面亦改用視窗化,足見蘋果觀察現實,再導出結論,是比較務實且先進的作法。

從善如流的微軟(Microsoft),在1995年推出Wondows95時,倒是把多年研究視窗化介面的心得,集結整理公布,很值得參考:
1、一致(Consistent):使用者可否以同樣的操作邏輯操作相同的動作?使用者是否獲得相似的視覺提示,且可以相同的輸入方式進入類似的操作環境。
2、可用(Usable):操作介面是否允許使用者,在不論簡單或複雜的狀況下皆可以合理的操作次數完成?降低操作者對棘手或曖昧輸入順序的排斥,藉以提昇效率。
3、可學習的(Learnable):每項操作是否簡單扼要,容易被記住?哪些指令的操作概念可以轉移到其他指令上。
4、直覺(Intuitive):介面是否夠簡單,而使使用者不需藉由使用手冊或特別訓練就能完全操作?這樣的層次是介面設計的最高境界。
5、可延伸(Extensible):因應硬體的快速發展,例如:新的輸入模式問世,介面是否能和它一同成長?相同地,新的使用範疇變得更受歡迎,原有的使用介面是否也能配合時代的轉變而更加精進?
6、有吸引力(Attractive):外觀看起來是否夠吸引人?外表醜陋或過時的畫面會減低使用效率。

日商SONY 也在1份報告中,提出了該公司的圖像化設計理念,亦可參考:
1、具系統化:依所需功能進行群組(Grouping),再依使用者的操作順序來排列圖像。
2、減少層次:大部份的功能,都可以從主畫面以下2層獲得。
3、限制對話框的項目:根據認知心理研究,通常每1張畫面設定7個選項,至多8個。
4、允許使用者回到上一個指令。
5、畫面不會自動消失:在任何情況下,畫面必須由使用者按下按鍵才會消失。
6、一貫性:整體須具有一致性。

整體而言,好的人機介面應該具有5個面相的完整性:
1、可學習性(Learnabililty):系統應該易於學習且讓使用者能很快開始使用此系統工作。
2、效率(Efficiency):系統應能有效的使用,使得使用者一旦學會了便可很快得到最高效能的表現。
3、可記憶性(Memorability):系統應易於記憶,務使間歇性使用者在離開此系統一段時間後,再回到這個系統時,不需再從頭學起。
4、錯誤率(Errors):系統應該有較低的錯誤率,讓使用者使用此系統時不會犯許多錯誤,即使犯錯也能輕易克服。另外,最好避免致命的錯誤發生,導致產生無法彌補的過錯。
5、滿意度(Satisfaction):系統應該使用起來很愉快,讓使用者使用時能對此系統感到滿意,增進使用的愉快感。

設計人性化的人機介面 人與人互動模式最準

人機介面設計可分為3個部分,思考工具、設計基本流程、以及最後的驗證流程,不過三者通常都建築在平常對於市場需求有不斷的探索,臨時抱佛腳的設計模式基本上行不通。
思考工具

1、應該要儘量具體化、生活化,不要使用太抽象的概念,儘量使用顯而易見的方式來表達資訊,甚至口語化、擬人化也未嘗不可。必須以使用者的角度及可能的生活經驗來觀看、模擬操作系統,避免以設計者自己的經驗來套用在使用者身上。

2、盡可能提供預期發生的狀況,以供挑選使用者挑選,或是在使用者操作的過程中,提供使用者多種預設的範例以供使用者模仿學習或是複製,在可以採用選項的地方儘量用選擇的方式來取代填空這種不特定答案的方式,例如有預設的範例來教導使用者填入正確的資訊。

3、以所見即所得 (WYSIWYG, What you see is what you get) 的方式來設計使用者操作的流程,使用者每一個操作動作都要顯示適當的回應 (feedback),讓使用者知道系統正在處理他的要求。對於熟悉者,也能夠提供巨集或快速鍵等模式,讓熟悉者有便捷性。

4、在各個子應用系統中,盡量保持人機介面的使用者界面一致,包括電腦系統表達資訊的方式、和使用者互動的動態關係、第一眼的印象,實際操作感等。

5、防止使用者發生錯誤,節省使用者操作的精力,以明顯的圖示,清楚的提示,適當的選項,適當的輔助說明及狀態說明來防止使用者發生錯誤;當使用者發生操作的錯誤時,必須允許使用者回復到前面正確的狀態去,應用系統本身以及人機介面在設計時必須考慮到回復的動作,不應該讓使用者自行擔負處理錯誤的後果。

6、盡量維持整體一致性的美感:這包括在使用各種媒體來呈現資訊時使用媒體本身的美感以及整體的和諧性,遵守最基本的要求,例如色彩的選擇,就應該避免互補不協調的色系來刺激使用者,在聲音的使用上也不要過度地使用嘈雜或是奇異的音效,就算要提醒使用者,也應仔細評估。

7、完整的說明文件是使用者選用此電腦系統的一個充分條件甚至撰寫良好的線上教材(online tutorial)可以迅速地讓使用者熟悉必要基本的操作,建立正確的心智模型。
 
設計流程
1、了解使用者本身以及他們使用之目的
設計人機介面系統的時候,第1件事就是要把這個系統的使用者刻劃出來,研究使用者的背景,沒有產品是真正老少咸宜的,人機介面亦然。接下來需要研究使用者使用這個系統到底為了什麼?等了解使用者的目的後,設計者需推敲出使用的時機、使用的環境以及互動的方式,例如:是不是有時間上的壓力;是不是用過1次以後就不會再用了,還是必須常常使用;是不是在嘈雜的環境下使用;是不是在有指導員的情況下使用;使用者希望1個指令1個動作還是希望盡量多給一些指示後1次操作等。

2、設定可用性(Usability)的目標
在了解使用者的使用目的以後,人機介面必須要想辦法來達成使用者的目的,設定適當的可用性目標,並在一些衝突性目標,例如讓使用者簡單操作,與能控制完整功能間,取得平衡點。

3、分析與設計
在設計人機界面時,我們要能夠根據使用者的目的來找出使用者可能的操作互動方式,把所有可能的操作一項項地列舉出來,分析這些操作是不是能夠達到使用者所希望達到的工作目的,再做了適當的分析工作之後,可以進入真正的設計階段。在這個階段如可能,一定要讓使用者反覆的測試設計出來的模型,因使用者的要求可能是不斷地在修改與調整的。讓使用者加入分析與設計的步驟,比較能迫使設計者真的以使用者為中心點來考量。

4、製作與測試
最主要是軟體應用系統的製作,包括程式、畫面配置、美工等。並測試製作的系統是否有滿足分析與設計所定義出來的各項目標。

5、評估
這一個階段最主要是由許多「不同的」使用者來實際測試看看這個軟體的功能性以及界面是否合乎要求,雖然在設計的階段希望使用者能夠加入來驗證設計者的構想,提供設計者一些意見,但是有時候使用者沒有看到實體的系統,沒有在正確的環境中操作,故使用者和設計者的思考誤差可能非常的大。

前述的問題也就反應出為什麼現在很流行快速雛型發展法(Fast Prototyping)的原因,使用者需要看到實體才能夠建立正確的使用模型。一個人機介面系統經過評鑑後,如果發現設計上的錯誤,可以儘速思考修改的辦法,也可以調整可用性指標來反應使用者的意見。

驗證流程 
1、系統狀態的能見度(Visibility of System Status):系統是不是能夠透過適時和適當的回應,讓使用者知道發生了什麼事。
2、系統設計應與現實世界一致:系統應該採用使用者熟悉的詞、句、或概念,而不是系統內部的詞句。
3、提供使用者控制與自由:是否完全讓使用者控制了整個介面的行為,是否有操作錯誤時的回復機制。
4、一致性與遵照標準:使用者應該不需要思考不同的訊號、狀況或動作,甚至介面上的字詞,是否會對系統產生不同的效果,應具有系統完整一致性。
5、預防使用者犯錯:一開始就預防使用者出錯比好的錯誤訊息更好,消除容易讓使用者搞錯的情境,或是提供確認鍵、讓使用者在執行前再度確認。
6、讓使用者辨識(Recognition)而非回想(Recall):利用標示清楚的按鈕、功能、選項減少使用者的記憶負擔,使用者不用記住從一個選項到另一個選項之間的資訊,操作系統的資訊應該顯而易見、或馬上可以找到。
7、人機介面使用的彈性與效率:例如提供快速鍵讓有經驗的老手可自行設定與使用,但可隱藏起來讓新手不會受影響,即是一種兼顧彈性與效率的介面設計方式。
8、介面的美術是否美觀順暢:一些基本原則,例如對話框中不應該包括不相關或是很少用到的資訊,因多餘的資訊和重要的資訊相互排擠,會讓使用者分心。
9、幫助使用者辨認、診斷甚至復原錯誤:錯誤訊息應該以白話文表達,而非機器語言;精準的指出錯誤,並提供解決方式。
10、有幫助及說明文件:即便人機介面已設計到不需說明文件即可操作,這類文件仍應備用。這類資訊撰寫模式應該易懂簡要,列出步驟、並放在介面上有明顯提示處。


關鍵字