很遺憾,因您的瀏覽器版本過低導(dǎo)致無法獲得最佳瀏覽體驗(yàn),推薦下載安裝谷歌瀏覽器!

談導(dǎo)航欄返回按鈕的替代方案

2015-09-30  來自: 陜西印象信息技術(shù)有限公司 瀏覽次數(shù):3157

本文主要討論返回按鈕的設(shè)計(jì),如果手機(jī)尺寸略大,那么你將不得不使用另一只手來點(diǎn)擊返回按鈕。我猜這也是很多安卓手機(jī)會(huì)在左下角放置硬件返回按鈕的 原因之一;不過這種解決方案也不是的,因?yàn)樵诎沧科脚_(tái)中,應(yīng)用內(nèi)的“返回上一級(jí)”按鈕與硬件返回按鈕的功能還是有所區(qū)別的。

  這里進(jìn)入譯文。我(英文原文作者)愛iPhone5,那多出來的640×176像素的空間非常有用。不過我時(shí)常會(huì)在點(diǎn)擊那個(gè)***重要的按鈕時(shí)遇到麻煩,是的,就是返回按鈕。UX設(shè)計(jì)當(dāng)中有一條規(guī)則,如果某個(gè)功能是很常用的,那么它應(yīng)該被放在***容易點(diǎn)擊到的位置上。

  49%的移動(dòng)用戶在使用手機(jī)時(shí)是單手操作的,這就意味著每兩個(gè)用戶當(dāng)中就有一個(gè)會(huì)每天多次通過單手來點(diǎn)擊返回按鈕;算起來的話這可是數(shù)以億計(jì)的點(diǎn)擊 率。如果手機(jī)尺寸略大,那么你將不得不使用另一只手來點(diǎn)擊返回按鈕。我猜這也是很多安卓手機(jī)會(huì)在左下角放置硬件返回按鈕的原因之一;不過這種解決方案也不 是的,因?yàn)樵诎沧科脚_(tái)中,應(yīng)用內(nèi)的“返回上一級(jí)”按鈕與硬件返回按鈕的功能還是有所區(qū)別的。

120.jpg

  通過手勢來解決問題

  要解決返回按鈕的問題,的方案就是使用手勢。在用戶已經(jīng)熟悉了應(yīng)用操作方式的前提下,手勢還是很有效的。另外,將手勢操作作為可視化按鈕的一種補(bǔ)充形式也是不錯(cuò)的做法。

122.png

  讓我有些驚訝的是,在試用了無數(shù)個(gè)應(yīng)用之后,我發(fā)現(xiàn)市面上已經(jīng)有很多產(chǎn)品在通過這種方法解決返回按鈕的問題了。當(dāng)然,沒有哪種解決方案能適用于所有的情況,但至少這是個(gè)開始。我個(gè)人真心希望設(shè)計(jì)師們能夠逐漸找到更多更有創(chuàng)意的方案。

 拋甩(toss)

  “拋甩”是對我們與真實(shí)物體之間互動(dòng)方式的一種隱喻,使用這種模式,你可以很輕松地將當(dāng)前的活動(dòng)界面“甩開”。例如在Letterpress中,用戶可以通過向下快速滑動(dòng)的手勢將彈出提示甩走,有點(diǎn)意思。

123.png


在Facebook里,當(dāng)你全屏查看一張圖片時(shí),可以將圖片向上或向下甩開,回到之前的界面當(dāng)中。

230.png

 橫向滑動(dòng)

  新界面從屏幕右側(cè)向左滑入視圖,這是iOS當(dāng)中的標(biāo)準(zhǔn)動(dòng)效。相應(yīng)的,我們也可以通過向相反的方向執(zhí)行輕掃來導(dǎo)航回之前的界面,例如你可以在Pinterest當(dāng)中通過向右輕掃的手勢將大圖界面向右移走,回到之前的界面。

300.png

類似的,在Flipboard里,你也可以在某主題下的內(nèi)容界面中通過向右輕掃回到主界面。

400.png

  在iBooks中,并沒有明確的視覺指引告訴你可以通過左右輕掃的手勢來打開下一頁或回到上一頁。不過除了輕掃以外,點(diǎn)擊屏幕的左右兩部分也能起到同 樣的導(dǎo)航作用,這樣,由于缺乏視覺指引所導(dǎo)致的導(dǎo)航功能不可發(fā)現(xiàn)的概率就大大降低了。而且由于翻頁效果使用了強(qiáng)有力的隱喻,所以一旦用戶通過點(diǎn)擊屏幕完成 了一次翻頁操作之后,很容易根據(jù)漂亮的翻頁動(dòng)效來發(fā)現(xiàn)左右輕掃的導(dǎo)航功能。 

800.png

縱向拖動(dòng)

  與橫向滑動(dòng)的初衷相似,如果某些界面是從屏幕底部或頂部向上滑入視圖的,那么可以嘗試使用縱向拖動(dòng)的方式來進(jìn)行后退導(dǎo)航。Day One應(yīng)用就打造了這樣一套屬于他們自己的“下拉刷新”,使用戶可以在縱向的操作中直接進(jìn)入之前或之后的一篇內(nèi)容。

