1、List列表布局

　　特點，內容從上向下排列，導航之間的跳轉要回到初始點

　　優點，層次展示清晰明了，視線流從上到下瀏覽體驗快捷，縱向長度沒有限制，上下滑動可以看見無限內容，視覺整齊美觀，用戶接受度很高，可展示內容較長的菜單或擁有次級文字內容的標題

　　缺點，同級內容過多時，用戶瀏覽容易產生視覺疲勞，只能通過排列順序、顏色來區分入口重要程度，頁面重點內容不突出

　　場景，常用于并列元素的展示，包括目錄、分類、內容等，簡書很多地方運用這種布局方法能讓用戶清晰明了地知道頁面的內容，簡潔又大方

　　2、陳列館式布局

　　特點，布局比較靈活，即可以平均分布這些網格，也可以根據內容的重要性做不規則分布

　　優點，同樣的高度下可放置更多的菜單流動性強，直觀展現各種內容方便用戶瀏覽經常更新的內容

　　缺點，不適合展示頂層入口框架，界面內容過多時顯得雜亂，讓用戶眼花繚亂

　　場景，支付寶首頁運用的比較多，能直觀展現各種內容，而且首頁的內容都是用戶經常瀏覽的，不過由于界面過多，視覺體驗效果稍微遜色一點

　　3、網格布局，移動app主要講宮格布局

　　特點，相比陳列館式，九宮格布局比較穩定為一行三列式

　　優點，入口展示清晰直觀，方便快速查找，結構上最有利于內容區域隨屏幕分辨率不同而自動伸展寬高

　　缺點，菜單之間的跳轉要回到初始點，容易形成更深的路徑，不能顯示太多入口次級內容，擴展性不如列表布局，標題不易過長

　　場景，適合展示較多入口，切各模塊相對獨立

　　4、儀表布局，也是一種數據展示結構布局

　　優點，展示更加直觀

　　缺點，信息展示量少，過于單一

　　場景，適合表現趨勢走向的展示

　　5、標簽布局(關鍵詞布局、熱度布局)，搜索界面和分類界面時

　　優點，比較動感，增加應用趣味性

　　6、卡片布局

　　優點，清晰直觀，簡單易懂，信息模塊化，增強點擊感，響應式設計，每個卡片信息承載量大、轉化率高，每張卡片的操作互相獨立、互不干擾

　　缺點，每個卡片頁面空間的消耗大，一屏可展示信息少，用戶操作負

　　場景，以圖片為主單一內容瀏覽型的展示

　　7、瀑布流布局

　　優點，瀑布流圖片展示更有吸引力，加載模式能獲得更多內容容易沉浸其中，錯落有致的設計利用視覺層級同時實現任意流動緩解視覺疲勞

　　缺點，頁面跳轉后需要從頭開始，用戶返回查找信息困難很大

　　場景，適用于實時內容頻繁更新的情況

　　8、手風琴布局

　　優點，兩級結構可承載更多信息同時保持界面簡介，減少界面跳轉，提高操作效率高

　　缺點，同時打開多個手風琴菜單，分類標題不易尋找，且容易將頁面布局打亂

　　場景，適用于兩級結構的內容，并且二級結構可以隱藏

　　9、行為擴展式布局

　　特點，能一屏幕內顯示更多細節，無需頁面跳轉，騰訊QQ聯系人使用

　　優點，減少頁面跳轉層級，對分類有整體性的了解，清楚當前所在的入口位置

　　缺點，分類位置不固定，當展示內容較多時時跨分類跳轉不方便

　　10、多面板布局

　　特點，能同時呈現比較多的分類及內容

　　優點，分類位置固定，清楚當前所在入口位置，分類一目了然，對分類有整體性的了解，減少界面跳轉的層級

　　缺點，兩欄設計使頁面比較擁擠，分類很多時左側滑動區域過窄，且不利于單手操作，容易產生視覺疲勞

　　場景，適合分類多并且內容需要同時展示

　　11、大圖展示布局，視覺效果好，多見于引導頁和一些圖片分享、藝術范、攝影類APP

　　12、gallery布局，單頁面內容整體性強(比如天氣)，聚焦度高，閱讀起來比較順暢感

　　13、選項卡式布局

　　特點，導航一直存在，具有選中狀態，可快速切換另一個導航

　　優點，直接展示最重要接口內容信息，分類位置固定清晰當前所在入口位置，減少界面跳轉層級輕松在各入口頻繁跳轉

　　缺點，功能入口過多時該模式顯得笨重不實用

　　14、旋轉木馬式布局

　　特點，重點展示一個對象，通過手勢滑動查看更多內容

　　優點，單頁面內容整體性強，聚焦度高

　　缺點，受屏幕寬度限制可顯示的數量較少，不能跳躍性地查看間隔的內容，各頁面內容結構相似容易忽略后面的內容

　　15、圖標信息布局

　　優點，完整的圖表要素，突出的標題區，從上到下的閱讀順序，讓APP更加生動形象，商務氣質

　　缺點，標題不夠突出，信息量不足，移動APP空間利用不足

　　更多關于“UI培訓”的問題，歡迎咨詢千鋒教育在線名師。千鋒教育多年辦學，課程大綱緊跟企業需求，更科學更嚴謹，每年培養泛IT人才近2萬人。不論你是零基礎還是想提升，都可以找到適合的班型，千鋒教育隨時歡迎你來試聽。