蔡明哲,悠識數位首席資訊架構師, 受邀於2012年2月5日 Inside Salon。分享UCD的設計概念及方法，並分享案例與心得。

1. 以使用者為中心的設計概念跟方法
蔡明哲
2012年2月5日
@Inside Salon
悠識數位顧問有限公司
UserXper Digital Consulting Co., Ltd.
http://www.userxper.com
-1-

2. 1. 關於悠識數位 UserXper.com

3. 推廣網站企劃觀念
推廣UCD設計流程
提升網站企劃價值 悠識數位
建立網站企劃標準
-3-

4. 悠識的三種服務類型
1. 提供網站企劃/UI設計諮詢顧問
2. 使用者經驗設計相關教育訓練
3. Axure RP 代理商 (但我們不是軟體公司)

5. 1. 網站/Mobile App 規劃
• 使用者研究 user research
• 制定策略 strategy plan
• 規劃藍圖 wireframe
• 設計模型 prototype
• 使用者測試 user testing
• 撰寫規格 specification

6. 2. 課程 /企業內訓
– 網站企劃工作流程
– 腦力激盪
– Mobile App設計與規劃工作坊
– 易用性研究
– Axure RP 原型設計工作坊 (Web/Mobile)
– 網站流量分析及訪客行為解讀
– 簡報專業表達訓練
– 資訊架構與介面模式
– 認知心理學
–…

7. 3. Axure RP快速原型軟體
• 最佳網站/Mobile企劃工具
• 優點：
– 設計師：幫助我跟客戶前期溝通，省掉修改的時間。
– 專案經理：更快更明確地定義客戶需求，掌握 Scope。
– 產品經理：提早驗證產品概念，不用等到開發。
– 行銷主管：讓我管理網站企劃工作品質，建立文件一致
性，提高管理的效益與效率。

8. 一半以上財星百大企業,
超過3萬個專業團隊選擇Axure RP

9. Axure RP軟體客戶
• 台灣
– 網路：Yahoo奇摩, 博客來, 巴哈姆特, 104人力銀行, 地圖日記
– 科技：趨勢科技, 廣達, D-Link,神達, 台達電, 致伸科技,凌網科技,
華創車電, 華寶通訊,圓剛科技, 凌誠科技, …
– 行銷: 達彼思廣告, 知世, 安捷達, 米蘭, 網路基因, 富爾特, 不來梅,
奇禾, 聯網, 生命樹, 摩奇, 多奇, 喬立達, 阿物國際, 恆基, 網路行動,
久大資訊, 樂倍達, …
– 其他：天下雜誌, 玉山銀行, 工研院, NII
• 大陸
– 阿里巴巴, 淘寶網, 微軟亞洲研究院, 百度, 中國平安保險, 中達電,
iResearch, 上海征途, 法國電信, 騰訊, 網易, 當當網, 支付寶,
Mapbar, 金蝶軟件…

10. 網站企劃輕鬆聚 HPX 活動
http://www.HPX-Party.com
-10-

11. 什麼是HPX？

12. 主題分享@HPX 讀書會大聚

13. HPX 讀書會小組聚會活動

14. HPX讀書小組專屬徽章

15. HP19 Mobile Design > 200人

16. HPX 2011年活動總覽
HP15：1/12 (三) 電子商務網站規劃與經營(I)
HP16：2/24 (四) 電子商務網站規劃與經營(II)
HP17：3/5 (六) 企劃簡報力與說服力
HP18： 4/14 (四) 設計與企劃
HP19： 5/11 (三) Mobile Design (Mobile Web 或 Mobile App)
HP20： 6/8 (三) 網站企劃讀書會 (只開放給讀書會成員)
HP21： 7/9 (六) HPX台中場
HP22： 7/10 (四) HPX高雄場
HP23： 7/14 (四) 認識使用者 - 台北
HP24： 7/16 (四) HPX新竹場, 與PMP新竹分會合辦
HP25： 8/11 (四) 專案管理相關
HP26： 9/14 (三) 網站架站技術及工具
HP27：10/12 (三) 電子書與數位出版
HP28：10/26 (三) HPX讀書會大聚會
HP29：11/6 ( 日) 青窗大無畏，個人學習成長的歷程
HP30：11/23 (三) 北京IxDC2011 及 蘇州 User Friendly 2011 Conference
HP31：12/22 (四) 活動設計與規劃：舉辦一個歡樂的實體活動

17. 16,000人說讚！

18. 2. 以使用者為中心
的設計概念跟方法

19. Facets of the User Experience
Useful
Usable
Desirable
Accessible
Findable
Credible
Valuable

20. -20-

21. User Experience Research Methods
http://www.useit.com/alertbox/user-research-methods.html

22. 悠識數位使用的 UX Study的各種方法
• 行為觀察及分析
– 流量分析工具
– 可用性測試
– 點擊熱圖
– 眼動分析
• 認知與理解
– 卡片分類
• 機會探索與挖掘
– 深度訪談/焦點團體
– 人物誌及團體構思

23. 例如：從facebook導入的流量佔 55.47%
數據來源-某網站 Google Analytics Report

24. 好的設計：
順利完成使用者任務，
創造滿意體驗
不好的設計：
浪費引入流量，而且創
造不好的使用經驗

25. 可用性測試

26. 眼動追蹤
資料來源：user friendly 2011 conference,蘇州

27. 點擊熱圖
http://www.userzoom.com/news-feed/cyber-monday-4-site-shopping-study

28. 卡片分類

29. 人物誌

30. 案例展示

31. 心得- 關於以使用者為中心的設計方法
• 關鍵字：User-Centered Design, UCD
• 想把網站做好而採用這些方法，不要只是為了研究
而研究
• UCD概念簡單，但並不只是心中想著使用者而已。
而是必須離開辦公室/實驗室，離開電腦螢幕，踏入
使用者的環境場域，去跟他們接觸互動
• 以使用者為中心不是做行銷市調問卷，而是去取得
使用者的各種反饋 ，從前期到後期有不同的方法。
• 「有心」最重要，就算是沒有儀器設備，但願意去
觀察，一樣可以有好的發現！

32. 歡迎一起來學習
HPX 網站企劃讀書會 (facebook社團)
http://www.facebook.com/groups/hpx.bookclub/

33. 活動預告
HP32 產品企劃設計甘苦談
2月22日 週三晚上
• 陳曉雲 (Cloud Chen) / miiiCasa Co-
Founder & UED Director- 「miiiCasa –
跨軟硬體及服務的雲端產品設計」
• 謝耀輝 (John Sie), 盈科泛利股份有限公司
營運長 – 「用熱血和肝做為創業理想的養
分–產品開發辛酸血淚史」
• 簡少年 (Juvenile)， FHM網站企劃 -
「FHM正妹網站企劃新手之路」
HPX Party 網站

34. 蔡明哲 Richard Tsai
悠識數位 首席資訊架構師 /
HPX 社群創辦人
• 服務
– 找出網站設計或企劃的問題
– 提供UI/Usability的建議
– 提供網站企劃及Prototype Design的
服務
– 提供網站企劃的內功心法/秘笈/工具