鍵盤(pán)在用戶的交互過(guò)程中起到了非常重要的作用，尤其在多個(gè)輸入框的場(chǎng)景下。合理地切換”鍵盤(pán)類(lèi)型”和“按鍵命令類(lèi)型”可以提高用戶填寫(xiě)表單的效率，同時(shí)也可以讓表單填寫(xiě)過(guò)程更加順暢，降低頁(yè)面的流失率。

一、鍵盤(pán)類(lèi)型

iOS 中提供了12種鍵盤(pán)可以選擇，我們可以根據(jù)用戶當(dāng)前的需要，提供不同類(lèi)型鍵盤(pán)。

在交互稿中，需要對(duì)要調(diào)用的鍵盤(pán)進(jìn)行標(biāo)注，對(duì)于同一個(gè)界面中有不同類(lèi)型輸入框的情況，需要標(biāo)注出鍵盤(pán)切換的說(shuō)明。

雖然12種鍵盤(pán)類(lèi)型已經(jīng)很多，但它們?nèi)匀徊荒芨采w所有場(chǎng)景，這時(shí)我們需要自定義鍵盤(pán)。

二、按鍵命令類(lèi)型

除了選用不同類(lèi)型的鍵盤(pán)，部分鍵盤(pán)中還有多種“按鍵命令”（下圖中的藍(lán)色按鈕）可以選擇，如“完成”、“搜索”、“發(fā)送”等。

iOS中提供了11種類(lèi)型的命令，交互稿中可將所需要的命令用文字描述/截圖的形式標(biāo)注。

iOS的鍵盤(pán)具有上一項(xiàng)和下一項(xiàng)的功能（ < ?> ，如上圖左上方），對(duì)于表單的交互設(shè)計(jì)起到了非常重要的作用，交互稿中需加以說(shuō)明。

1. 上一項(xiàng) 下一項(xiàng)

與鍵盤(pán)tab鍵功能一致，跳轉(zhuǎn)至上一個(gè)/下一個(gè)標(biāo)簽序列，同時(shí)保證不會(huì)清空已填入的內(nèi)容。

應(yīng)用場(chǎng)景：表單輸入框標(biāo)簽超出2項(xiàng)，喚起鍵盤(pán)時(shí)，在鍵盤(pán)上面顯示“上一項(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)擊。

好處：

1. 手機(jī)屏幕有限，如果喚起的鍵盤(pán)擋住了下一項(xiàng)輸入框，可以通過(guò)點(diǎn)擊下一項(xiàng)按鈕來(lái)輸入下一項(xiàng)，無(wú)需收起鍵盤(pán)，方便用戶操作。
2. 有多項(xiàng)表單填寫(xiě)時(shí)，通過(guò)連續(xù)的點(diǎn)擊下一項(xiàng)按鈕，快捷完成輸入。

2. 完成

點(diǎn)擊“完成”按鈕，從上往下收起鍵盤(pán)。

三、鍵盤(pán)使用實(shí)例

1. 常規(guī)鍵盤(pán)

1）常規(guī)鍵盤(pán)-文本輸入

應(yīng)用場(chǎng)景：賬戶姓名、地址等文本輸入

2）常規(guī)鍵盤(pán)-字符輸入

應(yīng)用場(chǎng)景：登錄密碼

僅支持字符和數(shù)字、符號(hào)，不可切換輸入法，給用戶明確的指示性，減少犯錯(cuò)誤的機(jī)會(huì)。

3）常規(guī)鍵盤(pán)-純數(shù)字輸入

應(yīng)用場(chǎng)景：

只支持限制了歸屬地的手機(jī)號(hào)碼、數(shù)字郵編、短信驗(yàn)證碼、純數(shù)字支付密碼、銀行卡號(hào)、信用卡安全碼。

僅支持輸入0-9的數(shù)字，增大有效點(diǎn)擊區(qū)域，給用戶明確的提示，減少輸入錯(cuò)誤。

4）常規(guī)鍵盤(pán)-電話鍵盤(pán)

應(yīng)用場(chǎng)景：

手機(jī)號(hào)碼，不限定國(guó)內(nèi)外。

在填寫(xiě)手機(jī)號(hào)碼時(shí)，如沒(méi)有對(duì)手機(jī)號(hào)歸屬地進(jìn)行單獨(dú)限制，則調(diào)用包含“+”“*”“#”的電話鍵盤(pán)。

5）常規(guī)鍵盤(pán)——帶“.”的數(shù)字鍵盤(pán)

應(yīng)用場(chǎng)景：輸入帶小數(shù)點(diǎn)的金額。

6）常規(guī)鍵盤(pán)——帶@的電子郵件鍵盤(pán)

