當我們接到一個APP設計的case的時候，首先是進行app信息組織模式分析：

在確定了需求和主流程后，開始著手設計app界面，前提我們要面臨的第一個問題

就是如何將信息以最優(yōu)的方式組合起來，針對這個問題所作出的設計決策對整個app的核心體驗起到關鍵作用。

之前25學堂跟大家分享的移動APP布局設計經(jīng)驗之道：獨門七字訣

如下圖的APP列表頁面的分布布局方式：

今天，25學堂跟大家再來回顧下常見的APP信息布局方式。

第一種APP信息布局方式：宮格布局

這種APP信息布局方式也是我們目前最常見的一種方式，也是符合用戶習慣和黃金比例的設計方式，最知名的就是錘子手機的界面設計。錘子手機界面設計欣賞

知名的APP設計采用的九宮格、六宮格等方式布局有：攜程APP、途牛APP、支付寶APP等等。

下面我們來欣賞下經(jīng)典的宮格布局APP界面設計

九宮格是一種比較古老的設計，它最基本的表現(xiàn)其實就像是一個三行三列的表格。

采用宮格布局的優(yōu)勢：

非常方便的適配所有的移動手機機型。因為這樣的結構是最有利于內(nèi)容區(qū)域隨屏幕分辯率不同而自動伸展寬高，同時也是ios和android開發(fā)人員比較容易編寫的一種布局方式。

信息內(nèi)容展示的方式，簡單明了。

手機APP設計教程之四條APP產(chǎn)品設計黃金法則當中也提到了宮格布局的交互設計好處。

第二種APP信息布局方式：列表布局

列表布局就是以列表的形式展示具體內(nèi)容，并且能夠根據(jù)數(shù)據(jù)的長度自適應顯示。

列表布局就是List View ? 是可以滾動的列表布局方式，最常見的應該屬于android的列表布局，這也是最快速的app布局方式。因為無論ios開發(fā)和android 都有現(xiàn)成的列表布局插件和模板。

以上的APP界面基本都是以列表布局為主導。最能代表的就是分類信息的展示形式。還有產(chǎn)品列表、對話列表等等。

第三種APP信息布局方式：大圖展示布局

這類布局多見于引導頁設計和一些圖片分享app、或者文藝范、攝影類的APP主導的布局方式。

代表APP，mono貓弄、one APP等等。

第四種APP信息布局方式：圖表信息布局

app里面采用圖表布局，讓APP更具商務氣質(zhì)。幾乎所有的APP 商業(yè)圖表都符合這一構圖原則，可以說是商業(yè)圖表背后的布局指南。

優(yōu)點有：完整的圖表要素；突出的標題區(qū)；從上到下的閱讀順序。

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

但是目前APP圖表的布局方式，已經(jīng)在某些領域是常見的布局方式。如下圖：

等等。這樣圖表布局讓APP更加生動形象。

第五種APP信息布局方式：標簽布局

標簽布局來源移動android開發(fā)當中的一個術語：標簽布局（Tab Layout）25學堂今天跟大家講的標簽比這個tab layout范圍要大點。除了tab布局。還有標簽關鍵詞布局，熱度布局等等。

以標簽的方式顯示它的子視圖元素，就像在Firefox中的一個窗口中顯示多個網(wǎng)頁一樣。為了狂創(chuàng)建一個標簽UI（tabbed UI），需要使用到TabHost和TabWidget。TabHost必須是布局的根節(jié)點，它包含為了顯示標簽的TabWidget和顯示標簽內(nèi)容的FrameLayout。

最常見的標簽布局就是tab標簽布局。還有搜索的時候，熱門關鍵詞的布局。

今天25學堂就跟大家先整理在這里，如果各位還有好的APP信息布局方式，我們一起來分享和討論。

本文屬于25學堂的原創(chuàng)文章，請勿轉(zhuǎn)載！