2022-05-15 15:03:48|已瀏覽:2948次

移動端頂部欄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