用超多細(xì)節(jié)探討 Apple 的設(shè)計哲學(xué)：交互篇

蘋果是一家為數(shù)不多以設(shè)計驅(qū)動的公司。如今，當(dāng)我們談?wù)撈甬a(chǎn)品設(shè)計、用戶體驗(yàn)，總是離不開蘋果，它所堅持的設(shè)計哲學(xué)是對細(xì)節(jié)和質(zhì)量的極致追求。下面，我就帶大家看看 Apple 在交互方面做的努力。

動態(tài)的觸控區(qū)域

Apple 為了解決在移動設(shè)備上輸入文本的問題，采用了一種流暢并且對用戶友好的解決方案：基于預(yù)測輸入系統(tǒng)，擴(kuò)大虛擬鍵盤的有效觸控區(qū)域。

△ 紅色塊為點(diǎn)擊區(qū)域

例如，the 和 this 這兩個單詞。當(dāng)你按下「th」的時候，系統(tǒng)預(yù)測下一個字母可能是 e 或 i，從而動態(tài)增加這兩個字母的點(diǎn)擊范圍，以此提高輸入的命中率。

當(dāng)然，視覺上你看不到按鈕尺寸的變化。指尖之上，一切都在無形之中。

音效觸覺反饋

在現(xiàn)實(shí)世界中，音效、觸感和視覺能很自然的保持協(xié)調(diào)，因?yàn)槿咧g有著很自然的關(guān)系。蘋果在數(shù)字世界也極力保持著這種體驗(yàn)。

Taptic Engine 線性震動馬達(dá)得益于 Taptic Engine 線性震動馬達(dá)，讓 iPhone 有了觸覺上的反饋。

1. 閃光燈

iPhone X 鎖屏上的閃光燈是一個非常高級別的觸覺體驗(yàn)例子。手電筒圖標(biāo)會根據(jù)手指觸碰的壓力而變化，讓你知道系統(tǒng)正在響應(yīng)操作，同時也告訴你需要再用力些。

當(dāng)力度一旦達(dá)到，系統(tǒng)會有個短震動，告訴你可以松手了，松手后還有一個成功的震動反饋。這像不像現(xiàn)實(shí)世界的老式拉線燈動作？

△ iPhone X 鎖屏狀態(tài)閃光燈

2. 鬧鐘

另外，在鬧鐘應(yīng)用中，當(dāng)你調(diào)節(jié)輪盤時，會有持續(xù)的機(jī)械震動反饋，且音效是自行車鏈條轉(zhuǎn)動的齒輪聲。快速撥動輪盤時，視覺上還會有一個物理的慣性力，直到力竭停止。

鬧鐘應(yīng)用至此，音效、觸感、視覺三者渾然一體，達(dá)到了精準(zhǔn)的協(xié)同表現(xiàn)。

終點(diǎn)與手勢意圖

在 FaceTime 視頻通話中，屏幕角落有一個小的播放窗口代表著自己。這個浮動的小窗口，它就可以被移到屏幕任意的 4個角落，這些角落叫做手勢的終點(diǎn)。

△ 滑動與拖動

你可以拖動浮窗到角落，但這樣需要跨過半個屏幕，非常麻煩。

因此，蘋果基于預(yù)測動量這一概念，捕獲滑動的動量和速度。用戶只需輕量級的滑動投擲，即可將浮窗到達(dá)預(yù)測位置。蘋果把這個叫做，終點(diǎn)和手勢意圖一致。

利用行為線索

蘋果是如果教你使用手勢交互的？

在 Safari 瀏覽器中，每個標(biāo)簽頁的左上角都有個 X 圖標(biāo)，當(dāng)你點(diǎn)擊圖標(biāo)時，標(biāo)簽頁會向左滑出，表示它被關(guān)閉了。這就暗示，除了點(diǎn)擊圖標(biāo)，還可以采用左滑操作來關(guān)閉標(biāo)簽頁。

△ Safari 瀏覽器

這就是通過行為動畫線索，用其中一個方式去教另一個操作方式。

△ 向上滑動解鎖

物理曲線動畫

為什么蘋果系統(tǒng)的過渡動畫看起來很舒服？

因?yàn)樘O果大量采用了現(xiàn)實(shí)世界的物理特性：慣性、彈性、重力、阻力。和觸控一樣，蘋果把交互動畫放在了極高的位置。

△ Apple Music

Apple Music 模態(tài)彈窗的動畫曲線設(shè)計非常嚴(yán)謹(jǐn)。在屏幕底欄有個迷你播放器，點(diǎn)擊它，可以查看播放詳情。由于點(diǎn)擊這一操作沒有任何動量，所以蘋果用了100% 阻尼來確保它不會過沖。

但你如果下拉關(guān)閉模態(tài)彈窗時，向下的方向就有了動量，因此蘋果用了80% 阻尼來獲得一些彈性和擠壓。可以看到上面這個動畫，最后底欄會有微彈效果。

如無必要, 勿增實(shí)體

2017 年，蘋果發(fā)布了 iPhone X，由 Face ID 取代了 Touch ID，確立了新的人機(jī)交互解鎖方式。

但劉海的工業(yè)設(shè)計，被用戶瘋狂吐槽。有沒有別的辦法呢？前蘋果首席設(shè)計官喬納森·艾維曾評價 oppo 的升降式攝像頭設(shè)計：「這是一個好的 idea，但我們永遠(yuǎn)不會這么做」。

確實(shí)，如無必要，勿增實(shí)體，這并不符合蘋果公司追求簡潔和一體化的設(shè)計理念。

△ FaceID解鎖

雖說丑，但 Face ID 還是有黑科技的。在劉海中有一顆紅外攝像頭，業(yè)界一般用 850 nm 波長的，但這個波段很容易受陽光影響。那蘋果是怎么解決的呢？

它收購了一家相機(jī)傳感器公司 InVisage，這家公司的量子薄膜技術(shù)，可以讓動態(tài)范圍增加 3 倍，一舉將紅外攝像頭的波長提升到了 940nm，這才讓 iPhone 在強(qiáng)烈的太陽光下能夠正常面容識別。

重新定向

在使用設(shè)備中，用戶的操作是一直在改變的，所以交互的中間過程，同樣需要重新定向。

△ 上滑與多任務(wù)后臺

比如，在點(diǎn)開 App 的過程中，突然意識到我實(shí)際上想要打開多任務(wù)后臺，這時交互手勢是可以并行的，不必等到App完全打開，就可以向上滑動，這個過程就是重新定向。

即使已經(jīng)進(jìn)行了操作，也可改變意圖，輕松取消操作，始終讓界面掌控在用戶的控制之下。

總結(jié)

當(dāng)你需要的時候，它永遠(yuǎn)能及時響應(yīng)。當(dāng)你滑動操作時候，它永遠(yuǎn)能理解你的意圖，并且給你最自然的觸覺反饋。為用戶創(chuàng)造一系列的愉悅體驗(yàn)，這也許就是蘋果的設(shè)計哲學(xué)。

歡迎關(guān)注作者的微信公眾號：「洋爺」