應(yīng)用場(chǎng)景：郵箱地址

2. 自定義鍵盤(pán)

1）定制鍵盤(pán)——帶X的數(shù)字鍵盤(pán)

應(yīng)用場(chǎng)景：國(guó)內(nèi)18位身份證號(hào)碼

2）定制鍵盤(pán)——隨機(jī)密碼鍵盤(pán)

應(yīng)用場(chǎng)景：各類(lèi)銀行app登錄密碼/支付密碼

招行掌上銀行：

• 密碼為數(shù)字、字符、字母隨機(jī)組合密碼。
• 鍵盤(pán)上文本：暗示用戶有安全保障的鍵盤(pán)，消除用戶疑慮，增加安全性。
• 鍵盤(pán)內(nèi)數(shù)字位置隨機(jī)顯示，防止密碼被泄露（如圖一）
• 鍵盤(pán)內(nèi)數(shù)字按順序顯示（如圖二）

（圖一）

（圖二）

浙商銀行：

登錄密碼鍵盤(pán)：

6位數(shù)支付密碼/取款密碼/賬戶密碼等：

鍵盤(pán)內(nèi)數(shù)字位置隨機(jī)顯示，防止密碼被泄露。但是，安全性提高的同時(shí)，也增加了用戶輸入的難度。

那么，如何消減兩者的對(duì)立性？

建議：

A. 根據(jù)用戶使用場(chǎng)景的不同，提升不同安全級(jí)別。

• 有密碼的/私人wifi連接——定義為安全環(huán)境——普通鍵盤(pán)模式
• 4G/3G/2G網(wǎng)絡(luò)/公共的無(wú)密碼wifi連接——定義為非安全環(huán)境——安全鍵盤(pán)模式

B. 可切換安全鍵盤(pán)和普通鍵盤(pán)輸入，讓用戶自己選擇，并記住用戶的選擇，下次再次使用時(shí)，默認(rèn)上一次選擇。

四、鍵盤(pán)使用規(guī)則

1. 禁用自動(dòng)更正

英文文本輸入時(shí)，系統(tǒng)會(huì)默認(rèn)自動(dòng)更正功能，用來(lái)幫助用戶更正可能出現(xiàn)的輸入錯(cuò)誤。

但當(dāng)用戶在填寫(xiě)表單時(shí)，如賬戶名、郵箱名、昵稱、街道地址、縮寫(xiě)等內(nèi)容，應(yīng)當(dāng)禁用自動(dòng)更正功能，防止自動(dòng)更正掉用戶所填內(nèi)容，用戶沒(méi)有注意到更改，造成輸入錯(cuò)誤。

反面示例：

• 沒(méi)有禁用自動(dòng)更正。
• 輸入“jing”，點(diǎn)擊“done”后自動(dòng)更正為“king”，造成輸入錯(cuò)誤。
• 用戶名一般為用戶自己取的名，為防止重名，所取名字一般都不會(huì)在詞典里，自動(dòng)更正的功能可能會(huì)導(dǎo)致用戶輸入正確的內(nèi)容改為錯(cuò)誤內(nèi)容。

2. 禁用首字母大寫(xiě)

智能手機(jī)默認(rèn)會(huì)把標(biāo)準(zhǔn)文本輸入框的首字母大寫(xiě)，這在大部分情況下是合適的。

但是，在有些情況下應(yīng)當(dāng)禁用自動(dòng)大寫(xiě)，特別是像郵箱地址這種絕大多數(shù)用戶都以為要小寫(xiě)的情況，首字母自動(dòng)大寫(xiě)會(huì)造成用戶需再次修改所輸入的內(nèi)容，形成挫敗感，增加操作困難度。

3. 保持一致，調(diào)用合適的鍵盤(pán)

如果一個(gè)輸入框調(diào)用了專(zhuān)用鍵盤(pán)而其他類(lèi)似的輸入框卻沒(méi)有，那么在沒(méi)有調(diào)用專(zhuān)用鍵盤(pán)時(shí)用戶會(huì)感到困惑，并開(kāi)始質(zhì)疑這個(gè)輸入框所需輸入的類(lèi)型。

為特定輸入框調(diào)用合適的鍵盤(pán)是正確的做法，但是要確保在app內(nèi)保持一致，否則會(huì)讓用戶很困惑。換句話說(shuō)，如果信用卡號(hào)的輸入框調(diào)用了數(shù)字鍵盤(pán)，那么類(lèi)似的輸入框如安全碼、有效期、預(yù)留手機(jī)號(hào)也要有同樣的做法。

本文由@江湖醬 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)允許，禁止轉(zhuǎn)載。

題圖來(lái)自Unsplash, 基于CC0協(xié)議。