「為什麼現在就要選配送方式?」
「為什麼現在就要選配送方式?」
「為什麼現在就要選配送方式?」
重新設計 UNIQLO App 的購物流程,探索如何在系統限制與使用者體驗之間取得平衡
重新設計 UNIQLO App 的購物流程,探索如何在系統限制與使用者體驗之間取得平衡
重新設計 UNIQLO App 的購物流程,探索如何在系統限制與使用者體驗之間取得平衡
專案時間
專案時間
JUN.2026 - SEP.2026
JUN.2026 - SEP.2026
角色
角色
產品設計師
產品設計師
使用工具
使用工具
Figma、Gemini、Gemini Notebook
Figma、Gemini、Gemini Notebook
專案進程
專案規劃
專案規劃
目標分析
目標分析
使用者訪談
使用者訪談
定義問題
定義問題
競品分析
競品分析
發想
Prototype
產品測試
Iteration
發想
Prototype
產品測試
Iteration
專案目標
專案目標
透過使用者訪談,我發現使用者的不滿主要集中在兩個層面:
透過使用者訪談,我發現使用者的不滿主要集中在兩個層面:
1.
資訊架構
首頁缺乏明確的下一步,使用者需要逐一點擊 NavBar 才找到商品列表
1.
資訊架構
首頁缺乏明確的下一步,使用者需要逐一點擊 NavBar 才找到商品列表
1.
資訊架構
首頁缺乏明確的下一步,使用者需要逐一點擊 NavBar 才找到商品列表
1.
資訊架構
首頁缺乏明確的下一步,使用者需要逐一點擊 NavBar 才找到商品列表
2.
購物流程
使用者在加入購物車前,就必須在「宅配」、「超商取貨」與「門市取貨」中選擇配送方式。
2.
購物流程
使用者在加入購物車前,就必須在「宅配」、「超商取貨」與「門市取貨」中選擇配送方式。
2.
購物流程
使用者在加入購物車前,就必須在「宅配」、「超商取貨」與「門市取貨」中選擇配送方式。
2.
購物流程
使用者在加入購物車前,就必須在「宅配」、「超商取貨」與「門市取貨」中選擇配送方式。
因此,本次專案除了改善資訊架構,更將著重於重新思考「使用者應該在什麼時候做配送決策?」
我的假設是:
因此,本次專案除了改善資訊架構,更將著重於重新思考「使用者應該在什麼時候做配送決策?」
我的假設是:
讓使用者先完成選購,再於購物車處理配送,可以降低前期的認知負擔,提升購物體驗。
讓使用者先完成選購,再於購物車處理配送,可以降低前期的認知負擔,提升購物體驗。

使用者旅程地圖(User Journey Map)
使用者旅程地圖(User Journey Map)
分析問題:為什麼配送方式會出現在商品頁?
分析問題:為什麼配送方式會出現在商品頁?
UNIQLO 的門市快取服務高度依賴門市庫存,而不同商品可能因庫存位置不同,適用不同的配送方式。
因此,系統需要在加入購物車時提前判斷:
UNIQLO 的門市快取服務高度依賴門市庫存,而不同商品可能因庫存位置不同,適用不同的配送方式。
因此,系統需要在加入購物車時提前判斷:
1.
商品可使用哪些配送方式
1.
商品可使用哪些配送方式
2.
不同商品是否需要拆成不同訂單
2.
不同商品是否需要拆成不同訂單
3.
門市庫存是否能支援取貨需求
3.
門市庫存是否能支援取貨需求

