編輯導(dǎo)讀：現(xiàn)在的手機(jī)屏幕越來(lái)越大，有時(shí)候單只手都握不住更別提單手操作了。但是單手操作是最方便且常用的交互方式，本文作者根據(jù)這次iOS的更新，分享了一些自己對(duì)提升單手操作體驗(yàn)的想法，與你分享。

6 月 7 日凌晨 1 點(diǎn)，蘋果全球開(kāi)發(fā)者大會(huì) WWDC 2022如期舉行，此次大會(huì)展現(xiàn)了全新的視覺(jué)設(shè)計(jì)、更高效的交互方式以及更充分的互聯(lián)互通。本文主要結(jié)合iOS此次的更新的功能點(diǎn)分享一些關(guān)于單手操作的設(shè)計(jì)思考以及如何提高單手操作體驗(yàn)。

一、蘋果WWDC2022 3大更新特點(diǎn)

1. 全新的設(shè)計(jì)

全新的鎖屏設(shè)計(jì)更自由、更有趣，更實(shí)用，除了可以用自己喜歡的照片和字體外，還能顯示各種小組件；鎖屏還可以實(shí)時(shí)展示活動(dòng)，隨時(shí)了解正在發(fā)生的事情，并且可以制定不同的鎖屏。

2. 更高效的交互方式

iOS16此次更聚焦搜索框、鎖屏通知全部下移，可以以展開(kāi)、疊放或隱藏視圖的方式進(jìn)行展示。單手操作更加方便。

同時(shí)mac、iPad的交互差別被進(jìn)一步縮小，“臺(tái)前調(diào)度”功能讓多窗口、可視化的桌面交互在iPad上落地。

3. 更充分的互聯(lián)互通

無(wú)處不在的協(xié)同互聯(lián)——共享相冊(cè)、家人共享、瀏覽器共享等，親朋好友的動(dòng)態(tài)實(shí)時(shí)同步，甚至還有全新的協(xié)作App； Facetime能在Mac、iPhone、iPad上實(shí)現(xiàn)無(wú)縫自由流轉(zhuǎn)；iPhone能夠通過(guò)配件充當(dāng)mac設(shè)備的無(wú)線攝像頭，mac設(shè)備也能擁有旗艦主攝級(jí)別的通話攝像頭。

二、iOS與MIUI的設(shè)計(jì)思考

1. 鎖屏通知位置

iOS：顯示位置下移，默認(rèn)顯示的通知數(shù)量變少，支持展開(kāi)列表、疊放列表、隱藏列表三種視圖方式展示。

MIUI：鎖屏的位置在圖片中間顯示，平鋪展示。

對(duì)比：從閱讀效率的角度，MIUI的鎖屏通知展示數(shù)量更多；從鎖屏通知的展示方式來(lái)看，iOS支持多種方式展示，整體更自由、更靈活。

2. 桌面全局搜索

iOS：全局搜索功能下移至dock欄上方，方便單手操作，且不遮擋其他元素，用戶下拉時(shí)進(jìn)入全局搜索。

MIUI：具備桌面搜索框，目前不支持頁(yè)面下拉進(jìn)入全局搜索,下拉手勢(shì)可以進(jìn)入消息通知和工具欄。

對(duì)比：均保留桌面快捷入口，搜索入口更高效、便捷。

不難看出不管是iOS還是MIUI，在系統(tǒng)設(shè)計(jì)上都在考慮單手勢(shì)操作的使用場(chǎng)景。喬布斯曾說(shuō)，3.5寸屏幕是最適合人手大小的手機(jī)，但面對(duì)用戶越來(lái)越強(qiáng)的視覺(jué)體驗(yàn)需求，市面上的手機(jī)尺寸也越做越大，用戶單手操作也越來(lái)越難。

三、如何提高單手操作體驗(yàn)

在講單手操作之前，我們先來(lái)了解一下用戶是如何使用手機(jī)的，以及觸控屏是如何感應(yīng)我們的操作的。

1. 用戶如何使用手機(jī)

Steven Hoober在《How Do Users Really Hold Mobile Devices?》一文中指出，通過(guò)兩個(gè)月的時(shí)間對(duì)1333名手機(jī)用戶在公眾場(chǎng)所(街道、機(jī)場(chǎng)、汽車站、咖啡館、火車上、汽車上等)使用習(xí)慣的觀察得出以下結(jié)論：

2. 觸屏是如何感知操作的

Steven Hoober通過(guò)研究在《Common Misconceptions About Touch》中指出，因?yàn)槲覀兊氖种甘侨S立體且柔軟的，在操作屏幕的時(shí)候，只有手指的部分區(qū)域是和屏幕接觸的，這部分區(qū)域稱為接觸印跡。而觸控屏僅僅感知人們接觸印跡的幾何中心位置來(lái)出發(fā)操作，與接觸印跡區(qū)域大小無(wú)關(guān)。

除了以上這些因素外，硬件設(shè)備的差異，用戶使用移動(dòng)設(shè)備時(shí)的視線角度都會(huì)影響點(diǎn)擊操作的精準(zhǔn)度。為此 Steven Hoober提出為界面元素分別設(shè)計(jì)視覺(jué)目標(biāo)和觸控目標(biāo)（即我們常說(shuō)的熱區(qū)）的建議。

另外一個(gè)將視覺(jué)目標(biāo)和觸控目標(biāo)分開(kāi)設(shè)計(jì)的方法即為我們常說(shuō)的手勢(shì)操作，如上文所述手機(jī)使用過(guò)程中單手和左手操作的用戶比例都比較大，好的單手操作手勢(shì)設(shè)計(jì)能有效提高使用效率，減少誤操作，給用戶帶來(lái)驚喜。

