初學者的 UI Flow

UI Flow 和 Functional Map 算是最多人容易搞混的兩種圖表吧,Functional Map 主要目的在「將抽象的需求轉變成能被實現的功能」;而 UI Flow 則是「 妥善安排功能與資訊在頁面之間的操作動線 」。兩者很明顯目的不同,所以沒有什麼重工或是很麻煩之類的藉口可以逃避不做。

初學者的 Functional Map

功能規格書、產品規格書、系統分析、需求分析等等,是 PM 或 SA 或其他同事的工作,反正不是 UI 的工作,很多 UI 不願意去接觸這類文件,(就說了字太多圖太少設計人看不下去、有沒有懶人包?)但看不懂這些文件的 UI 絕不能被稱為好 UI…連這個軟體要做什麼都不熟悉、一知半解,要怎麼說服別人設計的介面是適合這套軟體(或網站)的好介面?

使用者經驗藏寶圖:創建人物
使用者經驗藏寶圖:創建人物


相信各位應該看過前一篇「使用者經驗藏寶圖:敘述故事、找出中心思想 」了,也相信一定有人用鼻孔噴氣:什麼鬼話連篇,拿灰姑娘出來當例子,小孩子玩家家酒。這個階段我就認真寫好了…在「創建人物」這個階段,其實就是研究方法 Persona (人物誌),都把研究方法拿出來講了,夠認真了吧!

使用者經驗藏寶圖:敘述故事、找出中心思想

1TIugvrwRsKamCovfHyb_uxtreasuremap-2.png
雖說很對不起邀我來參加聚會的主辦單位,但 UI 和 RD 擅長的領域差不多就是聖母峰和馬里亞納海溝的差別。為了不浪費這段人人都在補充新知我卻蹲在旁邊玩保衛蘿蔔2的時間,還是來寫點文章表示我也有努力好了…根據這張藏寶圖的順序,就來談談「敘述故事」、「找出中心思想」。

為什麼要畫3次 Wireframe?


每個新案子進來,我通常會畫至少 3 次的 Wireframe,記錄靈感 > 完整繪製 > 電子化。好像重工了喔?可是你哪來的自信覺得設計 App 介面能一次到位呢?靈感乾涸對設計師來講理所當然、RD 都跳坑了才發現設計有錯缺東漏西也很正常、接手修改前人留下的舊案子卻找不到相關文件也不是什麼稀奇的事。為了要避免發生這種慘況,畫 3 次以上的 Wireframe 比較保險。