我覺得再移動端的界面設(shè)計(jì)就好像是在刀鋒上跳舞，不是一鳴驚人就是一敗涂地，但這也是一種藝術(shù)！就像在火影中，每個(gè)人對藝術(shù)的追求是不一樣的。
最近新項(xiàng)目啟動，有點(diǎn)小忙...不過影響并不大，今天就來講講怎么移動端設(shè)計(jì)一個(gè)比較好的輸入

Text Field

不管在移動端還是PC端Text Field都是最常見也是最常用的一種輸入方式，一個(gè)體驗(yàn)好的文本輸入至少需要具備以下幾種規(guī)則

• 要能夠讓用戶快速地完成輸入
• 在用戶輸入時(shí)為用戶提供幫助和引導(dǎo)
• 在用戶出錯(cuò)的時(shí)候要提醒用戶哪里錯(cuò)了，為什么錯(cuò)了

快速輸入

如何快速才能快速輸入？有很多種形式，我就舉幾個(gè)比較常見的例子

• 在文本框需要輸入的是數(shù)字的時(shí)候你應(yīng)該彈出數(shù)字鍵盤而不是英文鍵盤或者是中文鍵盤，這一點(diǎn)在iOS的開發(fā)中做的是比較好的。

正確姿勢.png

• 在輸入的時(shí)候自動切換大小寫，這種比較常見于密碼輸入框英文組合還有就是英文名字的輸入，這就比較多應(yīng)用于國外的注冊啦

引導(dǎo)用戶輸入

• 缺省值提示可以幫助用戶快速完成輸入，這個(gè)缺省值可以是用戶之前輸入過的文本，或者系統(tǒng)提供的一些熱門詞匯。
• 自動完成是在用戶輸入的過程里，根據(jù)用戶的輸入來給出建議,用戶可以通過系統(tǒng)的建議來自動完成輸入。

Paste_Image.png

• 輸入提示，讓用戶知道這個(gè)Text Field輸入的是什么樣的值，是名稱還是密碼。這種比較常見的就是在文本框前面增加一個(gè)lable進(jìn)行標(biāo)注，也可以用Inline Label（弱提示）；我個(gè)人時(shí)比較喜歡Floating Label來實(shí)現(xiàn)

輸入驗(yàn)證

用戶是有可能輸入出錯(cuò)的，系統(tǒng)應(yīng)該給予用戶及時(shí)的反饋——如果我做對了，請讓我知道；如果我做錯(cuò)了，告訴我錯(cuò)在那里。
提示也應(yīng)該有對提示的顏色區(qū)分，一般情況下，紅色對應(yīng)錯(cuò)誤，綠色對應(yīng)正確，黃色對應(yīng)警告。