手勢(shì)設(shè)計(jì) | 大屏里的指尖奧秘

1 評(píng)論 7068 瀏覽 11 收藏 8 分鐘

編輯導(dǎo)語(yǔ):大屏?xí)r代,出現(xiàn)了各種各樣新奇有趣的手勢(shì),為我們帶來(lái)了更好的體驗(yàn)。在這篇文章中,作者盤(pán)點(diǎn)了各類(lèi)令人愉悅的手勢(shì)設(shè)計(jì),一起去看看吧!

隨著大屏?xí)r代的全面普及,新穎好用的手勢(shì)交互能夠給用戶(hù)帶來(lái)更高的效率和更有趣的體驗(yàn),即便是最基礎(chǔ)的手勢(shì)也可以在不同場(chǎng)景里煥發(fā)新的光彩。

今天我們一起來(lái)看看都有哪些讓人愉悅的手勢(shì)設(shè)計(jì)吧!

一、單手操作:復(fù)雜功能也能輕松拿捏

當(dāng)下手機(jī)屏幕越來(lái)越大,給單手操作帶來(lái)不少困難,不少os和app針對(duì)單手操作提供了更加便利的手勢(shì)交互,讓用戶(hù)能夠輕松使用。

1. 單手輕便縮放

「高德」對(duì)于地圖的縮放提供了多種手勢(shì)操作來(lái)應(yīng)對(duì)不同的場(chǎng)景:常規(guī)場(chǎng)景下兩指搓動(dòng)縮放;單手場(chǎng)景下雙擊可按一定比例放大地圖,而雙按滑動(dòng)則可以無(wú)縫縮放地圖,徹底解決單手對(duì)于縮放地圖的不友好。

2. 單手快進(jìn)快退

影視app的全屏播放狀態(tài),基本形成了一套完善的交互操作心智,通過(guò)左右滑動(dòng)、上下滑動(dòng)以及區(qū)域長(zhǎng)按等操作實(shí)現(xiàn)亮度、音量、快速進(jìn)退和速率播放等功能、借助手勢(shì)能力幫助用戶(hù)盡可能的在單手狀態(tài)下快捷實(shí)現(xiàn)基本操作。

3. 系統(tǒng)級(jí)單手模式

屏幕太大一只手無(wú)法掌控?目前絕大多數(shù)安卓OS都可以通過(guò)不同的手勢(shì)操作觸發(fā)單手模式,在犧牲屏占比的情況下使用戶(hù)能單手觸達(dá)所有內(nèi)容;如華為的「鴻蒙」通過(guò)底部橫滑懸停的方式觸發(fā)。

二、多段式操作:一個(gè)手勢(shì)的多種選擇

在有些app里,同一個(gè)按鈕或手勢(shì)采用多段式交互,比如根據(jù)不同的觸發(fā)時(shí)長(zhǎng)呈現(xiàn)不同的功能效果,以此來(lái)幫助用戶(hù)實(shí)現(xiàn)更便捷的操作或更多的功能選擇。

1. 相似功能的遞進(jìn)

「bilibili」的點(diǎn)贊按鈕除了單擊為點(diǎn)贊功能外,還有很符合產(chǎn)品特色的“一鍵三連”功能,即通過(guò)長(zhǎng)按點(diǎn)贊按鈕可以同時(shí)觸發(fā)點(diǎn)贊、投幣、收藏功能,已成為B站的標(biāo)志性互動(dòng)方式。

「網(wǎng)易云音樂(lè)」的返回鍵,在長(zhǎng)按時(shí)可以直接返回最上級(jí)主頁(yè),滿(mǎn)足用戶(hù)不同的返回需求。

2. 不同功能的跨越

淘寶首頁(yè)下拉手勢(shì),根據(jù)拖拽距離產(chǎn)生兩種交互結(jié)果:正常短距離下拉提示“松開(kāi)刷新”,而持續(xù)下拉則會(huì)進(jìn)入淘寶二樓承接頁(yè)。這樣的方式也給用戶(hù)多一種選擇。

三、輕便功能:預(yù)約舒坦的操作體驗(yàn)

通過(guò)手勢(shì)創(chuàng)新,我們也可以對(duì)一些以往較為繁瑣的功能進(jìn)一步簡(jiǎn)化,以更合理的方式高效實(shí)現(xiàn)。

1. 未讀消息快速清理

對(duì)于強(qiáng)迫癥患者來(lái)說(shuō),在「QQ」消息列表內(nèi)的小紅點(diǎn)快捷清空操作非常痛快,用戶(hù)可以直觀的將某條消息的未讀紅點(diǎn)直接拖拽刪除。

2. 隨心所欲的畫(huà)幅

「bilibili」在全屏觀看視頻的狀態(tài)下,可以通過(guò)雙指操作讓用戶(hù)隨心所欲的控制畫(huà)幅大小和角度。

3. 視頻快速預(yù)覽

「youku」在主頁(yè)里長(zhǎng)按單個(gè)內(nèi)容卡片,會(huì)進(jìn)入預(yù)覽模式播放該節(jié)目的簡(jiǎn)短切片讓用戶(hù)快速?zèng)Q策。

4. 文件快速多選

「百度網(wǎng)盤(pán)」里當(dāng)用戶(hù)點(diǎn)擊并按住文件選擇控件時(shí),結(jié)合滑動(dòng)可以實(shí)現(xiàn)快速多選。

四、創(chuàng)新手勢(shì)

除了常規(guī)手勢(shì)外,很多os會(huì)在系統(tǒng)級(jí)別定制一些更創(chuàng)新的手勢(shì),來(lái)方便用戶(hù)實(shí)現(xiàn)快捷創(chuàng)新功能。

1. 按壓面積的識(shí)別

在錘子手機(jī)的「samrtisanos」里,對(duì)圖片或文字大面積的長(zhǎng)按會(huì)喚起大爆炸模式,可快速識(shí)圖或編輯文字內(nèi)容。

2. 按壓關(guān)節(jié)的識(shí)別

華為「鴻蒙」的截圖功能通過(guò)識(shí)別關(guān)節(jié)敲擊來(lái)實(shí)現(xiàn);基于這種技術(shù)能力,可根據(jù)不同的關(guān)節(jié)動(dòng)作來(lái)實(shí)現(xiàn)局部截圖、滾動(dòng)截圖等功能。

3. 隔空手勢(shì)的識(shí)別

華為「鴻蒙」攝像頭可讀取用戶(hù)隔空手勢(shì),根據(jù)手勢(shì)觸發(fā)各種交互動(dòng)作,使用戶(hù)在特殊場(chǎng)景下不接觸手機(jī)屏幕實(shí)現(xiàn)多種常規(guī)功能。

五、寫(xiě)在最后

手勢(shì)是使用移動(dòng)設(shè)備最基本的手段,在應(yīng)用設(shè)計(jì)中,我們可以充分使用各種手勢(shì)帶來(lái)的便捷,幫助用戶(hù)提升產(chǎn)品體驗(yàn);當(dāng)然,即便是最簡(jiǎn)單的點(diǎn)擊與長(zhǎng)按等手勢(shì)操作,也可以結(jié)合具體場(chǎng)景,通過(guò)創(chuàng)新的交互響應(yīng)來(lái)傳遞產(chǎn)品功能或解決用戶(hù)的痛點(diǎn)。

 

作者:容易手滑的騰;公眾號(hào):淘寶設(shè)計(jì)

原文鏈接:https://mp.weixin.qq.com/s/PhHTm0fB5d36IYG6kE3Ggg

本文由 @淘寶設(shè)計(jì) 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

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

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 雖然我不經(jīng)常用這些手勢(shì),但確實(shí),用戶(hù)在使用這些便捷操作時(shí)能提高用戶(hù)體驗(yàn)感,增加好感度

    回復(fù)
专题
12968人已学习14篇文章
在项目实际推进过程中,不加控制的需求变更往往给项目带来沉重的负担和无法预料的风险。本专题的文章分享了如何做好需求变更。
专题
35361人已学习18篇文章
借用别人家的经典案例,来扒一扒社交电商。
专题
14999人已学习13篇文章
在产品的商业模式中,广告变现占据了很大的比重,那么广告功能就是产品里面非常重要的功能之一。本专题的文章分享了如何搭建广告投放系统。
专题
12542人已学习13篇文章
Sora产品的爆火,给了我们不少的震撼,感叹AI在内容创作领域的进步实在是太快了。本专题的文章分享了对于Sora的解读和思考。