防砸臉指南！大屏?xí)r代如何重塑界面交互？

編者按：有木有同學(xué)仰躺著玩手機時經(jīng)常被砸臉？在不改變大屏幕的前提下，想護(hù)住你的臉就得靠交互設(shè)計師了。今天百度的同學(xué)總結(jié)了交互工作的一些經(jīng)驗，用在大屏界面上特別合適，為了用戶的臉，這篇就別錯過咯。

這是一個大屏手機的時代。

強調(diào)這件事情的意義在于，這已經(jīng)成為事實。

Medium上存在一份個人統(tǒng)計。

在過去7年，新上市的手機屏幕尺寸越來越大。

以4.5英寸為分界點，我們更清晰的看到這一變化。過去的兩年，4.5英寸的比例從10%升至80%。

在國內(nèi)的過去3個季度，使用FHD HD分辨率的手機從38%的份額增至50%。

更大尺寸的屏幕可以承載更多的內(nèi)容展現(xiàn)，更適合游戲、閱讀與播放視頻，體驗得以提升。

然而屏幕尺寸的上升并沒有引起用戶操作上的過多不適，有51%的用戶已經(jīng)適應(yīng)雙手操作。

關(guān)于這點，有篇很棒的文章推薦給同學(xué)們，分析到位具體：《移動設(shè)備手持分析！用戶到底是怎么使用手機的？》

即使用戶單手操作，在操作大屏幕時的相對盲區(qū)（深色區(qū)域），需要更多的響應(yīng)時間，也可以被接受。

即便如此。3.5英寸~4英寸，依然是平衡單手操作與體驗的合理尺寸范圍。

這樣就產(chǎn)生一個矛盾：用戶擁有更大屏幕的尺寸，但從人機交互的角度，并不完美。

面對這一現(xiàn)狀，從APP產(chǎn)品界面設(shè)計的角度，需要做出改變。

大屏幕擁有典型的可用性問題：縱向單手操作機身，邊角、頂部、左右側(cè)邊難以觸達(dá)，放置在以上盲區(qū)的點擊入口，將導(dǎo)致體驗路徑中斷。

交互設(shè)計角度的最佳實踐：

1. 設(shè)計安全區(qū)域，避開操作盲區(qū)

示例，百度搜索結(jié)果頁，根據(jù)視線規(guī)律，典型的左上角操作盲區(qū)可以用于logo展現(xiàn)。

2. 注意使用場景路徑觸發(fā)的連貫性

示例，在百度手機助手Android中下載百度瀏覽器，操作區(qū)域集中在安全區(qū)域。

3. 更多的使用可拖動的浮動按鈕，給用戶更自由的操作可能性

示例，百度瀏覽器Android中翻頁/返回頂部的組合按鈕。

4. 更多的使用手勢，并提供暗示

示例，百度瀏覽器Android的刪除窗口操作。

5. 更多的使用語音作為輸入方式

示例：生活手記中使用語音替代鍵盤輸入。

6. 橫屏Pad化的操作設(shè)計，以及更多的內(nèi)容展現(xiàn)

示例，百度瀏覽器iPhone的橫屏設(shè)計，如同網(wǎng)頁的響應(yīng)式布局概念。

在界面交互的層面之外，在不遠(yuǎn)的時間，硬件存在更多的優(yōu)化可能性。

1. 更窄的邊框，更大的顯示比例。

2. 柔性材質(zhì)。

3. “手機”成為服務(wù)的觸發(fā)者，屏幕投射與隔空操作。

鋼鐵俠即視感，順便推薦一篇鋼鐵俠的文章：《PS+AI教程！教你繪制超酷炫的鋼鐵俠面具！》

之所以將討論的范圍擴(kuò)展到硬件，是希望設(shè)計師在針對具體屏幕設(shè)計的同時，能夠從另外的視角，思考人機交互的變化與可能性，激發(fā)創(chuàng)造力。

當(dāng)前是大屏手機的時代，推動你的手機APP產(chǎn)品跟進(jìn)吧！

多看多想多學(xué)習(xí)，前輩的經(jīng)驗都是財富！

華為設(shè)計總監(jiān)的6年經(jīng)驗分享，幫你全民提升自己！
《6年面試經(jīng)驗總結(jié)！設(shè)計師如何從8個方面全面提升自己？》

設(shè)計師的自我修煉手冊！網(wǎng)易美女主管傾情分享！
《網(wǎng)易美女設(shè)計主管！論設(shè)計師的自我修養(yǎng)》

升職加薪的17條經(jīng)驗分享！
《17條經(jīng)驗之談！視覺設(shè)計師如何進(jìn)階提升自己能力》

原文地址：mux.baidu

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：2650232288@qq.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國內(nèi)人氣最高的網(wǎng)頁設(shè)計師學(xué)習(xí)平臺，專注分享網(wǎng)頁設(shè)計、無線端設(shè)計以及PS教程。
【特色推薦】
設(shè)計師需要讀的100本書：史上最全的設(shè)計師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計微博：擁有粉絲量88萬的人氣微博@優(yōu)秀網(wǎng)頁設(shè)計 ，歡迎關(guān)注獲取網(wǎng)頁設(shè)計資源、下載頂尖設(shè)計素材。
設(shè)計導(dǎo)航：全球頂尖設(shè)計網(wǎng)站推薦，設(shè)計師必備導(dǎo)航：http://hao.uisdc.com
官方微信：想在手機上、被窩里獲取設(shè)計教程和各種意想不到的"福利"嗎？添加優(yōu)設(shè)哥微信號：youshege