iOS 鍵盤

為什么 iOS 的鍵盤如此出色，其他系統(tǒng)的虛擬鍵盤雖然在尺寸上基本超過(guò) iOS 鍵盤，而它們的視覺(jué)體驗(yàn)還是操作體驗(yàn)相比之下顯得像一團(tuán)渣，為什么？

在比較分析之前，先說(shuō)明一下，分析雖然是一個(gè)逆向過(guò)程，但在這里我認(rèn)為詮釋性的分析比揣測(cè)設(shè)計(jì)者的意圖更有價(jià)值，當(dāng)問(wèn)“為什么這樣設(shè)計(jì)”的時(shí)候，應(yīng)該將眼界超越設(shè)計(jì)者本人的意圖，即使有一些給出的理解完全脫離設(shè)計(jì)者的意圖甚至與其相背。

iOS 鍵盤是（新一代）虛擬屏幕鍵盤的開(kāi)山始祖，它有很多創(chuàng)新的設(shè)計(jì)和技術(shù)應(yīng)用，在第一代 iPhone 上市的時(shí)候，Apple 做過(guò)詳細(xì)全面的視頻介紹，其中有一段就是 iOS 鍵盤介紹，土豆視頻見(jiàn)這（Youtube 地址見(jiàn)這）。Steve Jobs 在 WWDC 2007 上介紹 iPhone 是從革命性的用戶界面開(kāi)始的，從列出 Moto Q、BlackBerry、Palm Treo 和 Nokia E62 這四臺(tái)帶全鍵盤的手機(jī)——當(dāng)時(shí)被稱為智能手機(jī)——開(kāi)始，它們的按鍵和操作是不能改變的，無(wú)論你是否需要它總是在那里，而不同的應(yīng)用需要不同的用戶界面。iOS 虛擬鍵盤只在需要的時(shí)候出現(xiàn)，在不同的應(yīng)用中使用不同的鍵盤，在輸入網(wǎng)址的時(shí)候就將空格鍵替換成了“。”、“.com”和“/”等配合網(wǎng)址輸入的按鍵。同時(shí)虛擬鍵盤需要解決精度以及效率問(wèn)題，讓人輕松快速的輸入，使用放大鏡進(jìn)行輕松的光標(biāo)再定位，比如“臭名昭著”的熱詞自動(dòng)修正（英文），除了使用字典以及聯(lián)系人等詞組匹配進(jìn)行修正外，還可以對(duì)輸入?yún)^(qū)域進(jìn)行匹配比如介紹視頻中的將“ouzza”轉(zhuǎn)為“pizza”，還有一項(xiàng)創(chuàng)新的設(shè)計(jì)是，根據(jù)字典來(lái)預(yù)測(cè)下一個(gè)字母，以此實(shí)時(shí)改變鍵盤的各字母對(duì)應(yīng)的觸摸區(qū)域的大小，讓這些字母更容易被觸發(fā)，比如輸入“tim”，那么接下了“e”就比相鄰的“w”和“r”的觸摸區(qū)域大，因?yàn)?ldquo;time”是一個(gè)常用詞，而沒(méi)有“timw”和“timr”這兩個(gè)英文單詞。

在 Apple 的獲得專利中，與 iOS 鍵盤相關(guān)的有很多項(xiàng)，重要的就有根據(jù)下一個(gè)字母來(lái)動(dòng)態(tài)改變觸摸區(qū)域這一項(xiàng)，專利號(hào) 7，900，156 名稱為“Activating virtual keys of a touch-screen virtual keyboard”，相應(yīng)在中國(guó)的專利申請(qǐng)?zhí)枮? 200680033988 名稱為“致動(dòng)觸摸 — 屏幕虛擬鍵盤的虛擬鍵”，專利內(nèi)容就是上述實(shí)現(xiàn)的一個(gè)一般化，將觸摸區(qū)域的改變一般化為按鍵如何根據(jù)觸摸位置來(lái)觸發(fā)，觸摸位置與觸發(fā)按鍵通過(guò)距離來(lái)確定（比如與哪個(gè)按鍵的距離小就觸發(fā)哪一個(gè)按鍵），同時(shí)引入一個(gè)權(quán)重，那么上述實(shí)現(xiàn)中，出現(xiàn)下一個(gè)“e”比“w”和“r”有更大的權(quán)重，也就是“e”的觸摸范圍更大，這項(xiàng)專利例舉的另一個(gè)實(shí)現(xiàn)，就是“刪除”按鍵的權(quán)重設(shè)置成小的，它更不容易被觸發(fā)。另外在設(shè)計(jì)專利中，有兩項(xiàng)比較顯著，一個(gè)是 D644，238 整個(gè)鍵盤的設(shè)計(jì)，另一個(gè) D621，848 是關(guān)于按鍵被按下時(shí)擠出的那個(gè)放大的鍵盤指示牌。

