玩運彩練小喂

使用者想的不一樣

 

top
玩運彩 即時比分APP

 

上圖是目前任職公司在app store和google play上架的產品:玩運彩即時比分。APP不需要登入會員,安裝完就能使用。主畫面可以排序賽事,按一下箭頭置頂,方便使用者整理自己關注的賽事,再按一次箭頭則該賽事回到原本位置。像MLB旺季一天會有十幾場比賽,賽事越多,依靠肉眼搜尋的效率會越低,於是排序這類整理、自訂功能就很必要。

近期在執行APP介面改版時,針對置頂功能提出4種調整方案,共通特色是按鈕皆常駐在主畫面上,差別是出現的位置、數量,以及操作流程。不採用隱藏式介面的主要原因,是考量此APP的使用族群,暨不偏好也不太熟悉這類操作方式。

 

 

del
比如ios的鬧鐘有隱藏式的刪除按鈕,但不是每個人都習慣這種操作方式,包括我自己。

 

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

主畫面 NBA v01
版本1的wireframe

 

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

雖然就設計者的角度,圖示既簡潔又美觀。

Group
版本2的wireframe與置頂功能的簡要流程

 

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

主畫面 NBA v03
版本3的wireframe

 

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

主畫面 NBA v04
版本4的wireframe

 

以上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分就是滿分。受測者的評論和評分依序如下:

  1. 「這是最好懂得」(5分)
  2. 「比第一版更有往上移動、置頂的感覺」(4分)
  3. 「還蠻明顯的」(5分)

版本3的主要優點是使用習慣不變,以及操作效率較佳,這兩個使用者關注的重點,極有可能和設計者的認知不同。

 

版本1的置頂按鈕改放每場賽事的左下方,得到次高的分數,評論是:

  1. 「因為很多APP都是打星星」(5分)
  2. 「一開始可能不知道按星星是置頂」(4分)
  3. 「因為有空格,我會想要拖曳,如果沒空格,我會想按星星。我覺得有一點不夠明顯,因為我可能不知道星星代表什麼意思」(3.5分)

僅僅變更了按鈕圖示,異動了位置,導致後兩位受測者產生疑慮。至於空格,真是美麗的誤會,畫面佈局讓受測者認知為每個賽事區塊都可拖曳,因而出現非預期的操作行為。

Group2
想不到留白出現了反作用力

 

版本2的置頂功能使用了floating Action button,得到的回饋是:

  1. 「可以做一個星星在前面就好了,我就不用多點一頁進去」(4分)
  2. 「光看畫面,可能會先按住場次,再拉到右下方的關注按鈕。不夠快,比較麻煩,一開始比較不知道要按關注」(2分)
  3. 「我覺得可以把”關注”改成”置頂”」(4分)

material design建議將floating action button套用在APP中的主要動作:

A floating action button represents the primary action in an application.

建議歸建議,至於適不適當,根據實測結果,設計者還有另一個重點要考量:操作效率。假使置頂按鈕是APP的關鍵功能,採用floating action button的介面形式,畫面變得更簡潔、更潮,但操作效率變差,設計者該如何取捨?

類似這些實做上會碰到的問題,設計原則、理論沒辦法提供答案。

 

版本4,評價最差,不約而同得到0分,因為:

  1. 「不會,因為我沒有看到星星,我有看到關注中,可是要怎麼用?」(0分)
  2. 「找不到按鈕(有嘗試滑動畫面)」(0分)
  3. 「我還真不知道怎麼置頂…」(0分)

以上回應,可能讓設計者十分不解,只是把置頂功能收納到右上方,手機螢幕沒多大,也有很多APP採用類似做法,為何受測者找不到按鈕?有人找到了卻不會使用?況且受測者都是公司同事,其中一位更是APP工程師,怎麼可能遇到困難?

不是很簡單嗎?

這不是受測者的問題,當設計者拿起自己的手機開啟APP,變成真正的使用者,可能也會在某個微不足道的環節卡關。往往設計者以為很簡單、很理所當然的操作方式,到了使用者手上不一定如此。常駐在畫面上的按鈕,都有可能讓使用者遍尋不著、不會使用,更何況是隱藏式的操作介面?

 


 

對於一款手機APP,設計者與使用者重視的層面很有可能完全不同,往往設計者會輕忽”使用習慣“的影響力,過度著墨技術、潮流,凡事以主流趨勢為依歸。UCD的精神如同字面呈現,是以使用者為中心,不是設計者,否則就要改成designer-centered design了,不是嗎?

所以介面設計原則、理論的價值,是提供設計者大膽假設的方向,但使用體驗的表現如何,還是需要實際驗證,才知道規劃是否有盲點。

 

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *