移動端頂部欄ui設(shè)計分析

      移動端頂部欄ui設(shè)計分析，頂部欄的另一個趨勢是透明背景，透明背景與第一個刪除標題的背景目的相同，是為了節(jié)省界面空間。今天小編主要給大家分享移動端頂部欄ui設(shè)計分析，希望對你們有幫助!

      頂部欄樣式

      這是我們最常見的頂部欄樣式：上面是狀態(tài)欄status bar，中間是界面標題，左右兩側(cè)可能有icon，表示返回、消息提示、設(shè)置等操作。

      但當我查看手機上的應(yīng)用程序時，并不是所有的應(yīng)用程序都采用了這種樣式。我選擇了幾個“異類”并逐一分析。

      去標題化

      一些產(chǎn)品的一級界面會從頂部欄中刪除標題，要知道它為什么被刪除，首先必須知道它為什么存在。很簡單，標題的功能就是告訴用戶當前界面的名稱。

      但是，此功能與底部欄菜單重疊，因為用戶還可以從底部欄的選擇狀態(tài)知道他們在哪個界面上，正如我剛才所強調(diào)的，這是一個一級的界面，如果想去到二級，一旦沒有底部欄菜單，仍然需要取回標題。

      以上是一級界面刪標題的條件，接下來我們來談?wù)剟h除標題的動機。一個產(chǎn)品通常有五個一級界面，我們必須在有限的空間內(nèi)顯示足夠的功能和內(nèi)容，而刪除標題是一個好方法。

      一級界面也有優(yōu)先級，“首頁”的點擊率最高，可以看到很多產(chǎn)品的首頁標題都被刪除了，但是一級界面的其它標題保留了下來。

      可點擊

      在我們的日常印象中，除了頂部欄的icon外，其余的都是不可點擊的。但我最近遇到一些特例，其中登錄/注冊界面是主要的，而這里的頂部欄可以看作是登錄/注冊按鈕。

      一級界面的頂部欄樣式為下拉框樣式，用戶可以單擊篩選。

      另一個常見的例子是當iPhone點擊狀態(tài)欄時，它會快速回到界面頂部。

      我認為未來會有越來越多的這種轉(zhuǎn)變，因為隨著產(chǎn)品的迭代，會有越來越多的功能，空間也會越來越小，在此前提下，裝飾元素向功能元素轉(zhuǎn)化是必然的趨勢。

      極簡設(shè)計的一個關(guān)鍵概念是去除與用戶任務(wù)無關(guān)的非功能性元素，或者將裝飾性元素轉(zhuǎn)換為功能性元素。

      背景色

      頂部欄的另一個趨勢是透明背景，透明背景與第一個刪除標題的背景目的相同，是為了節(jié)省界面空間。

      既然提到了背景，那就談?wù)勴敳繖诘谋尘邦伾�。有四種常見的頂欄背景色:企業(yè)色、白色、深灰色、透明。

      企業(yè)色背景的一大好處是頂部欄標上了品牌，這樣用戶一看到產(chǎn)品就知道它是什么。tipu頂部的bar直接添加了企業(yè)色背景和logo，我不能判斷這個設(shè)計是好是壞，但我一看到頂部欄就知道是tipu，從品牌處理的角度來看，是非常成功的。

      注：尊重原創(chuàng)文章,轉(zhuǎn)載請注明出處和鏈接 http://www.hebeijilong.cn/news-id-33742.html 違者必究！部分文章來源于網(wǎng)絡(luò)由培訓(xùn)無憂網(wǎng)編輯部人員整理發(fā)布,內(nèi)容真實性請自行核實或聯(lián)系我們，了解更多相關(guān)資訊請關(guān)注UI設(shè)計頻道查看更多，了解相關(guān)專業(yè)課程信息您可在線咨詢也可免費申請試課。關(guān)注官方微信了解更多：150 3333 6050