鍵盤在用戶的交互過程中起到了非常重要的作用,尤其在多個(gè)輸入框的場(chǎng)景下兴使。合理地切換”鍵盤類型”和“按鍵命令類型”可以提高用戶填寫表單的效率系宜,同時(shí)也可以讓表單填寫過程更加順暢,降低頁(yè)面的流失率发魄。
一盹牧、鍵盤類型
iOS 中提供了12種鍵盤可以選擇,我們可以根據(jù)用戶當(dāng)前的需要励幼,提供不同類型鍵盤汰寓。
在交互稿中,需要對(duì)要調(diào)用的鍵盤進(jìn)行標(biāo)注苹粟,對(duì)于同一個(gè)界面中有不同類型輸入框的情況有滑,需要標(biāo)注出鍵盤切換的說(shuō)明。
雖然12種鍵盤類型已經(jīng)很多嵌削,但它們?nèi)匀徊荒芨采w所有場(chǎng)景望艺,這時(shí)我們需要自定義鍵盤。
二肌访、按鍵命令類型
除了選用不同類型的鍵盤找默,部分鍵盤中還有多種“按鍵命令”(下圖中的藍(lán)色按鈕)可以選擇,如“完成”吼驶、“搜索”惩激、“發(fā)送”等。
iOS中提供了11種類型的命令蟹演,交互稿中可將所需要的命令用文字描述/截圖的形式標(biāo)注风钻。
iOS的鍵盤具有上一項(xiàng)和下一項(xiàng)的功能( < > ,如上圖左上方)酒请,對(duì)于表單的交互設(shè)計(jì)起到了非常重要的作用骡技,交互稿中需加以說(shuō)明。
1. 上一項(xiàng) 下一項(xiàng)
與鍵盤tab鍵功能一致蚌父,跳轉(zhuǎn)至上一個(gè)/下一個(gè)標(biāo)簽序列哮兰,同時(shí)保證不會(huì)清空已填入的內(nèi)容。
應(yīng)用場(chǎng)景:表單輸入框標(biāo)簽超出2項(xiàng)苟弛,喚起鍵盤時(shí)喝滞,在鍵盤上面顯示“上一項(xiàng)”“下一項(xiàng)”操作按鈕。
限制:
區(qū)分按鈕的可點(diǎn)擊狀態(tài)膏秫、不可點(diǎn)擊狀態(tài)右遭。
- 當(dāng)?shù)谝豁?xiàng)時(shí),“上一項(xiàng)”按鈕置灰缤削,不可點(diǎn)擊窘哈;
- 當(dāng)最后一項(xiàng)時(shí),“下一項(xiàng)”按鈕置灰亭敢,不可點(diǎn)擊滚婉。
好處:
- 手機(jī)屏幕有限,如果喚起的鍵盤擋住了下一項(xiàng)輸入框帅刀,可以通過點(diǎn)擊下一項(xiàng)按鈕來(lái)輸入下一項(xiàng)让腹,無(wú)需收起鍵盤,方便用戶操作扣溺。
- 有多項(xiàng)表單填寫時(shí)骇窍,通過連續(xù)的點(diǎn)擊下一項(xiàng)按鈕,快捷完成輸入锥余。
2. 完成
點(diǎn)擊“完成”按鈕腹纳,從上往下收起鍵盤。
三、鍵盤使用實(shí)例
1. 常規(guī)鍵盤
1)常規(guī)鍵盤-文本輸入
應(yīng)用場(chǎng)景:賬戶姓名嘲恍、地址等文本輸入
2)常規(guī)鍵盤-字符輸入
應(yīng)用場(chǎng)景:登錄密碼
僅支持字符和數(shù)字足画、符號(hào),不可切換輸入法蛔钙,給用戶明確的指示性锌云,減少犯錯(cuò)誤的機(jī)會(huì)荠医。
3)常規(guī)鍵盤-純數(shù)字輸入
應(yīng)用場(chǎng)景:
只支持限制了歸屬地的手機(jī)號(hào)碼吁脱、數(shù)字郵編、短信驗(yàn)證碼彬向、純數(shù)字支付密碼兼贡、銀行卡號(hào)、信用卡安全碼娃胆。
僅支持輸入0-9的數(shù)字遍希,增大有效點(diǎn)擊區(qū)域,給用戶明確的提示里烦,減少輸入錯(cuò)誤凿蒜。
4)常規(guī)鍵盤-電話鍵盤
應(yīng)用場(chǎng)景:
手機(jī)號(hào)碼,不限定國(guó)內(nèi)外胁黑。
在填寫手機(jī)號(hào)碼時(shí)废封,如沒有對(duì)手機(jī)號(hào)歸屬地進(jìn)行單獨(dú)限制,則調(diào)用包含“+”“*”“#”的電話鍵盤丧蘸。
5)常規(guī)鍵盤——帶“.”的數(shù)字鍵盤
應(yīng)用場(chǎng)景:輸入帶小數(shù)點(diǎn)的金額漂洋。
6)常規(guī)鍵盤——帶@的電子郵件鍵盤
應(yīng)用場(chǎng)景:郵箱地址
2. 自定義鍵盤
1)定制鍵盤——帶X的數(shù)字鍵盤
應(yīng)用場(chǎng)景:國(guó)內(nèi)18位身份證號(hào)碼
2)定制鍵盤——隨機(jī)密碼鍵盤
應(yīng)用場(chǎng)景:各類銀行app登錄密碼/支付密碼
招行掌上銀行:
- 密碼為數(shù)字、字符力喷、字母隨機(jī)組合密碼刽漂。
- 鍵盤上文本:暗示用戶有安全保障的鍵盤,消除用戶疑慮弟孟,增加安全性贝咙。
- 鍵盤內(nèi)數(shù)字位置隨機(jī)顯示,防止密碼被泄露(如圖一)
- 鍵盤內(nèi)數(shù)字按順序顯示(如圖二)
(圖一)
(圖二)
浙商銀行:
登錄密碼鍵盤:
6位數(shù)支付密碼/取款密碼/賬戶密碼等:
鍵盤內(nèi)數(shù)字位置隨機(jī)顯示拂募,防止密碼被泄露庭猩。但是,安全性提高的同時(shí)没讲,也增加了用戶輸入的難度眯娱。
那么,如何消減兩者的對(duì)立性爬凑?
建議:
A. 根據(jù)用戶使用場(chǎng)景的不同徙缴,提升不同安全級(jí)別。
- 有密碼的/私人wifi連接——定義為安全環(huán)境——普通鍵盤模式
- 4G/3G/2G網(wǎng)絡(luò)/公共的無(wú)密碼wifi連接——定義為非安全環(huán)境——安全鍵盤模式
B. 可切換安全鍵盤和普通鍵盤輸入,讓用戶自己選擇于样,并記住用戶的選擇疏叨,下次再次使用時(shí),默認(rèn)上一次選擇穿剖。
四蚤蔓、鍵盤使用規(guī)則
1. 禁用自動(dòng)更正
英文文本輸入時(shí),系統(tǒng)會(huì)默認(rèn)自動(dòng)更正功能糊余,用來(lái)幫助用戶更正可能出現(xiàn)的輸入錯(cuò)誤秀又。
但當(dāng)用戶在填寫表單時(shí),如賬戶名贬芥、郵箱名吐辙、昵稱、街道地址蘸劈、縮寫等內(nèi)容昏苏,應(yīng)當(dāng)禁用自動(dòng)更正功能,防止自動(dòng)更正掉用戶所填內(nèi)容威沫,用戶沒有注意到更改贤惯,造成輸入錯(cuò)誤。
反面示例:
- 沒有禁用自動(dòng)更正棒掠。
- 輸入“jing”孵构,點(diǎn)擊“done”后自動(dòng)更正為“king”,造成輸入錯(cuò)誤句柠。
- 用戶名一般為用戶自己取的名浦译,為防止重名,所取名字一般都不會(huì)在詞典里溯职,自動(dòng)更正的功能可能會(huì)導(dǎo)致用戶輸入正確的內(nèi)容改為錯(cuò)誤內(nèi)容精盅。
2. 禁用首字母大寫
智能手機(jī)默認(rèn)會(huì)把標(biāo)準(zhǔn)文本輸入框的首字母大寫,這在大部分情況下是合適的谜酒。
但是叹俏,在有些情況下應(yīng)當(dāng)禁用自動(dòng)大寫,特別是像郵箱地址這種絕大多數(shù)用戶都以為要小寫的情況僻族,首字母自動(dòng)大寫會(huì)造成用戶需再次修改所輸入的內(nèi)容粘驰,形成挫敗感,增加操作困難度述么。
3. 保持一致蝌数,調(diào)用合適的鍵盤
如果一個(gè)輸入框調(diào)用了專用鍵盤而其他類似的輸入框卻沒有,那么在沒有調(diào)用專用鍵盤時(shí)用戶會(huì)感到困惑度秘,并開始質(zhì)疑這個(gè)輸入框所需輸入的類型顶伞。
為特定輸入框調(diào)用合適的鍵盤是正確的做法,但是要確保在app內(nèi)保持一致,否則會(huì)讓用戶很困惑唆貌。換句話說(shuō)滑潘,如果信用卡號(hào)的輸入框調(diào)用了數(shù)字鍵盤,那么類似的輸入框如安全碼锨咙、有效期语卤、預(yù)留手機(jī)號(hào)也要有同樣的做法。