讓兌換變成轉換：打造多平台優惠兌換體驗
讓兌換變成轉換：打造多平台優惠兌換體驗
為強化優惠活動轉換力，我們將原本獨立的優惠序號兌換流程，整合進 App 與 Web 等終端產品中，提升新用戶轉換與使用體驗。
為強化優惠活動轉換力，我們將原本獨立的優惠序號兌換流程，整合進 App 與 Web 等終端產品中，提升新用戶轉換與使用體驗。
Role
Role
Product Designer
Product Designer
Duration
Duration
2 months・2023
2 months・2023
Platform
Platform
Mobile Web (In-App Webview)
Mobile Web (In-App Webview)
Background
Background
公司核心服務旨在為車主提供於停車場和加油站便捷付款的體驗，而其中一項產品線，是將付款服務授權給合作平台，使其會員能夠使用。
在這樣的商業模式下，我們的目標是增加產生交易的的車牌量。
當有新的合作平台加入時，我們通常會共同策劃推廣活動，以吸引更多新會員加入。因此團隊發現，若能提供「優惠序號兌換」的活動作為進入點，對於吸引用戶嘗試服務特別有效，也能促成首次交易。
公司核心服務旨在為車主提供於停車場和加油站便捷付款的體驗，而其中一項產品線，是將付款服務授權給合作平台，使其會員能夠使用。
在這樣的商業模式下，我們的目標是增加產生交易的的車牌量。
當有新的合作平台加入時，我們通常會共同策劃推廣活動，以吸引更多新會員加入。因此團隊發現，若能提供「優惠序號兌換」的活動作為進入點，對於吸引用戶嘗試服務特別有效，也能促成首次交易。
Goal
Goal
整合並擴展優惠兌換功能
至所有用戶端產品
本次專案的核心目標，是在產品的服務頁面中新增「優惠兌換」的操作入口，並同步支援多個終端平台（如 App、Web 等）。透過這項整合，期望引導新會員順利完成首次交易，進一步提升平台的活躍度。
過去，優惠兌換功能僅以獨立活動網頁形式，支援單一 App 平台，而未整合進服務授權架構中。但隨著服務擴展，我們希望將此功能內嵌於主要產品中，打造一致且流暢的使用體驗，並強化交易誘因。
本次專案的核心目標，是在產品的服務頁面中新增「優惠兌換」的操作入口，並同步支援多個終端平台（如 App、Web 等）。透過這項整合，期望引導新會員順利完成首次交易，進一步提升平台的活躍度。
過去，優惠兌換功能僅以獨立活動網頁形式，支援單一 App 平台，而未整合進服務授權架構中。但隨著服務擴展，我們希望將此功能內嵌於主要產品中，打造一致且流暢的使用體驗，並強化交易誘因。
Challenge
Challenge
1
1
1
用戶體驗探索
用戶體驗探索
用戶體驗探索
原始需求是讓會員「登入後輸入序號，即可兌換優惠」。看似簡單。然而身為設計端，我們需要先釐清用戶在過程中的潛在需求。
此外，我們還需設計出符合舊有序號網站後台邏輯的前端畫面，確保整體流程直覺，並減少用戶對客服的依賴。
原始需求是讓會員「登入後輸入序號，即可兌換優惠」。看似簡單。然而身為設計端，我們需要先釐清用戶在過程中的潛在需求。
此外，我們還需設計出符合舊有序號網站後台邏輯的前端畫面，確保整體流程直覺，並減少用戶對客服的依賴。
2
2
2
Web 實作需求
本功能需支援多個終端平台（如 App、Web）。因此為加快上線時程，團隊選擇在 App 中嵌入 WebView，快速實現跨平台的一致功能體驗。
本功能需支援多個終端平台（如 App、Web）。因此為加快上線時程，團隊選擇在 App 中嵌入 WebView，快速實現跨平台的一致功能體驗。
Process
Process
理解原有痛點
理解原有痛點
過去，我們曾在「車麻吉」平台使用一個獨立的兌換網頁，用來吸引用戶註冊。
其流程為：非會員可先輸入優惠序號領取優惠，之後再完成註冊並享有優惠內容。
這個設計初衷是降低註冊門檻，提高活動參與率。
然而，這個看似順暢的流程實際上存在不少問題：
過去，我們曾在「車麻吉」平台使用一個獨立的兌換網頁，用來吸引用戶註冊。
其流程為：非會員可先輸入優惠序號領取優惠，之後再完成註冊並享有優惠內容。
這個設計初衷是降低註冊門檻，提高活動參與率。
然而，這個看似順暢的流程實際上存在不少問題：
註冊後，用戶無法在 App 內查詢已領取的優惠。
註冊後，用戶無法在 App 內查詢已領取的優惠。
優惠資訊散落，缺乏統一入口，導致大量用戶轉而詢問客服。
優惠資訊散落，缺乏統一入口，導致大量用戶轉而詢問客服。
若用戶想了解優惠券的「條件、額度」等細節，需特地查找活動網頁的條款說明，從而提高理解優惠的門檻。
若用戶想了解優惠券的「條件、額度」等細節，需特地查找活動網頁的條款說明，從而提高理解優惠的門檻。
設計策略
設計策略
參考其他產品的同質功能與既有的使用問題後，我彙整出以下設計策略：
參考其他產品的同質功能與既有的使用問題後，我彙整出以下設計策略：
及時反饋：
使用者輸入序號後，能立刻得知是否兌換成功及後續操作指引。
及時反饋：
使用者輸入序號後，能立刻得知是否兌換成功及後續操作指引。
資訊透明：
在優惠券中提供清楚的使用條件與剩餘額度。
資訊透明：
在優惠券中提供清楚的使用條件與剩餘額度。
設計發想
設計發想
在設計初期，我了解到根據後台兌換邏輯，用戶可透過序號兌換到「優惠券」或「點數」兩種類型。因此在介面設計時，我特別關注優惠兌換的介面流程，以及相對應的提示是否清楚。
在設計初期，我了解到根據後台兌換邏輯，用戶可透過序號兌換到「優惠券」或「點數」兩種類型。因此在介面設計時，我特別關注優惠兌換的介面流程，以及相對應的提示是否清楚。
Final Design
Final Design
1
1
1
輸入序號與兌換流程
輸入序號與兌換流程
用戶輸入序號後，不管是兌換點數還是優惠券，透過彈窗即時收到兌換結果與後續引導，方便後續查閱。
用戶輸入序號後，不管是兌換點數還是優惠券，透過彈窗即時收到兌換結果與後續引導，方便後續查閱。
2
2
2
優惠券資訊展示
優惠券資訊展示
每張優惠券清楚標示使用限制（如使用次數、車牌限制）。若有活動頁說明，也能透過連結導向，讓用戶和客服都能夠放心。
每張優惠券清楚標示使用限制（如使用次數、車牌限制）。若有活動頁說明，也能透過連結導向，讓用戶和客服都能夠放心。
3
3
3
失效與使用完畢狀態一覽
失效與使用完畢狀態一覽
優惠券到期或用盡時，仍保留於記錄中，避免用戶混淆或誤會優惠「憑空消失」。
優惠券到期或用盡時，仍保留於記錄中，避免用戶混淆或誤會優惠「憑空消失」。
Outcome
Outcome
更直觀的優惠兌換體驗
更直觀的優惠兌換體驗
用戶能直接在產品中完成兌換並查詢優惠內容，免去額外聯繫客服的需求。
客服反映相關查詢明顯下降，用戶更能自主理解與使用優惠。
用戶能直接在產品中完成兌換並查詢優惠內容，免去額外聯繫客服的需求。
客服反映相關查詢明顯下降，用戶更能自主理解與使用優惠。
Takeaways
Takeaways
本次專案帶給我兩個重要的學習與反思：
跨部門早期對齊，有助減少返工與拉扯：設計初期便與 PM、工程師一同討論，讓技術可行性與使用流程同步確認，避免後期卡關。
釐清後台邏輯，有助優化設計細節：面對優惠邏輯複雜、使用條件繁瑣的情況，深入了解後台處理方式，有助於界面提示與流程設計更貼近實際。
本次專案帶給我兩個重要的學習與反思：
跨部門早期對齊，有助減少返工與拉扯：設計初期便與 PM、工程師一同討論，讓技術可行性與使用流程同步確認，避免後期卡關。
釐清後台邏輯，有助優化設計細節：面對優惠邏輯複雜、使用條件繁瑣的情況，深入了解後台處理方式，有助於界面提示與流程設計更貼近實際。
Next Project
Next Project
Next Project
© Yuan Chiu 2024 Copyright. All Rights Reserved.