
上圖是目前任職公司在app store和google play上架的產品:玩運彩即時比分。APP不需要登入會員,安裝完就能使用。主畫面可以排序賽事,按一下箭頭置頂,方便使用者整理自己關注的賽事,再按一次箭頭則該賽事回到原本位置。像MLB旺季一天會有十幾場比賽,賽事越多,依靠肉眼搜尋的效率會越低,於是排序這類整理、自訂功能就很必要。
近期在執行APP介面改版時,針對置頂功能提出4種調整方案,共通特色是按鈕皆常駐在主畫面上,差別是出現的位置、數量,以及操作流程。不採用隱藏式介面的主要原因,是考量此APP的使用族群,既不偏好也不太熟悉這類操作方式。

第1個版本的置頂功能配合賽事資訊的排版,異動了位置,調整到每個賽事左下方,圖示由上下箭頭改為星星,操作流程不變。已置頂與未置頂賽事會被分群,因此若置頂賽事的數量剛好是單數,最後一場置頂賽事右側將保留空白,下一列才開始出現未置頂賽事。

第2版把置頂功能改用floating action button收納為單一按鈕,騰出更多畫面空間,操作流程跟著異動,變成按下右下方的”關注”後,出現編輯畫面,可以批次調整置頂賽事。按鈕使用中文而未使用圖示,原因是圖示容易有認知問題,進而影響點擊率,這點已經在漢堡選單的A/B testing得到印證。
雖然就設計者的角度,圖示既簡潔又美觀。

第3版的置頂功能維持在原位,僅更換圖示,操作流程不變。

第4版把置頂功能挪到畫面右上方的app bar,理由同版本2,為了節省畫面空間。因按鈕濃縮為一個,操作流程改為如同第2版的方式,點擊按鈕後,出現調整置頂賽事的獨立頁面。

以上4個版本先在公司進行內部測試,以收斂提案,受測者按照測試腳本操作wireframe原型,同時評分關鍵功能與畫面。3位受測同事的簡要背景如下:
受測者 | 性別 / 年齡 | 職銜 | 手機 | APP熟悉度 |
---|---|---|---|---|
1. Mr.黃 | 男 / 34 | 數據分析 | iphone 6 | 中度 |
2. Mr.黃 | 男 / 35 | APP工程師 | sony xperia | 高度 |
3. Mr.林 | 男 / 23 | 行銷企劃 | iphone 6 | 中度 |
先公布測試結果排名:3 > 1 > 2 > 4
版本3因整體版面與現行APP相當接近,可以無縫接軌,不需重新適應,毫無懸念得到14分,差1分就是滿分。受測者的評論和評分依序如下:
- 「這是最好懂得」(5分)
- 「比第一版更有往上移動、置頂的感覺」(4分)
- 「還蠻明顯的」(5分)
版本3的主要優點是使用習慣不變,以及操作效率較佳,這兩個使用者關注的重點,極有可能和設計者的認知不同。
版本1的置頂按鈕改放每場賽事的左下方,得到次高的分數,評論是:
- 「因為很多APP都是打星星」(5分)
- 「一開始可能不知道按星星是置頂」(4分)
- 「因為有空格,我會想要拖曳,如果沒空格,我會想按星星。我覺得有一點不夠明顯,因為我可能不知道星星代表什麼意思」(3.5分)
僅僅變更了按鈕圖示,異動了位置,導致後兩位受測者產生疑慮。至於空格,真是美麗的誤會,畫面佈局讓受測者認知為每個賽事區塊都可拖曳,因而出現非預期的操作行為。

版本2的置頂功能使用了floating Action button,得到的回饋是:
- 「可以做一個星星在前面就好了,我就不用多點一頁進去」(4分)
- 「光看畫面,可能會先按住場次,再拉到右下方的關注按鈕。不夠快,比較麻煩,一開始比較不知道要按關注」(2分)
-
「我覺得可以把”關注”改成”置頂”」(4分)
material design建議將floating action button套用在APP中的主要動作:
A floating action button represents the primary action in an application.
建議歸建議,至於適不適當,根據實測結果,設計者還有另一個重點要考量:操作效率。假使置頂按鈕是APP的關鍵功能,採用floating action button的介面形式,畫面變得更簡潔、更潮,但操作效率變差,設計者該如何取捨?
類似這些實做才會碰到的問題,設計原則、理論沒辦法提供答案。
版本4,評價最差,不約而同得到0分,因為:
- 「不會,因為我沒有看到星星,我有看到關注中,可是要怎麼用?」(0分)
- 「找不到按鈕(有嘗試滑動畫面)」(0分)
- 「我還真不知道怎麼置頂…」(0分)
以上回應,可能讓設計者十分不解,只是把置頂功能收納到右上方,手機螢幕沒多大,也有很多APP採用類似做法,為何受測者找不到按鈕?有人找到了卻不會使用?況且受測者都是公司同事,其中一位更是APP工程師,怎麼可能遇到困難?
不是很簡單嗎?
這不是受測者的問題,當設計者拿起自己的手機開啟APP,變成真正的使用者,可能也會在某個微不足道的環節卡關。往往設計者以為很簡單、很理所當然的操作方式,到了使用者手上不一定如此。常駐在畫面上的按鈕,都有可能讓使用者遍尋不著、不會使用,更何況是隱藏式的操作介面?
對於一款手機APP,設計者與使用者重視的層面很有可能完全不同,往往設計者會輕忽”使用習慣“的影響力,過度著墨技術、潮流,凡事以主流趨勢為依歸。UCD的精神如同字面呈現,是以使用者為中心,不是設計者,否則就要改成designer-centered design了,不是嗎?
所以介面設計原則、理論的價值,是提供設計者大膽假設的方向,但使用體驗的表現如何,還是需要實際驗證,才知道規劃是否有盲點。