900.png

在Clear里,你可以通過向下長拖動(dòng)來回退到上一級(jí)列表,而向下短拖動(dòng)則用來創(chuàng)建新的事項(xiàng)。

01.png

  而Haze允許用戶通過向下拖動(dòng)界面來進(jìn)入設(shè)置界面;當(dāng)然嚴(yán)格的講這不屬于“回退”方面的導(dǎo)航操作。

02.png

長按或雙擊如何?

  長按和雙擊都是可以由拇指獨(dú)立完成的操作,所以我個(gè)人覺得它們將來有可能在回退導(dǎo)航上體現(xiàn)出價(jià)值。

  從視覺和布局的角度解決問題 互聯(lián)網(wǎng)的一些事

  誠然,按照iOS設(shè)計(jì)規(guī)范所要求的那樣將返回按鈕放在導(dǎo)航欄左側(cè),看上去是***自然的。但這不能阻止我們在必要的時(shí)候完全改變返回按鈕的視覺樣式或位置;它甚至可以看上去不那么像個(gè)按鈕。 yixieshi.com

  Basecamp將待辦事項(xiàng)內(nèi)容界面設(shè)計(jì)成半覆蓋的面板形式,用戶點(diǎn)擊左側(cè)未遮蓋的空間即可將面板向右收起,返回到之前的界面。

10.png


  如果內(nèi)容類型適合,我們確實(shí)可以像Basecamp那樣將子界面處理成某種覆蓋層或面板的形式,并使用“完成(Done)”按鈕進(jìn)行關(guān)閉,返回上級(jí)界面。完成按鈕可以被放置在界面右上角,相比于左上角的位置,更容易被點(diǎn)擊到。 


36.png

    總結(jié)

  除非蘋果推出一款更纖細(xì)、邊緣更薄的手機(jī),否則我個(gè)人還是建議設(shè)計(jì)師們能夠抱著更開放的心態(tài)來看待使用手勢執(zhí)行常規(guī)操作這件事。如果你能充分理解交互 對象的運(yùn)動(dòng)方式以及人們對這些運(yùn)動(dòng)規(guī)律的認(rèn)知,并將這些理解體現(xiàn)到設(shè)計(jì)當(dāng)中,那么手勢會(huì)成為非常***和符合直覺的操作方式。作為設(shè)計(jì)師,我們***清楚人們 在實(shí)際當(dāng)中是怎樣使用手機(jī)的,只有這樣,才能設(shè)計(jì)出讓人們愉悅而不是感到受挫的產(chǎn)品。






網(wǎng)站建設(shè) 網(wǎng)站運(yùn)營維護(hù) 百度推廣 抖音推廣 抖音搜索排名 短視頻推廣 短視頻運(yùn)營 短視頻矩陣 短視頻代運(yùn)營 短視頻拍攝剪輯 


CopyRight ? 版權(quán)所有: 陜西印象信息技術(shù)有限公司 網(wǎng)站地圖 XML 備案號(hào):陜ICP備09025595號(hào)-1

陜公網(wǎng)安備 61010302000938號(hào)


掃一掃訪問移動(dòng)端
国产又大又黄又粗又爽,欧美成AⅤ人高清WW,免费A级毛片无码A,亚洲最大AV资源网在线观看 ,久久久久国色AⅤ免费看,中文字幕一区婷婷久久,人人妻人人添人人爽欧美一区,麻豆aⅴ精品无码一区二区,国产欧美另类久久久品,午老司机午夜福利视频
一本大道中文日本香蕉| 狠狠躁夜夜躁人人爽天天天天 | 亚洲午夜精品久久久久久浪潮| 久久久亚洲精品无码| 人人夜色精品国产噜噜噜| 亚洲国产一级毛片| 丝袜高跟美脚国产1区| 用舌头去添高潮视频| 亚洲熟妇无码爱v在线观看| 99精品国产在热久久无码| 国产乱人伦精品免费| 精子网久久国产精品| 亚洲aⅴ永久无码精品毛片| av无码精品一区二区三区三级| 亚洲一区二区三区网站5| 无码国产精品久久一区免费| 亚洲va在线天堂手机在线| 性色AV一区二区三区夜夜嗨 | 亚洲精品福利资源在线导航| 久久亚洲AⅤ精品网站| 91福利网址导航| 性色AV闺蜜一区二区三区| 国产成人麻豆亚洲综合无码精品 | 一区二区三区精品视频日本| 精品亚洲国产成人AV不卡| 亚洲AⅤ无码成人网站国产| 亚洲日韩国产欧美一区二区三区| 亚洲午夜久久久影院| 成年女人免费毛片视频永久| 精品永久久福利一区二区| 成人国产一区二区三区精品不卡| 色欲综合一区二区三区| 精品人妻无码视频一区二区三区| 国产高清不卡一区二区三区| 亚洲AV无码国产一区二区三区| 成人午夜福利免费体验区| 边摸边吃奶边做爽免费视频99| 色偷偷人人澡久久超碰97| 亚洲av无码专区在线电影你懂的| 一区二区三区四区视频在线| 国产成人无码AV一区二区在线观看 |