公司網站設計布局分割的應用

來源:本站日期:2019-3-4

在學習UI設計時,經常會接觸到頁面的布局,而往往頁面布局的方式會直接影響到一個app或網頁的視覺,通常好的布局,能夠給用戶帶來非常舒服的視覺效果,更容易得到用戶的接受和好評。下面是廣州做網站力洋網絡分享公司網站設計布局分割的應用的知識:A、

在學習UI設計時,經常會接觸到頁面的布局,而往往頁面布局的方式會直接影響到一個app或網頁的視覺,通常好的布局,能夠給用戶帶來非常舒服的視覺效果,更容易得到用戶的接受和好評。下面是廣州做網站力洋網絡分享公司網站設計布局分割的應用的知識:

A、背景欄分割
背景欄分割有點像是一個容器上放了不同維度的內容,而在內容區分的同時,還能保持界面的統一性。

背景欄分割有點像一個容器上放了不同維度的內容,能夠在內容區分的同時,還能保持界面的統一性。
優點:設計時好的布局,可以提高屏幕的利用率,同時能讓界面看起來更加的有秩序,大大的降低了用戶對大量信息的理解時間。
缺點:對圖標視覺的要求相對較高,因此在做這種頁面時,一定要把控好圖標的色彩搭配和細節的一致性,不然畫面會顯得很粗糙。

總結:這種布局分割適合內容多且不好梳理的頁面,利用背景分割,將每個部分分成獨立的模塊,將用戶的注意力留在想看的模板,同時提高用戶的理解能力。


B、分割線分割
UI設計中最常見的一種分割分割方式就是分割線,它能有效的幫助用戶理解頁面層次,有分隔、有組織的作用,一般時為了將內容分割開,形成獨立的內容和信息。

優點:這種設計方案比較保守,當不知道用那種方式來做分割時,可以選擇這種,一般都不會錯。
缺點:需要處理好線的粗細,間距和顏色,線條不宜過粗,顏色不能太重,若處理不好會讓頁面有一種擠壓及粗重的感覺。

總結:這種分割線通常使用在UGC模塊上,首先需要考慮到屏幕的利用率,其次對每個用戶產生的內容要進行分割,但存在感不能太強,避免干擾用戶對內容本身的注意力,所以通常會使用在UGC模塊上。


C、留白分割
所謂的留白其實是指頁面元素間或包圍頁面元素的空白空間,雖然這種手法可能會被認為浪費空間,但不得不說,目前大部分app的首頁都是采用留白分割。

優點:使用留白能讓整個頁面在視覺上展現的更加舒適,去除很多的邊邊框框的束縛,顯得更加規整,且不雜亂。

缺點:要求界面元素統一,重復,同時圖片的大致調性要一致,不然會顯得界面和凌亂,而且留白的增多也意味這會減少屏幕的利用率,因此在使用留白做分割還是要符合產品調性和整體頁面的展示效果。


總結:這種分割較為適合產品調性較簡潔,同時頁面圖片較多的界面,因為與其說時留白做分割,不如說時圖片做分割。
D、卡片投影分割
卡片投影一直以小巧整齊的內容容器形式而存在,每一個卡片都承載不同的信息,時用戶了解更多細節信息的入口。

優點:能快速吸引用戶的注意力,而且容易出現視覺效果,設計師的時候大部分設計師都比較喜歡用卡片投影。
缺點:屏幕的利用率比較低,更主要的時開發實現有些難度,上線版一般和設計稿差距很大。
總結:卡片投影更適合信息量多,但視覺較為精簡的頁面,因此目前很多的電商,金融類首頁用的都是卡片投影式的設計。
其實,總的來說,任何表現形式都是為了更好的呈現功能和內容,但作為一名合格的設計師,你不能盲目的去追隨趨勢,一定要了解為什么采用這種形式。
0
首頁
報價
案例
聯系
足球指数百家欧赔