跨世代的設計需要同理心與換位思考

照片中有兩個遙控器,上面的電視遙控器有很多實體按鍵,下面的Apple TV遙控器上面只有六個實體按鍵,操作時要搭配電視螢幕中出現的虛擬按鍵

想像一款全新、有螢幕的3C產品,同時交到一個學齡前小朋友、一個年輕人和一個老人家手中,大家會分別做些什麼?

學齡前的孩子,可能理所當然就伸手滑開螢幕。年輕人可能會在打開螢幕後開始尋找虛擬按鍵,老人家則是想先弄清楚實體按鍵在哪裡。不同世代從小接觸的事物不同,在使用工具時的直覺反應和習慣也不一樣。

面對一個新產品,不同人的認知與學習能力多少都會有差異。如果一項設計與服務想要讓各個世代的人都能夠輕鬆使用,就不能忽略這些習慣與背景。

小朋友正用手指滑動手機螢幕
現在的學齡前兒童看到有螢幕的3C產品,多會直接用手指滑滑看。

在現今社會,擁有「跨領域」專業常是許多企業尋找人才的加分條件,經營「斜槓」人生也成為許多人追求的目標。有些人大學選唸工程,碩士改讀設計,有些人文背景出身的人,則是嘗試進入科技業工作。不論是透過求學或工作環境,選擇一路都在同個領域鑽研或就業的人相較從前,確實比較少了。跨領域的好處很多,可以從比較多角度去思考,產生創意或解決問題的能力也可能有所提升。

淺顯易懂方能傳遞,善用比喻較好溝通

在現今社會,擁有「跨領域」專業是許多企業尋找人才的加分條件,經營斜槓人生也成為許多人追求的目標。有些人大學選唸工程,碩士改讀設計,有些人文背景出身的人,則是嘗試進入科技業工作。不論是透過求學或工作環境,選擇一路都在同個領域鑽研或就業的人相較從前,確實比較少了。跨領域的好處很多,可以從比較多角度去思考,產生創意或解決問題的能力也可能有所提升。

知識和技能的傳遞,對於能理解不同世代與不同背景的人也很重要。而各種知識要能傳遞與累積,各項專業要能傳承與創新,首要條件都是要「淺顯易懂」。唯有讓學習的門檻降低,才能提升學習者的信心。另外,透過日常生活的共同經驗作比喻也是一種比較容易「溝通」或「說明」的方式。

舉例來說,在網站開發的領域,有一個專有名詞:響應式網頁設計(RWD,Responsive Web Design)和自適應網頁設計(AWD,Adaptive Web Design )。很多人可能分不清楚兩者的差異。就算能google找出兩者的定義與說明,可能還是一知半解。這時候,具備網頁設計專業的人若能善用比喻,就比較容易讓非專業者理解。以下是兩者的定義與朋友提供的說明,大家不妨比較一下,就能感受到運用生活經驗做說明的好處。

定義:響應式網頁設計(RWD)是可以讓網頁自動適當顯示於各種不同裝置,包括桌機、手機與平板等。自適應網頁設計(AWD)是針對不同裝置分別給予不同的網頁呈現。

朋友:響應式網頁設計(RWD)是單純針對不同的畫面寬度都可以適當的呈現。自適應網頁設計(AWD)則是除了針對不同畫面寬度,還可以針對什麼樣的設備,給予更適當的呈現,像iOS跟Android設備,縱使畫面一樣寬,也可能針對設備的特性,給予不一樣的呈現與體驗。

同理心與換位思考是理解對方的開始

要理解不同世代的人,不是等自己到了那個年紀,要了解不同知識背景的人,也不是一定得去旁聽各個科系、從事各行各業。透過細微的觀察與訪談,還是有機會了解不同領域與族群的想法與經驗。不論是跨世代或跨領域的理解,最基本的態度是要先有同理心,並以「換位思考」的方式,從對方的角度去思考,才能更貼近其想法。關於換位思考的部分,也可參考〈想改變對方要先換位思考〉一文。

原始來源:天下獨立評論 余虹儀專欄 「設計如何跨世代?同理心與換位思考,是理解的開始

此文正式取得「獨立評論@天下」授權刊登

相關閱讀:〈不同使用族群模擬體驗〉、〈「讓大家都可以用」很重要

介面設計應如何設定目標族群?

雅典地鐵自助購票系統結帳頁面會有歐元幣值與實際鈔票、硬幣的影像,讓外國人方便對照與理解