我們先從尺寸來(lái)看 iOS 鍵盤的設(shè)計(jì)，上圖是 iPhone 4 之后的視網(wǎng)膜屏幕的界面，所標(biāo)注數(shù)字的單位為 px，其實(shí)就是 320*480 屏幕的兩倍，前后鍵盤設(shè)計(jì)并沒(méi)有變化，如果換算成 mm 為單位的實(shí)際尺寸，那么就類似 32 px/326*25.4=2.49 mm。這些尺寸是如何決定的，如果從設(shè)計(jì)者的角度來(lái)看，這個(gè)決定的過(guò)程既有邏輯的部分也有感性的成分，所以我們分析不能像數(shù)學(xué)一樣去反推。iOS 的鍵盤高度為 430 px（320*480 的分辨率時(shí)為 215 px，其實(shí) 430 px 上方還有 2 px 的黑線），正好位于屏幕正中間向下偏 50 px，或許可以提出一個(gè)問(wèn)題就是鍵盤為什么不是屏幕的一半呢？這個(gè)尺寸由其內(nèi)部支撐起的，但是如果把它設(shè)成剛好一半，那么在比例上很容易體會(huì)到壓抑（均分是較容易被識(shí)別）。76 px 的按鍵高度是 5.92 mm，52 px 按鍵寬度是 4.05 mm，12 px 按鍵間距是 0.93 mm，32 px 的按鍵間距以及字高是 2.49 mm，iOS 的 HIG 建議的最小可觸摸操作元素是 44*44 point，轉(zhuǎn)換到 mm 單位為 6.90，Windows Phone 7 的 HIG 中也說(shuō)到最小觸摸目標(biāo)的高度是 7 mm（緊接著也說(shuō)到鍵盤和鏈接可以例外，因?yàn)橛蓄~外的動(dòng)態(tài)補(bǔ)償）�？隙ㄓ泻芏嗳藱C(jī)尺寸可供參考，比如橫向的尺寸，而從設(shè)計(jì)的角度除了依賴這些統(tǒng)計(jì)學(xué)上的數(shù)據(jù)，更重要的是結(jié)合經(jīng)驗(yàn)和體驗(yàn)，畢竟在這么一個(gè)小范圍內(nèi)，依賴后者更迅速。我們從 iOS 鍵盤的尺寸上可以看出它們都是經(jīng)過(guò)細(xì)致安排的，就是“尺度”。

將 Android 的鍵盤和 iOS 鍵盤以實(shí)體的尺寸為準(zhǔn)進(jìn)行比較，為什么不選用其他中文輸入法的鍵盤，因?yàn)檫@些鍵盤多數(shù)是模仿 iOS 鍵盤的，而且有幾個(gè)在尺寸上沒(méi)有考究，比如上下兩排按鍵或間隙都不是統(tǒng)一的，有 1 px 的差距，這樣它們就沒(méi)有什么參考價(jià)值。 Android 鍵盤也有尺寸詭異的地方，比如按鍵的圓角是 2px，2 px 的圓角在通常情況下是沒(méi)有表現(xiàn)力的（只有3個(gè)像素參與），尤其像鍵盤這種密集排布的，反而讓人感覺(jué)難受。

