充值提現(xiàn)已經成為很多app不成或缺的重要部分，無論是支付平臺、直播打賞，還是付費閱讀、電商消費，凡是涉及業(yè)務金錢方面的產品都會涉及到余額賬戶系統(tǒng)，可以細分為三項功能模塊，別離是：充值、提現(xiàn)和賬戶綁定。

看似簡單，卻與相當多的產品功能用戶使用場景交織在一起，受到產品類型、用戶定位、業(yè)務邏輯、使用場景、用戶操作等差別因素影響，設計好充值提現(xiàn)模塊并沒有那么簡單。

本文主要從以下4個問題進行分析說明：

充值和提現(xiàn)的類型充值和提現(xiàn)模塊需求相關細節(jié)充值和提現(xiàn)的業(yè)務流程如何考慮充值提現(xiàn)一、充值的類型1、快捷按鈕充值

快捷按鈕充值是充值類型中比較常見的，主要按照一些產品類型的特點，會采用快捷按鈕，適用于對充值金額沒有那么大的靈活需求或對業(yè)務產品的針對性高（充值直接涉及獲得的辦事或者產品）。

快捷按鈕充值是比較簡單用戶操作體驗良好的一種充值方式。

優(yōu)點：

對于用戶減少操作步驟，不需要太多思考，用戶操作體驗良好對于頁面開發(fā)，不需要加入太多的輸入判斷，開發(fā)簡便

缺點：

可選擇的充值金額太少，靈活性不強

注：支付寶話費充值&ofo&百度外賣

2、密碼兌換充值

密碼兌換充值恐怕應該是最傳統(tǒng)最古老的互聯(lián)網充值方式了，十幾年前，qq的Q幣充值，游戲充值，都是采用線下店鋪售賣點卡的模式，用戶刮點卡獲得密碼，上網兌換，達到充值的效果。

目前隨著互聯(lián)網發(fā)展，出現(xiàn)了很多第三方支付平臺，好比支付寶、微信支付、銀聯(lián)支付…這種密碼兌換的充值方式漸漸被取代。

當然，目前密碼兌換充值的方式以線上兌換碼代替點卡廣泛用于運營維護，好比：老用戶的喚活，特殊節(jié)假日點贈送兌換碼，電商平臺與B端的合作等。

注：百度糯米&百度外賣&天天果園

3、輸入金額充值

輸入金額充值也是app充值中比較常見的，部分app以快捷按鈕充值和輸入金額充值一起也有。

優(yōu)點：輸入的數(shù)字靈活性更高，可以滿足用戶對差別金額的充值需求。缺點：輸入框的判斷邏輯太多，影響用戶體驗，比擬快捷按鈕，操作復雜。

注：微信&天天中彩票&天天果園

有沒有覺得這種方式最簡單，一個輸入框就ok了，但是看似簡單，最不簡單的就是輸入金額充值。

輸入框的默認顯示是？輸入類型的限制？輸入的最大金額？最小金額？是輸入框實時校驗還是點擊充值按鈕后判斷？判斷的要求？判斷后提示的顯示怎么顯示？還有鍵盤的彈出和隱藏規(guī)則，鍵盤類型？

二、充值模塊需求相關細節(jié)

下面我以比來做的充值頁面原型作為例子，講一下輸入快捷按鈕+金額充值方式的原型設計：

1、進行充值業(yè)務的條件說明

進入充值頁面時按照產品業(yè)務邏輯判斷用戶是否符合業(yè)務條件，別的后續(xù)該如何引導用戶完成業(yè)務條件再進入充值頁面。

以上原型為例：進入充值頁面判斷是否完成實名認證，未完成，引導用戶完成實名認證。（例：是否完成押金充值，共享單車必需完成押金充值才能對余額進行充值）。

2、默認顯示規(guī)則的設定

頁面的默認顯示，輸入框內的顯示，快捷充值按鈕的顯示，充值按鈕的顯示，鍵盤的彈出情況說明。

以上原型為例：默認顯示規(guī)則為快捷按鈕“100元”默認選中，輸入框內默認顯示“100元”，充值按鈕顯示充值對應輸入框內金額。

3、文本框獲得焦點時以及鍵盤交互說明

當文本框獲得焦點時，文本框的交互情況，鍵盤的類型，鍵盤的交互。

以上原型為例：當文本框獲得焦點時，文本框提示文字隱藏，不清空文本框數(shù)字，從下往上彈出鍵盤，因為需要輸入內容為數(shù)字且可輸入小數(shù)點，所以鍵盤類型為帶“點”的數(shù)字鍵盤。（注：鍵盤的類型有很多，為了達到最好的用戶體驗，按照差別的頁面和需求彈出差別類型的鍵盤，prd中必然要寫清楚，不然程序猿哥哥就會用默認鍵盤）

注：帶“點”的數(shù)字鍵盤

4、文本框失去焦點時以及鍵盤交互說明

當文本框失去焦點時，文本框的交互情況，按鈕的顯示，鍵盤的交互。

標簽：東營 林芝 鹽城 烏魯木齊 九江