Đây là case study UI UX redesign cho một app giao hàng nội thành tại TP.HCM. App đã có 50.000 downloads nhưng chỉ 12% user quay lại sau lần đầu — dấu hiệu rõ ràng của UX thất bại. Sau khi redesign, retention rate tăng từ 12% lên 22% (tăng 85%), support tickets giảm 40%, và đơn hàng tăng 25%.
Bối cảnh: 50,000 downloads, 12% retention
Khách hàng: Startup giao hàng nội thành TP.HCM (tên đã thay đổi), hoạt động 1.5 năm, chuyên giao hàng nhanh (30 phút) cho F&B và retail.
| Chỉ số | Trước redesign |
|---|---|
| Downloads tổng | 50.000 |
| Monthly Active Users (MAU) | 6.000 |
| Day-1 Retention | 28% |
| Day-7 Retention | 12% |
| Day-30 Retention | 5% |
| Đơn hàng/tháng | 15.000 |
| Đánh giá App Store | 3.2/5 (287 reviews) |
| Support tickets/tháng | 800 |
| Avg. session duration | 2.1 phút |
Vấn đề: User tải app, dùng 1 lần, rồi bỏ
Phân tích reviews trên App Store và Google Play, nhóm theo chủ đề:
| Vấn đề | % reviews đề cập |
|---|---|
| ”Khó tìm nhà hàng/quán” | 35% |
| “Checkout phức tạp, chậm” | 28% |
| “Không biết shipper đang ở đâu” | 22% |
| “App chậm, loading lâu” | 20% |
| “Phải đăng ký trước khi xem menu” | 15% |
| “Giá hiện khác giá khi checkout” | 12% |
UX Audit: 7 vấn đề nghiêm trọng
Trinh Digital thực hiện UX audit toàn diện gồm: heuristic evaluation, user interviews (15 người), session recording analysis (Hotjar), và competitor benchmarking.
Vấn đề 1: Forced Registration
User mở app → bắt buộc đăng ký (email + SĐT + OTP + chọn khu vực) trước khi thấy bất kỳ nội dung nào. Drop-off tại bước đăng ký: 45%.
Vấn đề 2: Search & Discovery kém
Không có search bar nổi bật. Danh mục sắp xếp theo alphabet (A-Z) thay vì theo nhu cầu (Gần bạn, Phổ biến, Đang giảm giá). Không có filter theo giá, thời gian giao, rating.
Vấn đề 3: Checkout 7 bước
Flow checkout: Giỏ hàng → Đăng nhập → Nhập địa chỉ → Chọn phương thức giao → Chọn thanh toán → Nhập mã giảm giá → Xác nhận. Drop-off từ giỏ hàng đến hoàn tất: 72%.
Vấn đề 4: Real-time tracking không real-time
Map hiển thị vị trí shipper nhưng update mỗi 30 giây → shipper “nhảy” trên bản đồ. User không tin, gọi support hỏi “shipper đang ở đâu?” — chiếm 35% support tickets.
Vấn đề 5: Giá không minh bạch
Giá trên menu khác giá trong giỏ hàng (do thêm phí đóng gói, phí nền tảng). User cảm thấy bị “lừa” → review 1 sao.
Vấn đề 6: Không có feedback loop
Sau khi nhận hàng, không có prompt đánh giá. Khi có vấn đề, user phải tự tìm cách liên hệ support → phức tạp → bỏ luôn app.
Vấn đề 7: Performance issues
App load lần đầu: 6.2 giây. Mỗi trang chuyển: 2-3 giây. Ảnh nhà hàng/món ăn không optimize → data usage cao → user xài 4G phàn nàn.
Redesign: Giải pháp cho từng vấn đề
Fix #1: Guest Browsing + Social Login
Trước: Đăng ký bắt buộc → 45% drop-off.
Sau: Mở app → thấy ngay nhà hàng gần bạn (dùng GPS). Chỉ yêu cầu đăng nhập ở bước checkout. Đăng nhập bằng Zalo/Google 1 click.
Kết quả: Drop-off giảm từ 45% xuống 15%.
Fix #2: Search-first Discovery
Trước: Danh mục A-Z, không search nổi bật.
Sau:
- Search bar lớn ngay đầu trang: “Bạn muốn ăn gì?”
- Tabs: Gần bạn | Phổ biến | Freeship | Đang giảm
- Filter: khoảng cách, giá, rating, thời gian giao
- Gợi ý dựa trên lịch sử đặt
Fix #3: Checkout 3 bước
Trước: 7 bước, 72% drop-off.
Sau: 3 bước:
- Giỏ hàng (xem + sửa + nhập mã giảm giá) → “Tiếp tục”
- Giao & Thanh toán (1 trang: địa chỉ saved + phương thức thanh toán saved) → “Đặt hàng”
- Xác nhận (tự động chuyển sang tracking)
Kết quả: Drop-off giảm từ 72% xuống 31%.
Fix #4: Real-time Tracking thực sự
Nâng cấp tracking update mỗi 3-5 giây (thay vì 30 giây). Thêm:
- ETA chính xác: “Shipper sẽ đến trong 8 phút”
- Milestones: “Nhận đơn → Đến quán → Đã lấy hàng → Đang giao → Hoàn thành”
- Chat trực tiếp với shipper
Kết quả: Support tickets liên quan tracking giảm 65%.
Fix #5: Giá minh bạch
Hiện tất cả phí ngay trên trang menu:
- Giá món: 45.000 VND
- Phí giao hàng: 15.000 VND (hiện ngay, trước khi thêm vào giỏ)
- Phí dịch vụ: 3.000 VND
- Tổng ước tính: 63.000 VND
Không “giấu” phí đến bước cuối. User biết tổng tiền trước khi quyết định đặt.
Fix #6: Post-delivery Experience
Sau khi nhận hàng:
- Popup rating: “Bạn hài lòng với đơn hàng?” (1 tap: 1-5 sao)
- Nếu < 3 sao: “Có vấn đề gì? Chúng tôi xin lỗi. Chọn vấn đề:” (1 tap chọn)
- Voucher cho đơn tiếp theo
Fix #7: Performance Optimization
- Image optimization: WebP, lazy loading → load time giảm 60%
- Code splitting: chỉ load code cần thiết cho trang hiện tại
- Skeleton screen: hiện layout trước, nội dung sau
- App size: giảm từ 85MB xuống 42MB
Kết quả: Load time từ 6.2 giây xuống 2.1 giây.
Kết quả sau 3 tháng redesign
| Chỉ số | Trước | Sau 3 tháng | Thay đổi |
|---|---|---|---|
| Day-7 Retention | 12% | 22% | +85% |
| Day-30 Retention | 5% | 11% | +120% |
| Checkout completion | 28% | 69% | +146% |
| Đơn hàng/tháng | 15.000 | 18.750 | +25% |
| Support tickets/tháng | 800 | 480 | -40% |
| App Store rating | 3.2 | 4.3 | +34% |
| Avg. session duration | 2.1 phút | 4.8 phút | +129% |
| Load time | 6.2 giây | 2.1 giây | -66% |
Impact lên doanh thu: Tăng 25% đơn hàng × giá trị trung bình 80.000 VND = tăng ~300 triệu VND/tháng doanh thu.
Chi phí redesign
| Hạng mục | Chi phí |
|---|---|
| UX Audit + User Research | 30 triệu VND |
| UX/UI Redesign (toàn bộ app) | 60 triệu VND |
| Development (implement redesign) | 120 triệu VND |
| QA + Testing | 20 triệu VND |
| Tổng | 230 triệu VND |
ROI: Tăng 300 triệu/tháng doanh thu + giảm 20 triệu/tháng chi phí support = 320 triệu/tháng. Hoàn vốn trong < 1 tháng.
Quy trình UX Redesign: 4 phases
Phase 1: Research & Audit (2 tuần)
- Phân tích data: GA4, Hotjar heatmap, session recordings
- User interviews: 15 người (5 active users, 5 churned users, 5 new users)
- Competitor analysis: Grab Food, ShopeeFood, Baemin
- Heuristic evaluation: đánh giá theo 10 nguyên tắc Nielsen
Phase 2: Define & Design (3 tuần)
- User persona: 3 personas (dân văn phòng, sinh viên, nội trợ)
- User journey map: vẽ lại hành trình, đánh dấu pain points
- Wireframe: low-fidelity → test nhanh với 5 users → iterate
- UI Design: high-fidelity trên Figma, design system
Phase 3: Prototype & Test (1 tuần)
- Interactive prototype trên Figma
- Usability testing: 8 users, 5 tasks
- A/B test: checkout cũ vs mới (2 tuần production)
Phase 4: Implement & Measure (6 tuần)
- Development: phased rollout
- Launch: 10% traffic → 50% → 100%
- Monitor: retention, conversion, crash rate
- Iterate: dựa trên data tuần đầu
Bài học cho startup
1. Retention > Downloads
50.000 downloads mà chỉ 6.000 MAU = 88% wasted acquisition cost. Đầu tư $1 vào retention hiệu quả hơn $5 vào acquisition.
2. UX audit trước khi thêm features
Startup thường muốn thêm tính năng mới khi user bỏ đi. Sai. User bỏ vì UX tệ, không phải vì thiếu features. Fix UX trước, add features sau.
3. Số liệu không nói dối
Session recording cho thấy chính xác user bị “kẹt” ở đâu — không cần đoán. Cài Hotjar/Clarity (miễn phí) là bước đầu tiên. Đọc thêm 6 sai lầm UX phổ biến.
FAQ — Câu hỏi thường gặp
Redesign khác rebuild như thế nào?
Redesign: giữ nguyên backend/codebase, chỉ thay đổi giao diện và flow (thường 2-3 tháng, 150-300 triệu). Rebuild: xây lại từ đầu (4-8 tháng, 300-800 triệu). Nên redesign trước — nếu kết quả tốt, không cần rebuild.
Làm sao đo ROI của UX redesign?
3 metrics chính: (1) Retention rate tăng → user quay lại nhiều hơn, (2) Conversion rate tăng → revenue tăng, (3) Support tickets giảm → chi phí giảm. Đo trước redesign, đo sau 1-3 tháng. Liên hệ Trinh Digital để được audit UX miễn phí.
App của bạn có retention thấp? Liên hệ Trinh Digital để được UX audit miễn phí — chúng tôi sẽ phân tích data, phỏng vấn user, và đề xuất redesign plan cụ thể.