不久之前,我帶了一場「通用使用性介面設計工作坊」,讓學員練習簡化便利商店自助系統的「買火車票」流程,看是要刪減,或將兩個以上的步驟整併都可以。

成果報告時,有一組學員說要把「車次購票」的步驟刪掉,保留時段購票就好了,他認為根本沒有什麼人記得車次號碼,保留這個選項等於多此一舉。然而,另一位學員卻舉起手說,他都是記車次號碼而購票的!

又有一組學員,說要把本國人和外國人的選擇頁面刪掉,反正本國人就是輸入身分證字號、外國人就是輸入護照號碼,直接用輸入的號碼判斷就好了不是嗎?但另一組學員中剛好有位外籍人士,他提出除了護照號碼,也可以輸入居留證號碼喔!大家瞬間覺得使用者種類真的很多,需求差異也很大。

以使用需求進行使用族群的分類

很多時候,設計師或開發人員設定的「目標使用族群」可能不夠廣泛,也造成在設計系統的時候,忽略了少數人的需求。舉個例,如果請你想像「學校網站」的目標使用族群,大家可能很容易想到「教職員」、「在校學生」、「校友」和「訪客」,但如果是電商網站、交通購票系統、醫院自助掛號批價繳費呢?你能想出幾種不同的使用者?

類似這種可能有五花八門不同身分使用者的介面,可能很難用同一標準區分使用族群。這時,改由使用需求或使用者經驗進行分類,就比較容易切入了。

回到前面的例子,以「車次」購票或「時段」購票的兩種人,前者可謂「熟練使用者」或「專家」,後者比較是「偶爾使用者」或「新手」。這兩種使用者,就是通用使用性(Universal usability)所提到的,要顧及不同的「使用者知識差距」。因此,我們可以設計捷徑給熟練使用者或專家,讓他們能更快完成手續、不須過多引導。有些購票系統設有「快速購票」選項,就是一種捷徑。

而「本國人」與「外國人」有不同的身份識別資料要輸入,這兩種人則是通用使用性中提到的「使用者多樣性」。不同年齡、不同行為能力、不同國家和不同使用情境等等,都在這個範疇內。因此,公共操作系統最好可以提供多語言的操作介面,甚至透過國旗、紙鈔和硬幣等具體圖像搭配,讓外國人更容易理解。

任何介面的設計師或開發人員在設定目標族群時,不能只用年齡去評估,更不能只考量初次使用者,也要為熟練使用者提供更進階、有效率的服務,才有機會加強客戶黏著度。另外,使用者習慣或仰賴的操作需求不能隨意刪除,甚至要意識到使用者需求有可能會改變,例如因為操作類似介面的經驗增加,而變成專家使用者,或是因疫情關係,一些習慣實體店面購物的人也開始嘗試線上購物,他們就不再是毫無網購經驗的人了。這些都是在設計操作介面時可以考慮進去的。

原始來源:天下獨立評論 余虹儀專欄 「「簡化流程」不簡單!自動操作系統背後的人性需求

此文正式取得「獨立評論@天下」授權刊登

相關閱讀:〈通用使用性介面設計工作坊〉、〈介面設計應考量通用使用性〉、〈自助操作系統應滿足新手與熟手的需求〉、〈通用介面同時滿足新手與熟手

複雜介面的選項與流程應簡化或分類

KTV點歌介面非常複雜

回想一下,你第一次去KTV唱歌的時候,看著複雜的點歌機介面,花了多久的時間才學會怎麼操作?學會之後,最常使用的功能是什麼?有沒有哪個功能,到現在都還沒用過?如果去到別家KTV,是覺得系統類似駕輕就熟,還是又要再學一次哪個功能該從哪裡進去、按哪個按鈕?

我們生活中有很多類型相似的產品,卻使用差異很大的操作介面,如果都夠直覺、容易上手倒也無妨,但我們卻常發現產品強調「多功能」,眼花撩亂的選項和資訊,讓沒那麼常使用科技產品的長者,或對科技產品缺乏信心的使用者望之卻步,甚至不知該從何展開操作。

很多人在KTV最常使用的功能是「切歌」鍵,但在介面上並不醒目。

複雜的介面,需要好好分類

越複雜的介面,越需要好好分類,以減少使用者視覺搜尋與心智負荷的程度。所謂的「複雜」,不只是操作步驟或功能按鍵多,資訊量也會提高介面設計的複雜度。而分類的方式很多種,包括選項的位置、形狀、顏色和大小等,都能作為分類的元素。