比較上面兩個(gè)鍵盤，iOS 鍵盤雖然在整體的尺寸上小于 Android 鍵盤，但是按鍵之間的間距都要大于 Android 鍵盤，橫向的 0.93 mm 對(duì)比 0.87 mm，縱向的 2.49 mm 對(duì)比 1.96 mm，尤其是縱向的差距，使得 iOS 鍵盤的按鍵可以更清晰和安心的識(shí)別、瞄準(zhǔn)和按下，此時(shí) iOS 上 8px 的圓角也發(fā)揮了很重要的作用。iOS 鍵盤的文字使用的是黑色的 32 px 高的大寫 Helvetica （Bold），而 Android 鍵盤采用的是白色的 x-height 為 20 px 的小寫 Droid Sans （Bold），人對(duì)物體的識(shí)別通常被輪廓左右，簡(jiǎn)單飽滿的輪廓所需的識(shí)別精力小，尤其是在重復(fù)連續(xù)的鍵盤操作中，Android 鍵盤上的小寫的小字體需要花費(fèi)更多的精力，字體小需要聚焦，而復(fù)雜的小寫字體輪廓讓人付出更多的精力來(lái)拾取輪廓而且高度上會(huì)有跳動(dòng)（更容易中途中斷），而大寫的大字體，在整體上是飽滿完整的，在識(shí)別上所費(fèi)精力更少。iOS 鍵盤的字體帶來(lái)另外一個(gè)良好體驗(yàn)，就是與識(shí)別結(jié)合的后繼動(dòng)作——瞄準(zhǔn)，它讓人感覺(jué)到更容易被瞄準(zhǔn)和敲擊，因?yàn)榘存I上有字體，所以瞄準(zhǔn)時(shí)首要注意的是字體的中心，而按鍵的輪廓是輔助，那么 Android 的小寫字體更不容易找到中心，像 j l i 等就顯得更難了。Android 鍵盤還有一個(gè)顏色的設(shè)計(jì)，從完全黑色的背景到灰色的按鍵再到白色的字體，引導(dǎo)視力集中到小字體上，而 iOS 富有層次感的設(shè)計(jì)，從有柔和漸變的背景到清晰突出的按鍵，再到黑色的大字體，讓人的視力不過(guò)分集中，這樣字體和按鍵感覺(jué)上是一體的，這也符合操作的識(shí)別范式。細(xì)致的層次感設(shè)計(jì)，比如陰影、漸變和高光讓界面更加具形化，豐富人的體驗(yàn)。

什么是“豐富人的體驗(yàn)”？從 iOS 鍵盤的一個(gè)創(chuàng)新設(shè)計(jì)說(shuō)起，那就是當(dāng)按鍵被觸發(fā)時(shí)擠出的放大顯示牌，就是 D621，848 這個(gè)設(shè)計(jì)專利。iPhone 之后的其它虛擬鍵盤也有類似的放大顯示，不過(guò)基本都是在上方跳出一個(gè)獨(dú)立的方塊，不像 iOS 有擠出效果，讓人在感覺(jué)上能平滑的過(guò)度。放大顯示從另外一個(gè)角度是設(shè)計(jì)的必然，即沒(méi)有 Apple 其他的后來(lái)者都會(huì)想到，它位于邏輯的主干道上，但是像 iOS 這樣的交互方式，是一種創(chuàng)新。這個(gè)放大顯示牌它是在按鍵被觸發(fā)后才顯示的，也就是它是不參與識(shí)別、瞄準(zhǔn)和敲擊這個(gè)過(guò)程的，也就是它對(duì)當(dāng)前這個(gè)按鍵出發(fā)行為和結(jié)果并沒(méi)有帶來(lái)幫助，只有當(dāng)按錯(cuò)了之后，它才可能發(fā)揮它的顯示功用，而通常情況下它是被忽略的，或者說(shuō)只被散落的注意力關(guān)注著，它的作用只是有限的輔助修正輸入。但是它卻“豐富了人的體驗(yàn)”，它就像那些細(xì)致刻畫了鍵盤層次感的陰影高光，或者鍵盤聲音一樣，如果沒(méi)有它，功能上并沒(méi)有什么缺失，但是就像沒(méi)有了潤(rùn)滑油。它只能顯示用于比較剛才敲擊的按鍵是否正確，它不能保證當(dāng)前的操作更精確，但是它可以讓下一個(gè)操作更精確。當(dāng)我們說(shuō)體驗(yàn)這個(gè)詞時(shí)，它必然與過(guò)程相關(guān)。

標(biāo)簽： affordance apple UI 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請(qǐng)與原作者聯(lián)系。