自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

移動開發(fā) Android
從這兩年廠商們發(fā)布的手機來看,手機都有一個共同的特點,就是屏幕尺寸越來越大。屏幕尺寸變大后,手握手機的方式和界面交互操作方式也隨之改變,那對于設(shè)計而言,是否也應(yīng)該隨之進行改變呢?

編者按:iPhone X 在 2017 年上市以來,全面屏手機就開始逐漸普及。iPhone 8 的 4.7 寸屏幕到目前最新機型 iPhone 11 的 6.1 寸屏幕,以及 Pro Max 系列的 6.5 寸,各種各樣的劉海屏、水滴屏、挖孔屏、折疊屏等等屏幕方式隨之出現(xiàn),物理 Home 鍵都被舍棄改成虛擬按鍵,甚至是沒有虛擬按鍵的手勢滑動操作。

[[316867]]

而這些手機都有一個共同的特點,就是屏幕尺寸越來越大。屏幕尺寸變大后,手握手機的方式和界面交互操作方式也隨之改變,那對于設(shè)計而言,是否也應(yīng)該隨之進行改變呢?

拇指的操作范圍

想單手點擊屏幕的操作,需要手足夠靈活進行一輪操作才能夠到屏幕上方,過程中稍有不慎,手機隨時會砸地上。作者的手機屏幕已經(jīng)修了幾次,差不多趕上一臺二手機的價格了。

在 2013 年,國外設(shè)計師 Steven Hoober 發(fā)表了一篇《手機界面設(shè)計》的研究報告中,對一千三百名手機使用者進行量化研究數(shù)據(jù):

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

據(jù)當(dāng)時研究的數(shù)據(jù)可以看出,有近半的用戶是單手使用手機(現(xiàn)在肯定不止)。當(dāng)用戶單手操作的時候,實際拇指可以觸摸到的區(qū)域是如下圖這樣的。綠色區(qū)域是拇指的正常操作區(qū)域,黃色區(qū)域是拇指能觸碰到的最大限度范圍,紅色區(qū)域是觸摸比較困難的區(qū)域。

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

然而這份研究報告的數(shù)據(jù)是在 2013 年發(fā)布,當(dāng)時還沒有全面屏的出現(xiàn),如果把上面研究結(jié)論的區(qū)域,套用到如今的手機屏幕尺寸上,頂部的紅色區(qū)域會占更大比例。以 iPhone 11 尺寸比例作為參考,如下圖:

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

拇指可操作范圍大約在 3 分之 2 的區(qū)域,可見想要觸碰到紅色區(qū)域是有一定難度的。也正是因為這份報告只適合當(dāng)時的手機市場情況,在當(dāng)今已經(jīng)不適用了,因此需要重新去考慮如何為大屏幕手機進行界面設(shè)計。

為拇指區(qū)域設(shè)計

根據(jù) 2020 年手機UX設(shè)計趨勢,大屏幕設(shè)計將會成為熱點。根據(jù)數(shù)據(jù)報告中有說明,2018 年 10 月使用大屏手機的用戶比例是16.3%,到 2019 年 12 月,該數(shù)據(jù)已經(jīng)上升到 41%,并且會在未來更多新機型的出現(xiàn)中持續(xù)上漲。

那隨著大屏幕手機的普及,就意味著設(shè)計師在設(shè)計界面的時候,要為大屏幕手機的使用場景進行界面調(diào)整,避免用戶難以使用的體驗問題。以下是我整理的一些設(shè)計建議方案:

1. 頭部區(qū)域設(shè)計更高

通過將標(biāo)題欄的信息區(qū)域放大,盡量把主要操作內(nèi)容向拇指區(qū)域靠近。

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

 

 


手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

 

2. 常用導(dǎo)航與操作居于底部

比起導(dǎo)航欄放在頂部,更適合大屏幕手機的方式是將導(dǎo)航和重要操作盡量往屏幕底部放置。

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

3. 手勢操作頁面切換與返回

抖音和 Instagram story 等短視頻應(yīng)用界面都是通過手勢滑動屏幕的方式,對頁面進行切換,操作的學(xué)習(xí)成本很低,而且主要操作也在屏幕底部。這種操作方式也會在今年越來越多地被使用。

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

4. 提示彈窗從底部升起

常用的彈窗,很多是設(shè)計在屏幕中間彈出,為了適配大屏幕,不妨嘗試從底部彈出,關(guān)鍵選項都能輕松選擇,提高轉(zhuǎn)化率。

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

5. 使用大卡片

屏幕尺寸變大以后,使用整張大卡片可以讓用戶瀏覽內(nèi)容更專注,大面積的配圖和留白,也能提高用戶的點擊欲望。

手機屏幕越來越大,UX設(shè)計師面臨哪些挑戰(zhàn)?

除此以外,作為手機廠商,在發(fā)布大屏幕手機的時候,就有對界面操作做了一些對應(yīng)系統(tǒng)級的設(shè)計調(diào)整,比如界面下拉懸停,鍵盤單手模式,屏幕邊緣滑動返回等等。

總結(jié)

大屏幕尺寸已經(jīng)是趨勢,屏幕大意味著內(nèi)容可以更大限度地得到展示,有利于產(chǎn)品提供更多的服務(wù),不再糾結(jié)首屏無法展示完主要內(nèi)容。在這個信息爆炸的時代,用戶也不再滿足于小屏幕的瀏覽方式。可以說,大屏幕已經(jīng)是無法改變的趨勢。與其擔(dān)心問題到來,設(shè)計師更應(yīng)該思考如何去適應(yīng)產(chǎn)品的快速迭代,不斷更新自己的設(shè)計思維模型,更全面思考問題,產(chǎn)出更合理、體驗更好的設(shè)計方案。

希望本文內(nèi)容可以對你有所啟發(fā)。

責(zé)任編輯:未麗燕 來源: 優(yōu)設(shè)
相關(guān)推薦

2009-04-25 08:55:05

智能手機應(yīng)用移動OS

2022-12-27 19:05:54

建筑能源人工智能

2012-05-04 11:13:57

社交應(yīng)用

2022-02-11 23:49:16

穩(wěn)定幣加密貨幣金融

2017-12-26 15:34:55

2021-03-03 14:23:06

微信小程序互聯(lián)網(wǎng)

2019-03-07 14:40:37

前端開發(fā)React

2020-12-14 13:18:20

微信空間清理文件

2018-09-25 08:58:50

技術(shù)能力效率

2020-07-13 20:26:30

手機64G手機APP

2021-11-17 11:09:53

比特幣美聯(lián)儲貨幣

2023-09-22 13:44:34

2024-07-16 23:05:28

2022-07-19 10:14:53

勒索軟件網(wǎng)絡(luò)攻擊

2021-09-27 10:23:49

谷歌云平臺應(yīng)用程序

2017-08-16 11:09:54

App Store開發(fā)應(yīng)用程序

2023-12-04 16:02:13

2024-10-24 14:19:20

2021-11-08 14:15:34

物聯(lián)網(wǎng)安全技術(shù)

2018-11-28 10:52:45

云計算阿里云微軟
點贊
收藏

51CTO技術(shù)棧公眾號