位置:如果是大家習以為常,甚至使用者經驗已根深蒂固的選項位置,通常不能隨意改動。例如,通常網頁會把返回首頁或上一頁的選項放在左上角。許多重要資訊也常會放在左上角的區域,讓使用者較容易發現。

手機操作介面通常將返回上一層的按鍵放在左上角。

形狀:選項的形狀能作為不同功能或類型的區別,甚至對於比較特殊的功能,會用更特殊的形狀去表示,例如星星形狀常用來當作「我的最愛」,設為常用項目或捷徑功能。若是觸碰式的介面,為避免誤觸隔壁選項,盡可能會採用方形或長方形,將空間有效使用。

書籤功能通常做成星星的形狀,方便使用者辨認。

大小:選項的大小也能作為分類,但更適合被用來呈現該選項的重要性或使用頻率。例如拍照APP的快門鍵常較其他功能來得大,購物網頁的「放入購物車」、「結帳」等功能也常比其他選項大,看起來更明顯。

從新手和專家視角解析介面設計問題

同一個介面的設計,不僅要讓新手可以自行理解、正確操作,或者方便找到解惑提示,在過程中不會產生挫敗感,也要能讓熟練使用者和專家可以跳過冗長重複的步驟,在過程中不會感到不耐,甚至提供捷徑以提升操作效率或使用者經驗。

然而,新手和專家的需求可能截然不同,甚至往往是天秤的兩端,如何整合、讓兩者都能順利操作完成,是介面設計很重要的課題。善用分類簡化資訊、凸顯重點,對初次或熟練使用者皆有幫助。在追求無人商店、廣設自助操作系統的科技時代,必須從新手和專家的視角及需求同時考量,才可能成為較通用的介面設計。

捷克超市有自助結帳機器,以減少人力負擔。 

原始來源:天下獨立評論 余虹儀專欄 「自助機器好難用?這時候,你就了解「使用者介面」設計的重要

此文正式取得「獨立評論@天下」授權刊登

相關閱讀:〈介面設計應考量通用使用性〉、〈自助操作系統應滿足新手與熟手的需求〉、〈通用介面同時滿足新手與熟手

自助操作系統應滿足新手與熟手的需求

匈牙利火車自助購票系統有快速購票的介面選項

科技發達、人力缺乏的時代,越來越多無人商店與自助操作系統(Kiosk)出現在我們的生活環境之中。停個車,要使用自助繳費系統,借個u-bike也要先用自助操作系統進行悠遊卡設定。醫院有自助掛號批價繳費機,高鐵或台鐵車站有自助購票機,各家便利商店也都有自助操作系統,影印、購票或寄貨都可以自己來。

然而,我們也經常看到很多民眾在機器前「卡關」。無論是繳費、掛號或購票,在操作過程中產生挫敗後,往往還是仰賴櫃檯人員或志工協助。這呈現出自助操作系統在介面設計上存有不少問題。

「初次」和「熟練」使用者的需求大不同

長久以來,自助操作系統為了避免初次使用者操作錯誤或失敗,大多採取一步一步的操作方式,也就是一次只讓使用者思考與回答一個問題。然而,這種做法會讓熟練使用者感到繁瑣囉嗦。例如列印一份文件,要先用好多個畫面解決下列問題:要印黑白還是彩色?A3還是A4?要不要放大縮小?要印多少張?對已經熟悉流程的使用者來說,很容易感到不耐。而大多數使用者可能都是要列印黑白、A4與單張文件,如果一開始就給使用者這個預設組合,或許可以更快完成任務,也不容易出錯。

由於初次使用者可能無法一次處理太多問題,熟練使用者卻傾向快速操作完成任務,因此可考慮提供快捷鍵的方式,讓熟練使用者可以加速流程,而初次使用者仍可維持原本的操作步驟。像是匈牙利的地鐵自助購票機在介面首頁就有提供「快速購票(Quick purchase)」按鍵,讓使用者可以一次完成選擇目的地、車票種類與張數等設定,對於經常使用或趕時間的旅客,這樣的操作方式可減少使用者不耐,也能提升購票效率。

匈牙利地鐵自助購票機有提供快速購票的功能。

過多選項應簡化或分類

生活品質提升,產品與服務也越來越多。便利商店自助操作系統所提供的服務項目多到讓人眼花撩亂,光是購票就有分交通票、博物館和演唱會等多種票券,使用者不僅難以分辨,瀏覽與查找也頗為費時。

