玩運彩練小喂

視覺傳達設計,也需要被驗證

一年多前有個修改高鐵車票的提案在網路上掀起熱烈迴響,甚至登上媒體版面。設計師的熱忱讓我很佩服,但是對於視覺提案,我是持保留態度。畢竟調整車票關係到許多層面,光是“使用族群”這一關就有的磨了,在尚未驗證之前,不宜直接下定論。

近期還有一則代表案例,發生在2017年奧斯卡頒獎典禮的最佳影片獎,首先工作人員給錯信封,而身為最後守門員的頒獎人也沒辦法在第一時間確認清楚,就這樣搞出有史以來最狂的烏龍,我想拉拉鍊的電影團隊一輩子都不會忘。這起事件足以當做視覺傳達設計的借鏡,如果想降低出錯機率,確認接收方能正確、快速的解讀訊息,那麼驗證的功夫不能省。

筆者任職的公司有完整的產品開發流程,介面設計幾乎不是設計者說了算,必需通過用戶測試,達到評分標準,才得以進入後續開發階段。接下來就以筆者經手設計的討論區APP改版為例,闡釋回饋意見的重要性。

下面四個版本的框線圖(wireframe)是APP第二層的文章內頁,當用戶想看文章內容,一定會開啟這個畫面,因此使用率頻率相當高。這四張提案用來做第一次內部測試,評比者為公司同事,包含設計者一共12位,評分尺度是1至5分,提案的平均分數需達4分以上才算過關。不妨猜猜看,分數由高至低的排序為何?

.png
第一次文章內頁的框線圖提案

 

答案是左3>左4>左2>左1,但連左3的平均分數都沒超過4分,等於全軍覆沒。

 

內頁v03.png

 

看看最高分的版本3收到哪些回饋:

  • 不喜歡推
  • 推不錯,單手很容易操作,如果把回文也放在該區域,覺得比放在上面更方便回文
  • 頁數的呈現方式有比版本四好
  • 標題跟文章感覺被分開了,覺得殺手標籤不用佔那麼大的空間,檢舉沒有按鈕的感覺不直覺,跟一樓太近也不好按
  • 不喜歡頁數呈現方式
  • 內容也沒有問題,最喜歡這個版本的推,殺手資訊用標籤方式覺得不錯,如頁數呈現方式改成版本二的,那就很完美了
  • 推的按鍵直覺,分析改成斜線就5分了
  • 推像home鍵很奇怪
  • 一樓在檢舉上面還是比較適合

 

由於評比者絕大多數非設計專業,在前期的框線圖階段往往盯得過細,但不代表他們的意見毫無參考價值。評比者基於在公司擔任的職務、自身專業與使用經驗,看待事情的角度可能超乎設計者預期,也可能提出有用的線索。

基於上述意見回饋,修改版面後再進行第二次內部測試。請再猜猜看,分數由高至低的排序為何?

文章內頁02.png
第二次文章內頁的框線圖提案

第二次的得分由高至低依序是:左4>左3>左1>左2,最高分版本符合我的預期,全部的平均分數都有成長,但依然沒過4分門檻。

內頁v04-02.png

看看最高分的左4得到哪些回饋:

  • 推不喜歡,殺手圖示一致
  • 最喜歡該版推,最好能整塊都能點
  • 喜歡該版檢舉,有按鈕的感覺,但不喜歡推,又小又遠
  • 金牌太大,不喜推的設計
  • 喜歡殺手呈現方式
  • 推放左邊不好按也有點小,檢舉不直覺
  • 版面和諧
  • 推的位置不好按也太小,但質感卻很好
  • 推跟推數離太遠

相較於第一次多樣化的意見,似乎整個畫面滿佈問題,第二次的回饋大多集中在推文按鈕,顯然提案迭代一次後有取得更多共識了,但仍有改進空間。為了確保第三次測試可以過關,我以第二次測試最高分的版本為基礎,修改後再發展出20個差異細微的提案,目的是要一網打盡所有的可能性。

內頁v03-03.png

 

上圖是第三次內部測試後,唯一平均得分超過4的方案(圖示都以灰階方塊取代)。回饋意見如下:

  • 不喜歡推的設計(推一下)
  • 不喜歡樓層
  • 中規中矩
  • 較不喜歡這個推
  • 喜歡推的設計,但擔心不知道288的意思
  • 整體閱讀起來滿順暢的,推的設計不用分開
  • 喜歡這個推的設計,但覺得要有用過才知道數字的意思
  • 推放中間很好,推和推數也沒有分開
  • 推的設計感覺要強迫人家去按
  • 排列與推都滿喜歡的

 

最後推文按鈕的回饋形成兩極化,有的人喜歡,有的人不喜歡,這種現象可以理解。當然也可以繼續嘗試到皆大歡喜,只是一來提案已達評分標準,再改下去會逐漸遠離專案的主要目標;再者開發產品有時程壓力,不能不考慮效益。

對照前兩次最高分的版本,可以發現提案稿經過評比後逐次迭代,至少能讓設計者瞭解各方不同的觀點,避免流於一言堂。設計人的想法,有時會陷於自身的專業慣性,面對合情合理的質疑,態度要更開放,即使接受過長時間的科班教育,擁有輝煌的業界經歷,僅代表執行面比一般人熟練,經驗更豐富,不代表能面面俱到。

如同電影《三個傻瓜》當中,教授戳中男主角的盲點:

「你不可能每次都對!」

 

 

發佈留言

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