關(guān)于“返回”按鈕的一些小結(jié)

前段時間在pmcaff上看到并回答了一個問題,關(guān)于返回鍵設(shè)計的一個問題,只是說了個大概,后來又重新參考實(shí)際的產(chǎn)品重新整理出來

iOS人機(jī)界面指南中關(guān)于返回鍵的相關(guān)內(nèi)容如下:當(dāng)前標(biāo)題左側(cè)應(yīng)有返回按鈕,需要的話,返回按鈕可以以前一層級的標(biāo)題命名。導(dǎo)航欄的一般作用就是告訴用戶在哪兒以及可以回到哪里去,將“返回”置于導(dǎo)航欄上,不會占用頁面中多余的空間,與導(dǎo)航欄構(gòu)成頁面導(dǎo)航的基礎(chǔ),讓用戶暢行于應(yīng)用之中,也是市面上產(chǎn)品最習(xí)以為常的設(shè)計方式,長期以來用戶養(yǎng)成的習(xí)慣也是如此(點(diǎn)擊導(dǎo)航欄左側(cè)返回按鈕返回上一層級界面),但是隨著手機(jī)屏幕的日益增大,非常不利于單手操作。于是,iOS7在傳統(tǒng)的左上角返回鍵之外,提供了右滑返回上一級界面的手勢操作,這一小的舉動對于大屏手機(jī)上的產(chǎn)品使用體驗來說還是非常貼心。

注:LOFTER & 微信

以下幾款產(chǎn)品采用底部返回按鈕的交互方式:好奇心日報、知乎日報、MONO、pmcaff,這幾款應(yīng)用的內(nèi)容詳情頁面都是用底部返回的設(shè)計,而共同特點(diǎn)是:

都是內(nèi)容詳情頁面?

頁面中沒有導(dǎo)航欄

返回鍵位于底部(工具欄上面)

注:好奇心日報 & 知乎日報

將返回鍵置于底部有什么優(yōu)點(diǎn)?參考實(shí)際頁面來看,返回鍵置于底部工具欄上,更利于大屏手機(jī)的單手操作,并且將返回鍵與針對頁面內(nèi)容常用的操作按鈕放置在同一欄上,更利于頻繁操作之間的快速切換

注:MONO & PMCaff

大部分場景下不適用這種交互方式?

首先,將返回鍵置于導(dǎo)航欄上,符合設(shè)計規(guī)范以及用戶長久以來的認(rèn)知,導(dǎo)航欄+返回構(gòu)成頁面導(dǎo)航的基礎(chǔ),告訴用戶在哪里、可以回到哪里去,導(dǎo)航欄的作用就非常明顯,就像馬路上路標(biāo)一樣不會讓你迷失在城市之中。根據(jù)上面總結(jié),返回鍵置于底部式,頁面通常會省略掉導(dǎo)航欄,應(yīng)用中大量頁面省略導(dǎo)航欄,勢必會造成導(dǎo)航系統(tǒng)失效。

其次,此種形式將返回鍵置于底部工具欄上,而工具欄是用來放置針對此頁面內(nèi)容的操作按鈕, 在此基礎(chǔ)上再增加一個返回按鈕比較合理,如果是其他的列表頁或者導(dǎo)航頁,并沒有針對此頁面的操作按鈕,或者導(dǎo)航欄足夠承載僅有的操作按鈕,只是將返回鍵置于頁面底部,增加一個工具欄或者再添加一兩個其他操作按鈕,頁面的整體布局會顯得不合理。

需要說明的是本篇討論針對主要針對iOS中相關(guān)交互方式,由于Android中有虛擬的物理返回鍵,不受限制于上操作欄中的“向上”鍵,更多的虛擬的物理返回鍵進(jìn)行返回操作。還需注意的的是,虛擬的物理返回鍵基于用戶最近查看的歷史頁面,采用時間倒序的方式,連接界面間的關(guān)系。而“向上鍵”是基于層級關(guān)系,連接界面間的關(guān)系。

12/20更新:最新版搜狐新聞客戶端產(chǎn)品設(shè)計采用

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容