既有結帳流程(Current User Flow)
既有結帳流程(Current User Flow)
這讓系統能提早完成訂單分組與配送限制判斷,但也代表使用者必須在尚未完成購物車組合之前,就做出配送決策。
這讓系統能提早完成訂單分組與配送限制判斷,但也代表使用者必須在尚未完成購物車組合之前,就做出配送決策。
1.
配送決策的決策位置過早,增加認知負擔
這讓系統能提早完成訂單分組與配送限制判斷,但也代表使用者必須在尚未完成購物車組合之前,就做出配送決策。
1.
配送決策的決策位置過早,增加認知負擔
這讓系統能提早完成訂單分組與配送限制判斷,但也代表使用者必須在尚未完成購物車組合之前,就做出配送決策。
1.
配送決策的決策位置過早,增加認知負擔
這讓系統能提早完成訂單分組與配送限制判斷,但也代表使用者必須在尚未完成購物車組合之前,就做出配送決策。
1.
配送決策的決策位置過早,增加認知負擔
這讓系統能提早完成訂單分組與配送限制判斷,但也代表使用者必須在尚未完成購物車組合之前,就做出配送決策。
2.
使用者還沒有完成購物車的組合
使用者確定購物車的組合後,才能做出最接近真實情況的決策。
2.
使用者還沒有完成購物車的組合
使用者確定購物車的組合後,才能做出最接近真實情況的決策。
2.
使用者還沒有完成購物車的組合
使用者確定購物車的組合後,才能做出最接近真實情況的決策。
2.
使用者還沒有完成購物車的組合
使用者確定購物車的組合後,才能做出最接近真實情況的決策。
2.
使用者還沒有完成購物車的組合
使用者確定購物車的組合後,才能做出最接近真實情況的決策。
第一次假設&核心挑戰
第一次假設&核心挑戰
根據以上分析所提出的假設是 — 讓使用者先完成選購,再於購物車處理配送,可以降低前期的認知負擔,提升購物體驗。
新的使用者流程:
根據以上分析所提出的假設是 — 讓使用者先完成選購,再於購物車處理配送,可以降低前期的認知負擔,提升購物體驗。
新的使用者流程:
新使用者結帳流程(New User Flow)
新使用者結帳流程(New User Flow)
核心挑戰1:如何在購物車中進行分流?
核心挑戰1:如何在購物車中進行分流?
新的購物車分成三個分頁:
新的購物車分成三個分頁:
1.
待選分類
1.
待選分類
2.
門市取貨
2.
門市取貨
3.
宅配/超商取貨
3.
宅配/超商取貨
僅能使用特定配送方式的商品,系統直接分流;需要使用者決策的商品則保留在「待選分類」。
透過badge與notification提醒商品狀態變化,避免使用者需要自行理解新流程的邏輯。
僅能使用特定配送方式的商品,系統直接分流;需要使用者決策的商品則保留在「待選分類」。
透過badge與notification提醒商品狀態變化,避免使用者需要自行理解新流程的邏輯。
購物車根據配送方式分流
購物車根據配送方式分流

商品狀態變化
商品狀態變化
核心挑戰2:如何降低多訂單造成的干擾?
核心挑戰2:如何降低多訂單造成的干擾?
原流程透過提前選擇配送方式,直接阻止可能造成多訂單的商品組合。新的流程將改為 — 讓使用者先購物,利用系統提示與庫存資訊進行間接預防。讓系統提供判斷依據,而不是直接打斷使用者的購物流程。
原流程透過提前選擇配送方式,直接阻止可能造成多訂單的商品組合。新的流程將改為 — 讓使用者先購物,利用系統提示與庫存資訊進行間接預防。讓系統提供判斷依據,而不是直接打斷使用者的購物流程。
1.
1.
加入購物車前,提醒配送限制
加入購物車前,提醒配送限制
加入購物車前,提醒配送限制

2.
2.
選擇取貨門市時,優先呈現能滿足最多商品的門市
選擇取貨門市時,優先呈現能滿足最多商品的門市
選擇取貨門市時,優先呈現能滿足最多商品的門市

3.
3.
提供各門市商品取貨狀況查詢
提供各門市商品取貨狀況查詢
提供各門市商品取貨狀況查詢

核心挑戰3:如果多訂單仍然發生?
核心挑戰3:如果多訂單仍然發生?
讓系統提供判斷依據,而不是直接打斷使用者的購物流程。
讓系統提供判斷依據,而不是直接打斷使用者的購物流程。

引導使用者解決問題
直接結帳
刪除商品
更換發貨貨源
更換取貨門市
更換配送方式