根據短期記憶理論,人在短時間內可記憶的項目大約在數字7,最多是再加、減2的範圍內。然而,很多自助操作系統的服務或功能選項都超過7項。

簡化選項,主要可以避免使用者視覺搜尋時間過長,間接影響其操作意願或任務完成率。但有些選項是無法刪減的,例如台鐵購票系統即使已經先區分出北、中、南、東等區域,但每個區域還是有超過7個站必須列出;又如許多大城市的地鐵購票系統為了因應國際觀光客,往往需要多國語言,也很可能超過7種。

其實,面對選項太多的情況,可以將常用選項與不常用選項進行劃分,常用選項可直接列出,不常用選項都以「其他/更多」的選項收納,有需求者再自行點選。

奧地利地鐵自助購票系統僅呈現3種常用語言,其他語言都放在「更多」的選項中。

一個良好的自助操作系統必須滿足所有使用者需求,不管是初次使用、相當熟悉、有過類似操作經驗等等的使用者,要符合所有人的情況確實不易。因此,介面設計是否有做到「通用使用性」(universal usability)便顯得重要。除了要讓不同年齡、能力和經驗的使用者都能自行完成任務,在不同情境,或是使用不同載具的狀況下,也要有良好的操作體驗。

原始來源:天下獨立評論 余虹儀專欄 「自助購票繳費系統好難用?讓生活更便利的設計巧思

此文正式取得「獨立評論@天下」授權刊登

相關閱讀:〈介面設計應考量通用使用性〉、〈通用介面同時滿足新手與熟手〉、〈複雜介面的選項與流程應簡化或分類

通用介面同時滿足新手與熟手

匈牙利火車自助購票機的操作畫面

看看提款機或售票機的自助操作介面,大多還停留在一個頁面只呈現一個問題,要求使用者按部就班,一步步完成操作。將所有使用者都當作新手來看待,熟練或專家使用者老是在重複操作,花費過多時間是否恰當?身處電腦和智慧型手機普及的資訊時代,充滿智慧系統和產品的城市,難道沒有更快速、更符合不同使用者需求的介面設計形式嗎?

早在2000年「第一屆通用使用性研討會(The 1st Conference on Universal Usability)」就已提出,介面設計應同時滿足新手與專家使用者操作需求,也就是通用使用性(universal usability)的概念。然而,新手與專家使用者的操作需求往往相反,如何同時滿足兩者,確實有其難度。這也是通用使用性的挑戰之一,但並非做不到。

試著提供使用者快捷和常用選項吧!

若能在介面設計上,提供熟練或專家使用者一個快捷操作的途徑或選項,就能讓他們避開為新手設計的繁瑣操作步驟。例如,匈牙利火車自助購票機就提供「快速購票(quick purchase)」選項,點開後即可在一頁內,將所有購票要選擇的項目,一次操作完成。反觀台灣高鐵的自助購票機,從進入頁面,到最後購票完成,至少需要進行十次的點選。

另外,提供常用服務或選項也是一種方法。特別是選項過多的時候,介面設計應該讓使用者可以快速發現自己要的選項,而非一次全部呈現。例如,匈牙利地鐵自助購票機將常用的三個語言選項直接列出,方便使用者快速選擇,較少用到的語言則放在其他語言選項之中。

匈牙利火車自助購票機
匈牙利火車自助購票機有提供「快速購票(quick purchase)」選項。

匈牙利地鐵自助購票機直接列出常用語言選項。
匈牙利地鐵自助購票機直接列出常用語言選項,方便使用者快速選擇。

無障礙咖啡選單

通用使用性除了需考量不同知識經驗的使用者,也要顧及不同年齡、身體狀況和行為能力的使用者需求。在德國慕尼黑中央火車站的休息區,有一台透過觸控螢幕操作可選購不同風味咖啡的販賣機。

看似平常的操作畫面,除了飲料種類的選項外,出現一個很突兀的「無障礙圖示」選項。按一下該選項,菜單竟然移到下方。原來是為了方便輪椅使用者操作而改變高度位置。

德國慕尼黑火車站休息區的販賣機操作畫面。
德國慕尼黑火車站休息區的販賣機操作選項及菜單畫面。

按無障礙圖示菜單會下移,方便輪椅使用者方便操作。
按下無障礙圖示的選項後,菜單會下移,方便輪椅使用者方便操作。

