悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
以科學⽅方式改善線上購物經驗:
質量並進/遠交近攻的使⽤用者研究⽅方法	
蔡明哲 	
悠識 ⾸首席體驗架構師	
richard@userxper.com	
1
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
蔡明哲 Richard Tsai	
•  悠識 ⾸首席體驗架構師 	
–  20年網路⾏行銷經驗及網站企劃與建置經驗	
–  使⽤用者研究,使⽤用者介⾯面,網站企劃,網路⾏行銷,專案管理	
	
•  HPX社群 創辦⼈人	
–  嘗試創造出跨世代交流的環境	
–  培養更多創新產品與服務設計規劃⼈人才	
2
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
悠識 服務項⺫⽬目
UX書籍
BOOKS	
軟體代理
SOFTWARE	
社群活動
COMMUNITY	
原型規劃
PROTOTYPE	
教育訓練
TRAINING	
使用者
經驗 UX
使⽤用者
研究
RESEARCH
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
使⽤用者研究案例類型	
機會探索 Opportunity Exploration
–  單身女性交友態度研究 
–  家庭親子活動安排與資訊來源研究
–  Youbike都市自行車騎乘經驗研究 
–  紅利積點消費者經驗及店家POS系統接受度研究 … etc.
認知探索 Cognition Study
–  CRM系統介面使用性及需求研究
–  帳號整合及 外部帳號認知研究
–  中小企業人資系統需求研究 … etc.
易用性測試 Usability Study
–  電商網站 / 行動電商 Usability Test 
–  人力銀行招募流程系統介面 Usability Test
–  線上學習社群網站 Usability Test … etc.

4
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
電商使⽤用者經驗設計引⾔言	
5	
下載投影片
電子商務行銷營運已趨成熟
電商經驗設計,才剛開始
http://www.slideshare.net/Happy.Prototyper/0ecx
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
從使⽤用者研究
發掘網站獲利關鍵設計	
•  ⽤用⼾戶⾏行為不是我們想像的那樣	
•  介⾯面細節造成⾏行為轉折	
•  順勢⽽而為更容易改變⾏行為	
•  商品內容/品牌價值/服務品質是基本	
•  答案不⼀一定是答案,找答案的⽅方法才是
答案	
•  使⽤用者研究 = 量化體檢+質化診斷	
下載投影片
6	
http://www.slideshare.net/Happy.Prototyper/4richard
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
經常有客⼾戶(朋友)詢問:
我想要做⼀一個電⼦子商務網站,
要花多少錢?	
7
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
電商平台三階段的研究重點	
•  階段⼀一 商業概念探索:做這個⽣生意,可⾏行嗎?	
•  階段⼆二 建⽴立通路平台:正確設計網站/App	
•  階段三 營運⾏行銷服務:達成更好的經營成效	
8
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
階段⼀一:商業概念探索	
•  量化:	
– 建⽴立幾個不同的 facebook 粉絲⾴頁,測試反應	
– 購買少許不同關鍵字廣告,測試反應	
•  質性:	
– 尋找真實的⺫⽬目標顧客,訪談⽣生活⾏行為脈絡	
• 他們常⽤用的網站?	
• 如何尋找購買相關商品?	
• 平常如何上網?	
• 電腦有甚麼?	
• 如何使⽤用⼿手機?裡頭有甚麼?	
• 如何購買付款?如何取貨?	
9
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
服務	
商品	
⾏行為	
需求	
階段⼀一:商業概念探索
做這個⽣生意,可⾏行嗎?	
10	
顧客	
環境	
企業	
市場	
行動裝置(手機)使用
網路使用行為
媒體接觸狀況
顧客的生活型態
顧客購買行為
目標顧客的顯性需求?
顧客(市場)接受
誰是目標顧客?
直接競爭者 / 間接競爭者
商品概念
企業願景
企業目標
服務系統
通路
接觸點
傳播媒體
同儕 家人 朋友 社交
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
4位~8位受訪者
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
 12	
用LINE下訂,怎麼做?
為什麼?
上哪些網站逛?為甚麼?
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
 13	
