編者按：這篇文章出自用戶體驗設計行業(yè)內(nèi)的資深機構(gòu) NNGroup，他們一直謹慎而專業(yè)地對行業(yè)進行審視、分析和總結(jié)，這篇文章更新于 2023 年第一天，他們通過真實的用戶調(diào)研和持續(xù)的觀察，梳理了最近幾年移動端 UX 設計的變化，下面是正文。

從 iPhone 誕生到現(xiàn)在已經(jīng)15年了，移動端的用戶體驗設計的綜合素質(zhì)已經(jīng)相當穩(wěn)定了。移動端的標準已經(jīng)制定完全，移動端 Web 應用和本地應用之間的界限也越來越模糊了。

最初的 iPhone 是在 2007 年 6 月發(fā)布的。2008 年底，我們開始發(fā)布了第一版「移動端設計報告」，當時絕大多數(shù)的用戶所使用的移動端設備，用戶體驗是相當糟糕的。當時，與絕大多數(shù)的移動端網(wǎng)頁和硬件設備相比，程度能到「勉強能用」的APP或者網(wǎng)頁，都已經(jīng)算是極佳的用戶體驗了。

而在5年前，我們發(fā)布第四版「移動端設計報告」的時候，我們對移動端產(chǎn)品的可用性狀況進行了全面的評估。但是我們很高興地發(fā)現(xiàn)，絕大多數(shù)的移動端 APP 和網(wǎng)頁都提供了良好的用戶體驗。隨后的第五版報告中，我們看到了持續(xù)的進步。

此刻，移動端用戶體驗終于抵達了成熟期。移動端設計變得更加穩(wěn)定，而多實驗性設計和功能的接受度有所降低。此外，移動端成為主流，用戶幾乎會在移動端設備上嘗試完成幾乎所有人物（盡管用戶仍然喜歡在大屏幕上完成更重要的任務）。很少有公司現(xiàn)在不碰移動端的業(yè)務。

在今天的這篇文章中，我們將會突出探討移動端設計的現(xiàn)狀以及一些突出的主題。

0、調(diào)研用戶

基于第五版的移動端可用性報告，我們進行了遠程測試和面對面的可用性測試，涉及 19 名美國的參與者，它們測試了總計 60 個不同的網(wǎng)站和 APP。

1、設計風格的融合

過去幾年中，最大的變化是設計風格的融合。在更早一些時候，許多網(wǎng)站和 APP 的設計者會嘗試新的交互方式和布局結(jié)構(gòu)，而如今我們可以肯定的說移動端交互已經(jīng)穩(wěn)定下來了。很多設計模式已經(jīng)成為標準，并且大家對于什么時候用什么設計元素有了清晰的認知，比如導航欄和漢堡菜單，如今已經(jīng)達成某種平衡，絕大多數(shù)的網(wǎng)站和 APP 會選擇其中一個作為主要的導航模式。盡管按照「信息氣味理論」，漢堡菜單的數(shù)值偏低，但是它依然成為了主流的方案之一。

這種融合出現(xiàn)在方方面面。比如 iOS 和 Android 如今就變得和彼此更加相似，這也使得設計師可以可以毫無掛礙地為兩個平臺設計近乎完全相同的 UI，而不會影響最終 APP 的可用性。其中最典型的變化，就是 蘋果官方出的 iPhone 和谷歌官方出品的 Pixel 系列都將屏幕的 Home 實體按鍵去除，而界面交互幾乎完全仰賴手勢操作。蘋果將 3D Touch 去掉之后，Android 和 iOS 如今使用著完全一樣的長按呼出菜單。

2、「完整網(wǎng)站」的消亡

最近一次移動端可用性設計會當中，我們很驚訝地碰到一位參與者，他不知道我們所說的「完整網(wǎng)站」是什么意思。在很長一段時間當中，移動端訪問網(wǎng)頁的時候，打開的是專門針對移動端設備開發(fā)的精簡后的「移動版」網(wǎng)頁，而原本針對桌面端設計的網(wǎng)頁會「更加完整」。

雖然有一小部分用戶可能會青睞于在手機上訪問桌面版的頁面，但是絕大多數(shù)人不需要這樣做甚至不知道有「桌面版」存在。由于響應式設計的存在，如今絕大多數(shù)的網(wǎng)站從功能到內(nèi)容都可以兼顧桌面和移動端兩種環(huán)境，內(nèi)容不適配移動端的情況越來越少，幾乎不存在了。

3、原生應用和 web 應用之間界限更加模糊

對于開發(fā)者而言，本地原生應用和 web 應用在技術(shù)層面上幾乎完全不相同。而對于用戶而言，兩者僅僅是渠道有所不同兩種應用工具。

在過去5年當中，兩者甚至在渠道之間的界限也都變得越來越模糊，至少在用戶層面的感知是這樣的。

首先，web 應用和原生應用之間的差異正在變小。隨著漸進式web應用（PWA）的出現(xiàn)，我們現(xiàn)在擁有和本地應用高度相似的移動端網(wǎng)站，它們可以擁有一個獨立的圖標，單獨在后臺運行，甚至可以接入推送通知等手機功能，而這些在之前是不可能擁有的。

