系統開發與應用

Lesson 5 使用者旅程圖

一張圖顯示「使用者體驗」的每個環節，讓我們可以快速理解產品需要「改善的課題」

https://miro.medium.com/max/931/1*VBSQtSeaVmODMgL0rAhhNg.png

麥當勞消費時的「使用體驗」（情緒脈動）

正面

負面

中性

之前

之間

之後

https://static.accupass.com/userupload/cfaffddf66cf4c019162e3f57ea3ca9d.jpg

正面

負面

中性

音樂App的「使用體驗」（情緒脈動）

https://img.akanelee.me/20190703-2.jpg

服務接觸點

更多接觸點範例

搭乘機場捷運、同時辦理「預辦登機」與「托運行李」

可能之接觸點

網站可能的接觸點

https://www.webfx.com/blog/images/assets/cdn.sixrevisions.com/0340-06_example_customer_journey_map.jpg

電子郵件

聯絡我們表單

電話

即時聊天

粉絲專頁評論

使用者旅程圖經常與「人物誌」相結合

正面

負面

中性

接觸點

人物誌目標

https://inside-assets1.inside.com.tw/2019/6/b4jnim8ifzp5zko5kjjqzp2eyo5s0i.png?auto=compress&fit=max&w=730

https://miro.medium.com/max/700/0*senMqoo-gyaQznua.png

使用者旅程圖工作坊

• 約4~8人
• 界定地圖範圍: 15分鐘
• 討論時間: 90分鐘

工作坊步驟

1. 界定地圖範圍
2. 建立人物誌
3. 定義「情境」與「使用者目標」
4. 建立一系列「接觸點」
5. 考量使用者的期待、感受...
6. 繪製情緒線（使用者旅程）
7. 考量每一互動階段時，使用者的情緒狀態
8. 驗證與修正使用者旅程

練習：到餐廳用餐

https://km.pmtone.com/wp-content/uploads/sites/5/empathy_map_1-1024x765.png

想法和感覺 (Think & Feel)

聽到了甚麼 (Hear)

看到了甚麼 (See)

說了甚麼 做了甚麼 (Say & Do)

痛苦 (Pain)：痛點

獲得 (Gain)：甜蜜點

了解使用者需求的利器- 同理心地圖

從「人物誌」角色的角度，進而去思考下列6各面向可能的內容

• 他們會如何思考與感受焦慮或期待的事情 ？
• 他們會如何思考與感受焦慮或期待的事情 ？
• 他們可能會藉由誰來得知我們的產品？
• 在他們生活的環境中，他們會如何使用我們的產品？
• 當他們在公眾或私下使用我們的產品時，會說些或做些甚麼？
• 他們使用我們的產品時會遇到甚麼困難或痛苦？
• 他們使用我們的產品時可以得到哪些益處？

同理心思考角度的範例

使用者旅程圖

1. 使用者訪談做調查

2. 建立簡易人物誌（替代方案: 相關之調查報告）

3. 製作使用者旅程圖

三步驟製作使用者旅行圖

將使用者體驗變成可俯瞰整體的地圖

《WEB 設計職人必修：UX Design 初學者學習手冊》P.131

使用者訪談可能的問題

1. 將地圖劃分為 「步驟」、「接觸點」、「行動」、「思考」、「情感曲線」五個區塊

2. 想像人物誌的人物會如何行動，將跟「行動」有關的便利貼，黏貼於「行動」區塊

3. 想像人物誌的人物會如何思考，將跟「思考」有關的便利貼，黏貼於「思考」區塊

4. 將大致的步驟寫在便利貼上，黏貼於「步驟」區塊

5. 把在「步驟」的人物、店面、網站當作「接觸點」寫在便利貼上，黏貼於「接觸點」區塊

6.試著想像人物的情緒起伏，描繪「情感曲線」

https://miro.medium.com/max/700/1*_VpV6tfQ8Hka4q8cuPD-6Q.png

使用者旅程圖「後製」模板（詳見ilms課程說明）

《WEB 設計職人必修：UX Design 初學者學習手冊》P.141

案例: 客服網站流程改善

《WEB 設計職人必修：UX Design 初學者學習手冊》