手機上有哪些App?
怎麼用?為什麼?
皮夾裡有哪些信用卡?
怎麼應用?為什麼?
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
User information behavior model 使⽤用者資訊⾏行為模式	
14	
When?
Where?
How?
When?
Where?
How?
Social Network Desktop網站
行動版網站
導覽/搜尋
首頁/頻道
When?
Where?
How?
其他互動
 其他互動
When?
Where?
How?
其他互動
透過深度訪談及觀察使⽤用⾏行為
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
階段⼆二 建⽴立通路平台
正確設計網站/App	
先問⾃自⼰己這些問題:	
•  這是⼀一個甚麼樣的網站?	
•  完全創新或部份創新?	
•  對顧客的價值是甚麼?	
•  想要建⽴立甚麼樣的品牌?	
•  ⺫⽬目標對象是誰?他們的⾏行為特徵是甚麼?	
•  先做個原型來測試(認知,理解)	
•  做個⾼高擬真原型來測試易⽤用性(Usability)	
15
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
Design
Develop
Measure
User-Centered
Design
以使⽤用者為中⼼心的設計階段	
UCD Cycle
Plan – 企業策略, 關鍵目標, 資源限制	
Discover – 釐清使用者目的/行為及需求	
Design – 快速原型設計與易用性檢驗	
Develop - 開發與佈建	
Measure – 定期評估與測量	
Plan
 Discover
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
設計原型 Prototype
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
接續階段⼀一:	
調查粉絲結構與特性	
或者發佈問卷調查,瞭解輪廓與偏好
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
Fake Door	
假⾨門測試	
19
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
實際觀察與訪談
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
1
2
1
 3
21	
找出認知/理解/易⽤用性的問題	
1.  用詞造成誤會: 第一次購買,就要按「立即購買」?
2.  不知道要到哪裡去查看會員條款內容 我沒有看到會員條款我怎麼會同
意呢?我覺得他不友善。
3.  標題語義重複造成 困惑
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
舉例:某個線上購物商品⾴頁
如何傳達訂購需同時指定店點,並實際
需要客⼈人到店安裝 (O2O)?	
22
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
階段三 營運⾏行銷服務
達成更好的經營成效	
先問⾃自⼰己這些問題:	
•  追求哪些成效?為什麼?	
•  業績最⼤大化或利潤最⼤大化?	
•  ⾏行銷導流?轉換率?	
•  提昇客⼾戶滿意度?	
•  提昇忠誠度?	
•  客層年輕化?	
23
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
網站流量分析 Google Analytics	
•  偏好⾴頁⾯面	
•  瀏覽動線	
•  流失率	
• SEO, 廣告效果
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
點擊熱圖分析 Click Heatmap	
-  關鍵⾴頁⾯面的重要點擊區域	
-  關鍵⾴頁⾯面的不被點擊區域
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
站內搜尋關鍵字統計	
-  ⼈人們搜尋哪些資料	
-  資料搜尋的分群 與 pattern:內容, 商品, 服務, 特
殊議題, …
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
⼿手機App 眼動追蹤 	
27
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
⾼高	
中	
低	
低	
 ⾼高	
低	
商品需求	
內容需求	
流失挽回	
獲取轉化	
需求引導	
需求改變	
⾼高	
低價值?
尚未接觸到?
那些站內轉換率接觸不到的或流失的?
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
⼿手機購物94% Abandon Rate
然後呢?	
SeeWhy, 2013	
29
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
Don’t just think Funnel, think Journey
30	
見樹又見林
SeeWhy, 2013
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
UX 不是 UI	
⽤用⼾戶體驗提昇的⺫⽬目標:	
追求顧客感受價值的最⼤大化	
31
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
User Research Methodology	
32
http://www.nngroup.com/articles/which-ux-research-methods/
悠識數位顧問有限公司 UserXper Digital Consulting Co., Ltd.
善⽤用研究⼯工具與⽅方法

看清範疇,問對問題
去除偏⾒見,實事求是	
33