BMW.com 的網(wǎng)站以 PWA 應用的方式存在

同時，原生應用需要和網(wǎng)絡更加靠近才行。原本必須要安裝到本地的應用正在變得更加輕量、易于「安裝」，iOS 平臺上推出了 App Clips，而 Android 平臺上一會兒有對應的即時應用程序，它們讓用戶無需安裝即可提前體驗 APP 在本地于運行時的功能。

這種機制又更加靠近 PWA 應用的體驗，兩者之間的界限變得更加模糊難明。

4、更簡單的登錄和注冊

登錄和注冊的用戶體驗升級是移動端用戶體驗進化的標志之一。設計師汲取了來自方方面面的經(jīng)驗教訓，非常確定在移動端小屏幕上輸入密碼是一件乏味的事情。

如今有很多不同的方式讓登錄和注冊變簡單，有的是基于身份驗證機制（面部識別、指紋驗證等），有的是基于已有的支付接口（Apple Pay、Google Pay、支付寶等）的方式，有的則是內(nèi)置于瀏覽器和系統(tǒng)的密碼管理器，設計師已經(jīng)在盡力縮短登錄的流程。

而注冊的新趨勢是「無密碼帳號」，無需定義密碼即可創(chuàng)建帳號，著是基于一次性密碼（OTP）和魔術(shù)連接（magic link）的機制，其中，一次性密碼我們應該都很熟悉了，密碼或者驗證碼通常是系統(tǒng)發(fā)送到綁定的帳號或者手機號上，借此實現(xiàn)注冊和登錄。

蘋果的密鑰機制則更進一步，系統(tǒng)自動創(chuàng)建，然后加密存儲于云端，用戶甚至不用知道他們的密碼具體是什么。

5、圍繞小屏幕設計

我們在幾年前已經(jīng)注意到，設計師已經(jīng)開始有意識地針對小屏幕的限制來設計網(wǎng)頁和 APP，如今，這種趨勢更加明顯，設計師將不必要的 UI 元素熟練地隱藏起來，讓用戶在滾動瀏覽中自然獲取信息，首屏也不再是堆滿功能按鈕的垃圾堆。

然而另一方面，我們依然注意到很多網(wǎng)頁還是會因為一些不必要的元素被刻意拉長，其中很多確實是基于「用戶是通過移動端訪問網(wǎng)頁」的這種場景來進行設計的。但是，需要強調(diào)的是，用戶僅僅只有在認為你的內(nèi)容有價值的時候才會繼續(xù)滾動，如果重要信息之前是一屏無關(guān)緊要的低價值信息或者裝飾的時候，他們可能會在滾動之前就直接放棄了，而這種情況在注意力被高度稀釋的今天，只會越來越頻繁地發(fā)生。

BankofAmerica.com 的頁面中無效的裝飾信息拉長了整個頁面。

6、疊加過多功能

在幾年前觀察的時候，我們就注意到移動端頁面上疊加了過多內(nèi)容的情況，而如今這個問題也同樣被放大，變得更加流行。很多網(wǎng)頁一打開就出彈出框已經(jīng)是基本操作，更有甚者直接拉滿，右下角是聊天氣泡，頂上是彈出框請求 Cookie 權(quán)限，中間是廣告和促銷，就這種局面下還有網(wǎng)頁本身的漢堡菜單和導航欄藏在首屏上。

不幸的是，即時用戶不被這些東西煩死，互相疊加覆蓋的功能同樣很容易出現(xiàn)各種可用性問題。有的是功能本身在不同設備上加載時因為兼容性差異自然出現(xiàn)的，還有的則是因為用戶以為它們是無關(guān)的新頁面，直接關(guān)掉。

7、應用內(nèi)瀏覽器

另外一個重要的趨勢是應用內(nèi)內(nèi)置瀏覽器的流行，這種技術(shù)的好處在于，用戶在應用內(nèi)點擊某個鏈接的時候，無需跳轉(zhuǎn)出去直接就能在應用內(nèi)加載頁面內(nèi)容。它的優(yōu)點在于留存用戶，但是它的缺點也在于它容易讓用戶感覺迷惑和混亂，突然打開網(wǎng)頁可能會讓用戶忘了他們在哪，并且可能因此很難再次打開對的鏈接。此外，應用本身的 UI 元素也會干擾內(nèi)置瀏覽器的使用，比如屏幕內(nèi)出現(xiàn)2個漢堡菜單這種情況。另外，由于內(nèi)置瀏覽器的可用性，可能會有的頁面 UI 元素無法完全加載，

頁面出現(xiàn)多個漢堡菜單，導航功能和 APP 自帶的導航欄同時存在。

頁面中按鈕被覆蓋，無法完全加載。

結(jié)語

必須承認的是，移動端的用戶體驗比以往任何時候都要好，網(wǎng)頁、本地原生應用之間的一致性正在變好，用戶已經(jīng)適應了絕大多數(shù)常見的交互模式，在移動端上請求桌面端頁面的情況發(fā)生的頻率在降低，但是移動端體驗距離完美還有很長的一段距離。