我挑選的案例
為什麼會選擇這篇 Case Study？
在第一步挑選案例時有兩個前提 :
- 本身也有使用過該 app 或相關服務
- 近兩年的文章，覺得可以跟現在版本做個對照
後來選出跟外送平台服務有關的 Redesign 文章:
- A UI/UX Case Study on Redesign of the Foodpanda App
- Panda-ring to the Crowd
- Making Foodpanda a more Personalised Experience
- GoFood Menu Selection Redesign — UX Case Study
最後選了第 4 篇，原因是有幾點我非常欣賞 :
- 研究架構與論述明確清晰。整個研究過程條理分明且有所依據，不會讓人感覺是為了做而做，或是憑空出現論據。在做易用性測試的時候還特別找跟 persona 相符特質的受訪者!
- 範圍定義跟解法很明確且聚焦。最後的產出跟一開始要解決的問題環環相扣，不會有前後對不上或是頭重腳輕 ( 研究做很多但解法簡單帶過 ) 的感覺。
- 前期研究，質化訪談跟量化訪談都有做。
- 整個研究很完整，作者用雙鑽石流程來進行 Redesign，每個階段的內容都十分充足，最後也有進行易用性測試，並根據回饋再進行修改。
以下正文開始 !
1. 作者 Redesign 動機為何 ? 是否為了解決某個問題 ?
動機 : 是作者在 Purwadhika Startup School 的 UI/UX 設計訓練營的最後一個專案而製作的。
想解決的問題 : 識別用戶在選擇食物、使用促銷直至付款時的痛點，以便可以改善流程。
2. 作者的設計流程與設計方法
各階段作者使用的 UX 方法:
Empathize 階段
- 線上問卷 (量化)
- 線上訪談 (質化)
Define 階段
- 親和圖法 (KJ 法)
- Persona 人物誌
- User Journey Map 用戶體驗地圖
Ideate 階段
- 2 x 2 優先權矩陣
- User Flow Chart
- Wireframe
- Design system
Test 階段
- prototype
- 易用性測試
3. 研究內容
Empathize 階段
作者在一開始的研究動機是「識別用戶在選擇食物、使用促銷直至付款時的痛點，以便我們可以改善流程。」
為此他列了幾個關鍵問題:
- 他們在 GoFood 點餐時的痛點是什麼？
- 是什麼促使用戶在線上訂餐？
- 他們在 GoFood 訂餐時的期望和需求是什麼？
並進行了用戶調查:
- 線上問卷 — 大約 20–35 歲的受訪者60 位
- 深度訪談 — 12位 線上訪談
Define 階段
發現下列一些問題 :
- 從調查結果來看，作者發現 58% 的受訪者打開 GoFood 後仍在尋找吃的東西。
- 從 KJ 法中，作者發現最困擾的領域是在食物選擇類別。
- 用戶探索他們喜歡的新食物時，他們想保存它以供以後再次訂購。但他們並沒有真正意識到最喜歡的功能，而是使用了歷史記錄。
我的想法 : 作者同時用了量化與質化分析，在量化分析作者得出「58%的受訪者打開 GoFood 後仍在尋找吃的東西」，這意味著用戶在打開 app 之前並不確定要吃甚麼，超過半數的人不只希望透過平台點餐，更可以讓他們找到想吃的餐點。
作者透過這些問題發現，製作了 persona
我的想法 : 從這裡我們可以理解到，作者的目標有兩個，
更好的個人化推薦，避免使用者需要花很多找要吃甚麼
「收藏喜歡的食物」的功能強調與優化。
我的想法 : 這裡作者還有分享一段話我覺得很關鍵，也是 UX 共學課程中有提到的重點: ” 隨著專案的進行，角色和使用者旅程都幫助我理解使用者的痛點、需求和目標。當我發展食物選擇體驗設計時，我不斷回顧它們。”
Ideate 階段
作者在定義問題後沒有急著跳入解法，而是與團隊思考了不同解決辦法並對此做優先權重的排序 :
「我們與團隊一起根據問題陳述收集所有可能的解決方案。然後我使用 2 x 2 優先權矩陣對它們進行優先權排序。優先順序是確定低工作量和高影響力的想法。」
在進行到 mockup 階段的時候，作者理解到GoFood 已經有了名為 Asphalt 的設計系統。因此，我在原型階段做的第一件事就是了解他們的系統。然後重新建立基本元件、顏色、排版和立面樣式。
而這也為他後續再迭代的過程中帶來很好的影響，不只讓畫面風格始終呈現一致性，在優化與維護也加快速度。
原型製作 :
作者重新設計了登陸頁面的推薦部分。此新推薦根據使用者經常搜尋的內容、使用者歷史記錄和趨勢類別顯示類別按鈕，以提供更好的探索體驗。這是受到 Tokopedia、youtube 和 pinterest 的啟發。
舊的最愛圖示與提要圖示結合在一起。這使得用戶不確定它是什麼圖標。所以作者將它們分開，並貼上標籤，因為作者認為提要圖示仍然是一個新概念，可能需要一個標籤來習慣。提要圖示取自 Tokopedia 提要圖示。在設計圖標時，我的目標是熟悉，基於 Steve Krug 的《Don’t Make Me Think》一書。
Test 階段
該測試針對三個角色與 Tommy 匹配的用戶進行。可用性測試是這個專案最關鍵的部分，因為作者揭示了使用者真正需要什麼。
我的想法 : 作者在者測試用戶的時候特別找跟人物誌角色特質相符合的，這個做法我沒想過，得到啟發!
為了衡量作者為 Tommy 提供的解決方案的成功程度，作者將測試分為四個任務：尋找推薦、查看所有推薦、從推薦中購買食物以及將菜單添加到他們的最愛。
我的想法 : 在 Empathize 跟 Define 階段，作者都有提到 時間 這個關鍵要素，ex. 希望減少時間找食物 如果在測試階段把使用者完成任務的時間一起作為關鍵指標會不會更好?
4. 迭代過程
第一版 user flow chart :
第二版 user flow chart :
原型的迭代
5. 小結
這個案例給我很多啟發，也給我一個很好的榜樣去理解 Redesign 的過程，我特別喜歡他在尋找要解決哪些問題時，把範圍跟解決辦法訂得很明確 (優化個人化體驗與收藏功能)，並在原型的製作上也緊扣這兩個解決目標。同時在找易用性測試的人時會找與 Persona 特質相符的受訪者，可說是整個流程都沒有偏題且目標明確。在構思解決方案的環節，也做到了發散，再用優先級矩陣來收斂。
整個設計流程作者都很有意識的去: 找對問題、找對解法、找到對的人去執行。
最後也很感謝看到這裡的你!
有想法或建議歡迎留言給我 😊