充值功能 — 客戶端頁面完整互動線框稿 v3

Interactive Wireframe · 含查看訂單頁 · UX 防呆優化版

📐 充值功能完整交互流程

▎主流程（Happy Path）
進入充值頁
→
KYC 檢查
→
選擇
充值金額
→
根據金額
選擇活動
→
輸入優惠碼
（可選）
→
選擇支付
方式
→
查看支付
詳情/複製
→
確認訂單
彈窗
→
安全驗證
6位碼
→
處理中
倒計時
→
充值成功
→
查看訂單
詳情頁
▎分支路徑（異常 & 防呆攔截）
KYC 檢查
→ 未通過 →
攔截彈窗
引導驗證
→
前往 KYC
→ 完成後 →
返回充值頁
繼續流程
充值金額
→ 低於最低 / 超過上限 →
紅字即時提示
CTA 禁用
→ 修正後 →
繼續流程
優惠碼
→ 無效碼 →
紅字錯誤提示
Toast 通知
→ 重新輸入 or 略過 →
繼續流程
安全驗證
→ 未輸入完整 →
Toast 提示
留在驗證頁
| 超時未收到 →
重新發送
處理中
→ 超時 / 失敗 →
充值失敗
彈窗
→
重試
或
聯繫客服
▎輔助功能入口
充值記錄
Tab 篩選
|
訂單詳情
時間軸
|
聯繫客服
導航列
|
服務條款
底部連結
|
負責任博弈
頁面底部
起點
選擇步驟
條件判斷
交互動作
成功結果
失敗/攔截
頁面/入口
21:30📶 🔋 85%
充值
1
金額
2
活動
3
支付
4
確認
✅
身份驗證已完成
充值功能已全面開放
›
帳戶餘額
1,280.50 USDT
UID: 88****321VIP 3
📊 單筆 10 – 50,000 📅 今日 $200 / $100K
① 充值金額✓
✓
50
✓
100
推薦
✓
200
✓
500
熱門
✓
1,000
✓
2,000
USDT
② 關聯活動 *必要✓
🎁
請先選擇充值金額
選擇金額後將顯示可關聯的活動及實際獎勵
🏷️ 有優惠碼？ ▾
③ 支付方式✓
💎
USDT (TRC-20)
即時到帳
手續費 0
✓
①複製地址
②錢包轉帳
③返回確認
充值地址TXkz7R...f9eQ3p
網路Tron (TRC-20)
確認數1 次
[ QR Code ]
⚠ 請確認網路為 TRC-20，錯誤網路將導致資產遺失且無法找回
🔷
USDT (ERC-20)
約 5 分鐘
Gas ≈ $2.5
✓
①複製地址
②錢包轉帳
③返回確認
充值地址0x8aB3...c7F21
預估 Gas≈ $2.5
[ QR Code ]
⚠ ERC-20 需 Gas Fee，到帳 = 充值額 − Gas
🏦
銀行轉帳
1-24 小時
依銀行費率
✓
①複製帳號
②銀行轉帳
③返回確認
收款銀行████ Bank
帳號****-****-8821
戶名████ Ltd.
備註欄必填 UID: 88****321
⚠ 備註欄必須填 UID，否則無法自動對帳
⚡
PIX 即時支付
巴西地區 · 即時
手續費 0
✓
①複製 Key
②PIX 轉帳
③返回確認
PIX Keypix-key-9a3f8b
匯率1 USDT ≈ R$ 5.78
[ QR Code PIX ]
⚠ 僅限巴西 CPF 持有者
④ 訂單摘要
充值金額100 USDT
關聯活動首充雙倍 +100
優惠碼+10
支付方式TRC-20
手續費0
實際到帳200 USDT
🛡️請理性娛樂。如需幫助，請聯繫負責任博弈支援。平台支援自我排除與限額設定。
到帳 200 USDT
含首充雙倍 +100
充值即同意 《服務條款》
21:31📶 🔋 85%
訂單詳情
✅
充值成功
資金已到帳，活動獎勵已發放
訂單資訊
訂單編號#RC20250310-0821
充值金額100 USDT
關聯活動首充雙倍
活動獎勵+100 USDT
支付方式USDT (TRC-20)
手續費0
實際到帳200 USDT
處理進度
訂單建立
2025-03-10 21:30:15
安全驗證通過
2025-03-10 21:30:22
區塊鏈確認 (1/1)
2025-03-10 21:30:28
充值到帳 +100 USDT
2025-03-10 21:30:28
活動獎勵發放 +100 USDT
2025-03-10 21:30:29

💡 互動指引

🛡️ 防呆設計