搭火車最怕遇到火車誤點。在車站候車時,多半有資訊看板可以得知火車誤點多久,但搭上火車後,旅客要如何得知火車是否會誤點,以及會誤點多久,是否來得及銜接下一班列車呢?

德國鐵路公司的APP完全了解旅客需要,不僅可以呈現即時的到站時間,還做成動態感,讓旅客可以直覺掌握還有多久會到站。會誤點多久也有顯示,甚至會通知提醒,如果搭不上原定轉車的車班,會告知旅客可以改搭哪班列車。

在資訊時代、智慧城市,隨處可見使用者介面,生活中會遇到的自助操作系統有增無減,如何讓初次使用者可以直覺操作、熟練使用者操作時不感到繁瑣,都是介面設計需要努力的目標。介面設計發展已久,很多技術都很成熟,形式也五花八門。加上載具越來越多元,挑戰自然也多。但唯一不會改變的是以使用者為中心的設計方向。

原始來源:天下未來城市 余虹儀專欄「售票機按到抓狂?通用介面讓你輕鬆買票

此文正式取得《未來城市@天下》授權刊登

相關閱讀:〈介面設計應考量通用使用性〉、〈自助操作系統應滿足新手與熟手的需求〉、〈複雜介面的選項與流程應簡化或分類

介面設計應考量通用使用性

介面設計應考量通用使用性

通用使用性的三個設計層面

現今產品的功能日益複雜,且科技發展快速,使用者介面很需要導入通用設計,以適應不同使用者的需求。而通用使用性(UU, Universal Usability)是使用者介面發展的新觀念,大概只有十幾年的發展,主要是如何在同一個使用者介面上滿足新手和專家的需求,也就是讓不同知識和經驗的使用者都能有良好的使用性。此概念需考量以下三個層面:

1. 技術變化性:

使用者介面應可支持大範圍的硬體、軟體和網路通路。例如,使用手機、平板和電腦等不同硬體設備皆能產生很好的使用體驗,透過不同的瀏覽器是否皆可觀看與操作等等。

小魚在網路購買客運車票音系統設計的限制而產生不好的操作體驗
特定瀏覽器才能完成的操作,將帶給使用者不便,甚至產生不好的使用者經驗。

2. 使用者多樣性:

使用者介面應可適應不同技能、知識、年齡、身障、文化、收入、失去讀寫能力,或受移動、日光,噪音等影響產生不同使用情況的使用者。例如,在陽光下是否也能看得清楚介面上所呈現的內容,使用不同語言或是不識字的使用者是否皆能理解與操作等等。

3. 使用者的知識差距:

使用者介面應要將使用者所知道的,和他們需要知道的,這之間的差距連結起來。具備不同知識背景,或是有無該介面相關使用經驗的使用者是否都能順利完成操作等等。

新手和專家使用者的需求大不同

使用者介面的功能太多,初次和新手使用者可能很難上手,甚至會產生挫折,但按部就班的防錯步驟,又可能會讓熟練和專家使用者感到繁瑣,甚至厭煩操作。特別是很多公用系統的介面,如便利商店的資訊站(Kiosk)有太多服務,初次和新手使用者可能很難找對操作路徑,且操作步驟大多冗長,熟練和專家使用者操作時容易感到不耐。

通用使用性已有良好的發展基礎

一直以來,一個介面同時要符合不同能力層級的使用者都是矛盾且困難的。研究通用使用性(UU, Universal Usability)多年,博士論文《使用者介面之通用使用性與介面模式》的研究成果顯示,近年來使用者介面理論有很大的發展,包括指紋辨識、語音輸入和人工智慧等技術成熟,增加使用者介面的可能性。

小魚博士論文及學位證書的封面
小魚的博士論文《使用者介面之通用使用性與介面模式》是以通用使用性為研究主題。

此外,電子商務越來越重視使用者經驗,致力發展推薦系統,也產生了使用者行為分析和google網路分析等工具,帶動自適性、推薦選項等使用者介面形式的發展。而服務設計逐漸受到重視,為提升客戶滿意度,顧客關係管理軟體設計、前台與接觸點管理等系統的進步,讓顧客管理系統更加成熟,促進客製化使用者介面的發展,這些都是現今使用者介面可達到通用使用性做法的基礎。

相關閱讀:〈自助操作系統應滿足新手與熟手的需求〉、〈通用介面同時滿足新手與熟手〉、〈複雜介面的選項與流程應簡化或分類