商品卡片
使用者測試
使用者測試
我透過三種情境測試新的 User Flow:
我透過三種情境測試新的 User Flow:
1.
Happy Path:能否理解新的購物車分流?
1.
Happy Path:能否理解新的購物車分流?
2.
Sad Path:能否理解可合併的多訂單情境?
2.
Sad Path:能否理解可合併的多訂單情境?
3.
Edge Case:能否理解不可合併訂單的原因並完成決策?
3.
Edge Case:能否理解不可合併訂單的原因並完成決策?
測試結果:
測試結果:
Happy Path|100%
所有受試者皆能在試誤後完成任務。
Sad Path|67%
2/3 能獨立完成;1/3 無法完成。
Edge Case|0%
2/3無法獨力完成;
1/3 因為需要分開取貨而放棄結帳。
Happy Path|100%
Happy Path|100%
所有受試者皆能在試誤後完成任務。
Sad Path|67%
Sad Path|67%
2/3 能獨立完成;1/3 無法完成。
Edge Case|0%
Edge Case|0%
2/3無法獨力完成;
1/3 因為需要分開取貨而放棄結帳。
結果顯示,新的流程確實降低了前期配送決策的干擾,但當物流複雜度進入購物車後,新的認知負擔也隨之出現。
結果顯示,新的流程確實降低了前期配送決策的干擾,但當物流複雜度進入購物車後,新的認知負擔也隨之出現。
測試洞察 → Iteration
測試洞察 → Iteration
1.
使用者遇到問題前,不會主動閱讀複雜資訊
在Sad Path中,多數受試者雖然看到系統提示,仍然選擇先進入結帳,直到發現無法使用優惠券才回頭處理。
1.
使用者遇到問題前,不會主動閱讀複雜資訊
在Sad Path中,多數受試者雖然看到系統提示,仍然選擇先進入結帳,直到發現無法使用優惠券才回頭處理。
1.
使用者遇到問題前,不會主動閱讀複雜資訊
在Sad Path中,多數受試者雖然看到系統提示,仍然選擇先進入結帳,直到發現無法使用優惠券才回頭處理。
2.
使用者不在乎完整的物流邏輯,只想用最省事的方式完成購物
另外,當詢問受試者是否明白「門市現貨」及「倉庫調貨」分成兩張訂單的原因時,部分使用者表示:「即使理解,也希望系統直接幫忙處理。」
2.
使用者不在乎完整的物流邏輯,只想用最省事的方式完成購物
另外,當詢問受試者是否明白「門市現貨」及「倉庫調貨」分成兩張訂單的原因時,部分使用者表示:「即使理解,也希望系統直接幫忙處理。」
2.
使用者不在乎完整的物流邏輯,只想用最省事的方式完成購物
另外,當詢問受試者是否明白「門市現貨」及「倉庫調貨」分成兩張訂單的原因時,部分使用者表示:「即使理解,也希望系統直接幫忙處理。」
改善方案
改善方案
改善1:系統判斷以「最少訂單量」作為優先條件
改善1:系統判斷以「最少訂單量」作為優先條件
門市取貨方式,由系統主動尋找較省事的配送組合,將原本需要使用者判斷的問題,盡可能交給系統處理。
選擇取貨門市頁面以訂單最少的門市為優先呈現。
門市取貨方式,由系統主動尋找較省事的配送組合,將原本需要使用者判斷的問題,盡可能交給系統處理。
選擇取貨門市頁面以訂單最少的門市為優先呈現。

以「快速取貨」為優先

以「最少訂單」為優先
改善2:將系統提示位置調整至Footer上方
改善2:將系統提示位置調整至Footer上方
將提示移到下一步的按鈕旁邊,讓訊息自然而然進入使用者的視野。
將提示移到下一步的按鈕旁邊,讓訊息自然而然進入使用者的視野。
改善3:將「倉庫發貨」改成「倉庫調貨」,並增加圖文說明。
改善3:將「倉庫發貨」改成「倉庫調貨」,並增加圖文說明。
當使用者遇到需自行判斷的情境時,可以更快速地理解。
當使用者遇到需自行判斷的情境時,可以更快速地理解。


