在交互稿的標(biāo)注中，我們經(jīng)常會忽略鍵盤的說明，這是不對的。鍵盤在用戶的交互過程中起到了非常重要的作用，尤其在多個輸入框的場景下。

為什么需要標(biāo)注鍵盤類型？

大家都知道，一款虛擬鍵盤（比如iOS系統(tǒng)鍵盤）有很多種布局類型。在交互稿中，很多人是不標(biāo)注鍵盤類型的，我原先也是不標(biāo)注的。但近來發(fā)現(xiàn)鍵盤對于用戶操作的影響其實(shí)很大，不標(biāo)注鍵盤類型是不對的。一方面，如果鍵盤調(diào)用不當(dāng)，用戶則需要手動切換輸入法，這是影響操作效率的（如上圖）；另一方面，對于多輸入框的表單來說，輸入框之間的切換、提交表單，這些操作其實(shí)都可以通過鍵盤實(shí)現(xiàn)（如上圖左），而無需用戶手動點(diǎn)擊原界面中的元素。最后還有比較重要的一點(diǎn)是：如果設(shè)計(jì)師不標(biāo)注，開發(fā)同學(xué)一般都寫成默認(rèn)鍵盤，而不會根據(jù)場景寫成不同類型的鍵盤。

那么，到底有哪幾種鍵盤？每種鍵盤有哪些地方是可以控制的呢？

iOS原生應(yīng)用中的鍵盤

iOS 中提供了多達(dá)12種鍵盤可以選擇（如上圖，不討論中文鍵盤，中文鍵盤只有一種布局）。我們可以根據(jù)用戶當(dāng)前的需要，提供不同類型鍵盤。在交互稿中，我們可以將相應(yīng)的鍵盤類型名稱（英文名）寫在界面下方，或者直接使用相應(yīng)的鍵盤截圖放在交互稿中。對于同一個界面中有不同類型輸入框的情況，需要標(biāo)注出鍵盤切換的說明。雖然12種鍵盤類型已經(jīng)很多，但它們?nèi)匀徊荒芨采w所有場景，這時我們可以進(jìn)行自定義鍵盤。當(dāng)然，開發(fā)成本你懂的，開發(fā)同學(xué)的表情你也懂的。

除了選用不同類型的鍵盤，部分鍵盤中還有多種“按鍵命令”（上圖中的藍(lán)色按鈕）可以選擇，如“完成”、“搜索”、”發(fā)送”等。iOS中提供了11種類型的命令，你可以將所需要的命令用文字描述的形式標(biāo)注在交互稿中，也可以使用截圖的方式。值得注意的是，iOS的鍵盤具有上一項(xiàng)和下一項(xiàng)的功能（ < ?> ，如上圖左上方），這對于表單的交互設(shè)計(jì)起到了非常重要的作用，一定要好好利用。

Android原生應(yīng)用中的鍵盤

如上圖所示，Android中提供了9種類型的鍵盤（同樣不討論中文鍵盤）。與iOS的鍵盤調(diào)用類似，需要注意多輸入框場景下的鍵盤類型切換。Android場景中的鍵盤也可以自定義，自定義的成本同樣是比較高的，值得斟酌。

同iOS一樣，Android的部分鍵盤也具有多種“按鍵命令”可以選擇：回車、搜索、前往、下一項(xiàng)、完成、發(fā)送（未找到案例）。在交互稿中，可以標(biāo)注出想要的“按鍵命令”類型。大家應(yīng)該有注意到，Android中多了一個“下一項(xiàng)”的按鍵命令，用來替代iOS鍵盤左上方的“ < >”按鍵。在多輸入框表單的場景下，切記標(biāo)注出鍵盤的“按鍵命令”何時變?yōu)椤跋乱豁?xiàng)”，何時變?yōu)椤巴瓿伞薄?/p>

H5下的鍵盤

在H5環(huán)境中，鍵盤的類型仍然可以自由選擇?！鞍存I命令”的類型大部分可以選擇，但“完成”和“下一項(xiàng)”不可以選擇。也就是說，程序可以控制調(diào)出的是“數(shù)字鍵盤”還是“字母鍵盤”或其他任意類型的鍵盤。但在“按鍵命令”類型調(diào)用方面，只能調(diào)用“搜索”、“回車”、“前往”，而不能調(diào)用“下一項(xiàng)”和“完成”。所以在標(biāo)注交互稿時，需要注意這一點(diǎn)。這個缺陷對于iOS環(huán)境中的H5影響并不是太大，因?yàn)閕OS的鍵盤具有“< >”和“完成”按鈕。但對于Android環(huán)境中H5的影響則很大，因?yàn)楫?dāng)用戶填寫完一個輸入框想要跳轉(zhuǎn)下一個輸入框時，只能手動點(diǎn)擊。如果用戶下意識地點(diǎn)擊“前往”按鈕，則可能會出現(xiàn)表單警報（如上圖所示）。

這里有一個例外情況，就是當(dāng)輸入框的字符類型是“數(shù)字”時，“按鍵命令”會自動變成“下一項(xiàng)”。Android環(huán)境中的這些問題對于用戶成本本身就很高的“表單填寫”交互來說，其實(shí)是很要命的，也是讓人無能為力。

PS：上圖中鍵盤上方的白色工具欄（上一項(xiàng)、下一項(xiàng)……）是瀏覽器提供的插件，不屬于系統(tǒng)鍵盤。

總結(jié)

交互稿的標(biāo)注中，我們經(jīng)常會忽略鍵盤的說明，這是不對的。鍵盤在用戶的交互過程中起到了非常重要的作用，尤其在多個輸入框的場景下。合理地切換“鍵盤類型”和“按鍵命令類型”可以提高用戶填寫表單的效率，同時也可以讓表單填寫過程更加順暢，降低頁面的流失率，我相信所有人都知道這點(diǎn)很重要。

交互稿中，除了忽略“鍵盤的標(biāo)注”，我們還會忽略很多其他細(xì)節(jié)的標(biāo)注，比如過場、加載、熱區(qū)范圍等。對于開發(fā)同學(xué)來說，不標(biāo)注一般就意味著不用考慮，指定默認(rèn)值即可。但對于整個產(chǎn)品來說，每一個細(xì)節(jié)的忽略都會導(dǎo)致相應(yīng)的體驗(yàn)問題。所以，如果你還沒有和開發(fā)同學(xué)形成非常良好的默契，還是盡量標(biāo)注出這些細(xì)節(jié)吧。

對了，上文中提到的技術(shù)上的“可以”和“不可以”都是基于一般的開發(fā)投入而言啦。因?yàn)閷﹂_發(fā)同學(xué)來說：沒有實(shí)現(xiàn)不了的功能，只有給不了的時間。

最后拋一個問題：?為什么鍵盤右下角的“命令按鍵”有時是“完成”，有時是“前往”？到底應(yīng)該選哪個呢？歡迎留言討論……

作者：崇書慶-seeking-雷雷，網(wǎng)易UEDC小鮮肉1號，高級交互設(shè)計(jì)師?；桌?，因?yàn)橥饷婵崴茖O紅雷，現(xiàn)支持杭研云信項(xiàng)目。有想法，有態(tài)度，愛學(xué)習(xí)，愛分享就是wuli雷雷~

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