Skip to main content

Bố Cục Quyền Lợi & Tiến Trình Lên Hạng Từng Hạng Thành Viên

Ngày cập nhật: 20/06/2026
File ảnh gốc: z7956577882399_d816d28912b14ea4cd795e6063a33b88.jpg

Tài liệu này đặc tả yêu cầu thay đổi thiết kế giao diện (UI Layout) màn hình Membership trên Mobile App, tập trung vào việc hiển thị riêng biệt từng hộp quyền lợi và tiến trình thăng hạng của khách hàng.

1. Yêu Cầu Về Quyền Lợi Hạng Thành Viên (Benefit Boxes Layout)​

  • Nguyên tắc: Quyền lợi của mỗi hạng thẻ (Silver, Gold, Platinum, Diamond) là khác nhau về mặt nội dung và số lượng. Hệ thống Client App phải load động dữ liệu này từ API Backend.
  • Thay đổi bố cục (UI Layout):

Thiết kế tách biệt các hộp quyền lợi

  • Tách riêng các hộp quyền lợi:
    • Không gộp chung các quyền lợi thành một hàng ngang (lưới 3 cột).
    • Tách biệt mỗi quyền lợi thành một hàng/card (Box) độc lập, xếp chồng dọc lên nhau ở nửa dưới màn hình (minh họa bằng các khung đỏ ở Ảnh).
    • Mỗi box chỉ chứa duy nhất thông tin của 01 quyền lợi, hiển thị rõ ràng: Biểu tượng/Icon (bên trái), Tiêu đề quyền lợi (Bold) và Mô tả chi tiết.

2. Yêu Cầu Về Tiến Trình Lên Hạng (Status Progress Card)​

  • Hiển thị thông tin tiến trình:
    • Hiển thị thanh tiến trình (Progress Bar) mô tả số tiền đã chi tiêu trong chu kỳ xét hạng (Ví dụ: Đã tiêu: 2.000.000 VNĐ).
    • Card thông báo thăng hạng: Thêm một block thông báo nổi bật nằm ngay dưới thanh tiến trình (khung đỏ phía trên ở Ảnh) ghi rõ số tiền còn thiếu và quyền lợi của hạng tiếp theo để tạo động lực tiêu dùng:

      “💪 Chỉ còn thiếu 43.000.000đ để thăng hạng Platinum và nhận hoàn Point đến 8%”