反思:這次改動真的值得嗎?
反思:這次改動真的值得嗎?
回歸到最初的假設,將配送決策移至購物車,確實消除了—「為什麼現在就要選配送方式?」,卻產生了新的問題:
回歸到最初的假設,將配送決策移至購物車,確實消除了—「為什麼現在就要選配送方式?」,卻產生了新的問題:
1.
對使用者的影響
需要重新學習購物車結構與操作方式。
1.
對使用者的影響
需要重新學習購物車結構與操作方式。
1.
對使用者的影響
需要重新學習購物車結構與操作方式。
1.
對使用者的影響
需要重新學習購物車結構與操作方式。
2.
對系統的影響
需要處理更複雜的配送判斷、庫存組合與訂單分流。
2.
對系統的影響
需要處理更複雜的配送判斷、庫存組合與訂單分流。
2.
對系統的影響
需要處理更複雜的配送判斷、庫存組合與訂單分流。
2.
對系統的影響
需要處理更複雜的配送判斷、庫存組合與訂單分流。
3.
對商業模式的影響
當「最少訂單量」成為更高優先級後,可能增加「門市取貨—倉庫調貨」的訂單,進而影響庫存配置與物流成本。
3.
對商業模式的影響
當「最少訂單量」成為更高優先級後,可能增加「門市取貨—倉庫調貨」的訂單,進而影響庫存配置與物流成本。
3.
對商業模式的影響
當「最少訂單量」成為更高優先級後,可能增加「門市取貨—倉庫調貨」的訂單,進而影響庫存配置與物流成本。
我的結論是 — 現階段我不會直接使用新流程取代既有流程。應將這次改版視為經過驗證的解決方向,進一步評估:
我的結論是 — 現階段我不會直接使用新流程取代既有流程。應將這次改版視為經過驗證的解決方向,進一步評估:
1.
使用者對於新流程的接受度
1.
使用者對於新流程的接受度
2.
使用者對「最少訂單」系統判斷的接受度與手動調整率
2.
使用者對「最少訂單」系統判斷的接受度與手動調整率
3.
新流程對庫存與物流成本的實際影響
3.
新流程對庫存與物流成本的實際影響
我從這次專案學到的事
我從這次專案學到的事
使用者不需要理解系統
使用者不需要理解系統
好的UX不需要使用者理解完整的系統邏輯,只需要知道:「我現在需要做什麼?」
好的UX不需要使用者理解完整的系統邏輯,只需要知道:「我現在需要做什麼?」
每一個解決方案都會帶來新的問題
每一個解決方案都會帶來新的問題
將配送決策移至購物車解決了前期的認知負擔,卻讓購物車中的結帳流程變複雜。
將配送決策移至購物車解決了前期的認知負擔,卻讓購物車中的結帳流程變複雜。
測試的真正價值
測試的真正價值
測試結果讓我發現,原本認為更順暢的流程,未必值得真正取代既有流程。
測試結果讓我發現,原本認為更順暢的流程,未必值得真正取代既有流程。

User Flow改版成果

User Flow改版成果
Happy Path
Happy Path
其中一件商品無門市現貨,系統以「最少訂單」為優先,將所有商品判斷為「倉庫調貨」。
其中一件商品無門市現貨,系統以「最少訂單」為優先,將所有商品判斷為「倉庫調貨」。
Sad Path
Sad Path
訂單無法合併時,提供清楚的系統提醒,幫助使用者瞭解狀況,並做出決策。
訂單無法合併時,提供清楚的系統提醒,幫助使用者瞭解狀況,並做出決策。

User Flow改版成果

User Flow改版成果
提升找衣服的體驗
提升找衣服的體驗
重新規劃首頁內容、改善商品分類UI,幫助使用者更無腦地找到商品。
重新規劃首頁內容、改善商品分類UI,幫助使用者更無腦地找到商品。


原首頁及商品分類
原首頁及商品分類
新增放大瀏覽功能
新增放大瀏覽功能
用簡單的收合介面,解決使資訊不易閱讀的困擾,提升產品包容性。
用簡單的收合介面,解決使資訊不易閱讀的困擾,提升產品包容性。
新增穿搭分類
新增穿搭分類
匯集UNIQLO既有的系列商品及雜誌內容,讓使用者一鍵抵達,提升企業形象。
匯集UNIQLO既有的系列商品及雜誌內容,讓使用者一鍵抵達,提升企業形象。
專案中的AI運用
專案中的AI運用
60% 設計夥伴
60% 設計夥伴
協助整理研究與測試資料
協助整理研究與測試資料
歸納使用者行為與問題
歸納使用者行為與問題
10% 快速原型製作
10% 快速原型製作
快速建立互動原型,支援設計溝通
快速建立互動原型,支援設計溝通
30% 研究與整理
30% 研究與整理
討論 UNIQLO 的物流與系統限制
討論 UNIQLO 的物流與系統限制
協助比較不同解決方案的取捨
協助比較不同解決方案的取捨