3. 關(guān)于3.5寸屏幕

Steve Jobs once said that the 3.5-inch screen is the“perfect size for consume”。喬布斯曾說(shuō)，3.5寸屏幕是最適合用戶的尺寸，過(guò)大的屏幕是愚蠢的。

其實(shí)所謂的“Perfect Size”其實(shí)是站在單手操作的角度考慮的完美尺寸。當(dāng)手機(jī)尺寸為3.5英寸時(shí)，單手大拇指可以觸碰到屏幕至少90%以上的區(qū)域。

而如今屏幕尺寸已經(jīng)擴(kuò)大了1.5倍，在接近7寸的尺寸里，我們的手還可以觸碰到哪里？

四、單手操作的設(shè)計(jì)思路

通過(guò)分析用戶的操作習(xí)慣可以劃分出難易操作區(qū)域，下圖呈現(xiàn)的是左右利手的操作區(qū)域難度劃分，綠色為“易觸區(qū)”，動(dòng)動(dòng)大拇指就可以碰到；黃色為“可觸區(qū)”，努努力可以夠到，可能容易按錯(cuò)；紅色為“不可觸區(qū)”，努力也夠不到，手的負(fù)擔(dān)大，誤觸率很高；不難看出更易操作的區(qū)域位于屏幕的中下方。

所以我們?cè)谠O(shè)計(jì)時(shí)，應(yīng)該考慮哪些點(diǎn)呢？

1. 縮短大拇指的移動(dòng)路徑，降低操作負(fù)擔(dān)

來(lái)看下蘋果的日歷，我們?cè)谔砑右豁?xiàng)日程的時(shí)候，即使是兩只手操作，操作體驗(yàn)也并不流暢，兩只手需要來(lái)回調(diào)整位置。整體的操作路徑較長(zhǎng)。

我們可以嘗試縮短大拇指的移動(dòng)路徑，來(lái)看一下效果。

在日常的體驗(yàn)設(shè)計(jì)時(shí)，我們首先可以評(píng)估當(dāng)前操作交互路徑的長(zhǎng)短，然后看現(xiàn)有方案是否有可優(yōu)化的空間。

2. 讓核心操作進(jìn)入可觸區(qū)

這里我們主要考慮盡量在能力范圍內(nèi)讓核心操作進(jìn)入可觸區(qū)域，比如從紅區(qū)的“不可觸區(qū)”盡量到黃區(qū)的“可觸區(qū)”，提高單手操作下的整體體驗(yàn)。

來(lái)看一下三星的鎖屏，如果將鎖屏下的相機(jī)和電話操作位置從現(xiàn)有的不可觸區(qū)移動(dòng)到可觸區(qū)，操作體驗(yàn)會(huì)更佳。

蘋果密碼解鎖和三星的輸入撥打電話號(hào)碼，其實(shí)都考慮了單手操作的場(chǎng)景，將核心操作區(qū)域像可觸區(qū)移動(dòng)。也就是將核心操作區(qū)域整體像中間靠攏。

3. 讓高頻操作下移

Steven Hoober提出界面元素分別設(shè)計(jì)視覺(jué)目標(biāo)和觸控目標(biāo)，這里我們可以考慮區(qū)分觸控目標(biāo)和視覺(jué)的目標(biāo)。來(lái)看一些可參考的案例。

3.1 系統(tǒng)級(jí)別

Steven Hoober提出界面元素分別設(shè)計(jì)視覺(jué)目標(biāo)和觸控目標(biāo)，這里我們可以考慮區(qū)分觸控目標(biāo)和視覺(jué)的目標(biāo)。來(lái)看一些可參考的案例。

三星在相冊(cè)和設(shè)置頁(yè)面都將核心操作區(qū)域進(jìn)行了下移。

蘋果的消息通知位置在這一次也變得更低了。單手操作確實(shí)更方便了，你喜歡這個(gè)改動(dòng)嗎？

安卓系統(tǒng)特有的小窗狀態(tài)，也可以很好的解決單手操作的問(wèn)題。

3.2 第三方應(yīng)用級(jí)別

比如高德地圖，以選擇界面布局方式，其中一種將搜索條下移，上方保留可視區(qū)域，還有許多典型的應(yīng)用也是此種布局，比如滴滴、音樂(lè)類app等。

4. 原地操作原則

操作可以根據(jù)上一步點(diǎn)擊位置展開(kāi)，且仍應(yīng)位于可觸區(qū)域內(nèi)。例如微信的長(zhǎng)按信息更多編輯操作。

五、總結(jié)

上述的方案在應(yīng)用時(shí)都要考慮用戶具體的使用場(chǎng)景，過(guò)于強(qiáng)調(diào)單手，一方面可能會(huì)增加用戶的學(xué)習(xí)成本，另外也可能浪費(fèi)了大屏的優(yōu)勢(shì)，這些都是設(shè)計(jì)師需要去衡量的要素。落實(shí)到每個(gè)具體的產(chǎn)品展中，還需要設(shè)計(jì)師開(kāi)通腦力思考更多更高效的解決方案。尤其是，當(dāng)屏幕尺寸更大后，我們?cè)撊绾卧诖笃料卤Ｕ袭a(chǎn)品的用戶體驗(yàn)也是需要我們不斷思考的內(nèi)容。

感謝你的觀看！

本文由 @設(shè)計(jì)師麻小慧 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載。

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