俗話說的好，好的設(shè)計來自于對生活的細心觀察。同樣移動互聯(lián)網(wǎng)產(chǎn)品設(shè)計同樣要符合現(xiàn)實中生活習(xí)慣和認(rèn)知習(xí)慣。畢竟移動互聯(lián)網(wǎng)是現(xiàn)實生活的衍生。

無論是我們在電視電影中所看到的武俠動作片，總有一些大師擁有著絕世武功或是秘訣。我想在移動APP布局設(shè)計中，也有一些設(shè)計大師掌握著APP布局設(shè)計之道-獨門七字口訣。

那是哪七個字呢？

移動APP布局設(shè)計第一訣：聚

聚即聚攏、收納，最樸實的節(jié)省空間的方式之一，歸類之一。手機界面尺寸比較小，又要考慮符合手指點擊的面積，所以往往不會像web頁面中把詳細分類及信息全都鋪出來，導(dǎo)航條也不會像web界面設(shè)計中的細長的一條，只能精簡內(nèi)容顯示最常用的幾個版塊。

移動APP布局設(shè)計第二訣： 藏

聚和藏有點類似，前者偏向歸類，后者偏向隱而不見。

移動APP設(shè)計中常用的隱藏元素有以下三類：

（1）有形的控件：如按鈕、標(biāo)簽、菜單、導(dǎo)航…

（2）手勢與重力感應(yīng)：長按刪除、橫滑翻頁、搖一搖都是這一類；

（3）操作路徑：把不常用的功能或設(shè)置項藏得深一點，通過層層遞進達到目的。

移動APP布局設(shè)計第三訣：合

我們講完聚，藏之后，是不是考慮到有些時候也有組合一些或者是合并一些相同的元件或功能。比如移動APP設(shè)計中的合并也常常見于各種組件的組合，如輸入框與標(biāo)簽、導(dǎo)航與下拉菜單、網(wǎng)址欄的輸入框與取消/刷新按鈕等。

移動APP布局設(shè)計第四訣：分

常言道：有合必有分。這話說的真不錯！那么在移動APP設(shè)計中是如何體現(xiàn)分的呢？

分在簡單收納的基礎(chǔ)上，如果將空間繼續(xù)細化，分割成不同的“小塊”，會使得擺放更有秩序。比如利用網(wǎng)頁設(shè)計中的設(shè)計技巧：九宮格、柵格、區(qū)域劃分…如果小屏幕里靈活運用這些格子組合會讓界面顯得更加完整！

移動APP布局設(shè)計第五訣：換

當(dāng)我們聚、藏、合、分都不適用的時候，你會想到什么呢？那就是換。

換即替換之意，即合理利用共享空間交替展現(xiàn)。

手機屏幕空間非常有限，一塊小小的角落都可以成為兵家必爭之地，通過共享空間的利用，可以完成多個界面的跳轉(zhuǎn)及不同狀態(tài)之間的切換。Tab、slide page、還有各種翻轉(zhuǎn)切換都是通過空間共享的方式承載不同的信息。

移動APP布局設(shè)計第六訣：擠

移動設(shè)計的擠壓案例也特別多。ios4新增的inbox展示方式就是一種自上而下的擠壓處理，除此之外，facebook和path的從左往右的擠壓布局最近也特別流行?，F(xiàn)在最流行的就是抽屜式設(shè)計?；蛘叨鄳B(tài)按鈕設(shè)計。

網(wǎng)頁題目：UI不得不知的app設(shè)計布局之道
轉(zhuǎn)載源于：http://jinyejixie.com/news/215566.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營銷seo公司；服務(wù)項目有App設(shè)計等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)