ECX2014 線上購物經驗使用者研究方法

  • 1.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 以科學⽅方式改善線上購物經驗: 質量並進/遠交近攻的使⽤用者研究⽅方法 蔡明哲 悠識 ⾸首席體驗架構師 richard@userxper.com 1
  • 2.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 蔡明哲 Richard Tsai •  悠識 ⾸首席體驗架構師 –  20年網路⾏行銷經驗及網站企劃與建置經驗 –  使⽤用者研究,使⽤用者介⾯面,網站企劃,網路⾏行銷,專案管理 •  HPX社群 創辦⼈人 –  嘗試創造出跨世代交流的環境 –  培養更多創新產品與服務設計規劃⼈人才 2
  • 3.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 悠識 服務項⺫⽬目 UX書籍 BOOKS 軟體代理 SOFTWARE 社群活動 COMMUNITY 原型規劃 PROTOTYPE 教育訓練 TRAINING 使用者 經驗 UX 使⽤用者 研究 RESEARCH
  • 4.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 使⽤用者研究案例類型 機會探索 Opportunity Exploration –  單身女性交友態度研究 –  家庭親子活動安排與資訊來源研究 –  Youbike都市自行車騎乘經驗研究 –  紅利積點消費者經驗及店家POS系統接受度研究 … etc. 認知探索 Cognition Study –  CRM系統介面使用性及需求研究 –  帳號整合及 外部帳號認知研究 –  中小企業人資系統需求研究 … etc. 易用性測試 Usability Study –  電商網站 / 行動電商 Usability Test –  人力銀行招募流程系統介面 Usability Test –  線上學習社群網站 Usability Test … etc. 4
  • 5.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 電商使⽤用者經驗設計引⾔言 5 下載投影片 電子商務行銷營運已趨成熟 電商經驗設計,才剛開始 http://www.slideshare.net/Happy.Prototyper/0ecx
  • 6.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 從使⽤用者研究 發掘網站獲利關鍵設計 •  ⽤用⼾戶⾏行為不是我們想像的那樣 •  介⾯面細節造成⾏行為轉折 •  順勢⽽而為更容易改變⾏行為 •  商品內容/品牌價值/服務品質是基本 •  答案不⼀一定是答案,找答案的⽅方法才是 答案 •  使⽤用者研究 = 量化體檢+質化診斷 下載投影片 6 http://www.slideshare.net/Happy.Prototyper/4richard
  • 7.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 經常有客⼾戶(朋友)詢問: 我想要做⼀一個電⼦子商務網站, 要花多少錢? 7
  • 8.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 電商平台三階段的研究重點 •  階段⼀一 商業概念探索:做這個⽣生意,可⾏行嗎? •  階段⼆二 建⽴立通路平台:正確設計網站/App •  階段三 營運⾏行銷服務:達成更好的經營成效 8
  • 9.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 階段⼀一:商業概念探索 •  量化: – 建⽴立幾個不同的 facebook 粉絲⾴頁,測試反應 – 購買少許不同關鍵字廣告,測試反應 •  質性: – 尋找真實的⺫⽬目標顧客,訪談⽣生活⾏行為脈絡 • 他們常⽤用的網站? • 如何尋找購買相關商品? • 平常如何上網? • 電腦有甚麼? • 如何使⽤用⼿手機?裡頭有甚麼? • 如何購買付款?如何取貨? 9
  • 10.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 服務 商品 ⾏行為 需求 階段⼀一:商業概念探索 做這個⽣生意,可⾏行嗎? 10 顧客 環境 企業 市場 行動裝置(手機)使用 網路使用行為 媒體接觸狀況 顧客的生活型態 顧客購買行為 目標顧客的顯性需求? 顧客(市場)接受 誰是目標顧客? 直接競爭者 / 間接競爭者 商品概念 企業願景 企業目標 服務系統 通路 接觸點 傳播媒體 同儕 家人 朋友 社交
  • 11.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 4位~8位受訪者
  • 12.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 12 用LINE下訂,怎麼做? 為什麼? 上哪些網站逛?為甚麼?
  • 13.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 13 手機上有哪些App? 怎麼用?為什麼? 皮夾裡有哪些信用卡? 怎麼應用?為什麼?
  • 14.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. User information behavior model 使⽤用者資訊⾏行為模式 14 When? Where? How? When? Where? How? Social Network Desktop網站 行動版網站 導覽/搜尋 首頁/頻道 When? Where? How? 其他互動 其他互動 When? Where? How? 其他互動 透過深度訪談及觀察使⽤用⾏行為
  • 15.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 階段⼆二 建⽴立通路平台 正確設計網站/App 先問⾃自⼰己這些問題: •  這是⼀一個甚麼樣的網站? •  完全創新或部份創新? •  對顧客的價值是甚麼? •  想要建⽴立甚麼樣的品牌? •  ⺫⽬目標對象是誰?他們的⾏行為特徵是甚麼? •  先做個原型來測試(認知,理解) •  做個⾼高擬真原型來測試易⽤用性(Usability) 15
  • 16.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. Design Develop Measure User-Centered Design 以使⽤用者為中⼼心的設計階段 UCD Cycle Plan – 企業策略, 關鍵目標, 資源限制 Discover – 釐清使用者目的/行為及需求 Design – 快速原型設計與易用性檢驗 Develop - 開發與佈建 Measure – 定期評估與測量 Plan Discover
  • 17.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 設計原型 Prototype
  • 18.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 接續階段⼀一: 調查粉絲結構與特性 或者發佈問卷調查,瞭解輪廓與偏好
  • 19.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. Fake Door 假⾨門測試 19
  • 20.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 實際觀察與訪談
  • 21.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 1 2 1 3 21 找出認知/理解/易⽤用性的問題 1.  用詞造成誤會: 第一次購買,就要按「立即購買」? 2.  不知道要到哪裡去查看會員條款內容 我沒有看到會員條款我怎麼會同 意呢?我覺得他不友善。 3.  標題語義重複造成 困惑
  • 22.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 舉例:某個線上購物商品⾴頁 如何傳達訂購需同時指定店點,並實際 需要客⼈人到店安裝 (O2O)? 22
  • 23.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 階段三 營運⾏行銷服務 達成更好的經營成效 先問⾃自⼰己這些問題: •  追求哪些成效?為什麼? •  業績最⼤大化或利潤最⼤大化? •  ⾏行銷導流?轉換率? •  提昇客⼾戶滿意度? •  提昇忠誠度? •  客層年輕化? 23
  • 24.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 網站流量分析 Google Analytics •  偏好⾴頁⾯面 •  瀏覽動線 •  流失率 • SEO, 廣告效果
  • 25.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 點擊熱圖分析 Click Heatmap -  關鍵⾴頁⾯面的重要點擊區域 -  關鍵⾴頁⾯面的不被點擊區域
  • 26.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 站內搜尋關鍵字統計 -  ⼈人們搜尋哪些資料 -  資料搜尋的分群 與 pattern:內容, 商品, 服務, 特 殊議題, …
  • 27.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. ⼿手機App 眼動追蹤 27
  • 28.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. ⾼高 中 低 低 ⾼高 低 商品需求 內容需求 流失挽回 獲取轉化 需求引導 需求改變 ⾼高 低價值? 尚未接觸到? 那些站內轉換率接觸不到的或流失的?
  • 29.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. ⼿手機購物94% Abandon Rate 然後呢? SeeWhy, 2013 29
  • 30.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. Don’t just think Funnel, think Journey 30 見樹又見林 SeeWhy, 2013
  • 31.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. UX 不是 UI ⽤用⼾戶體驗提昇的⺫⽬目標: 追求顧客感受價值的最⼤大化 31
  • 32.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. User Research Methodology 32 http://www.nngroup.com/articles/which-ux-research-methods/
  • 33.
    悠識數位顧問有限公司 UserXper DigitalConsulting Co., Ltd. 善⽤用研究⼯工具與⽅方法 看清範疇,問對問題 去除偏⾒見,實事求是 33