UI不得不知的app設計布局之道

2022-11-21    分類: App設計

俗話說的好,好的設計來自于對生活的細心觀察。同樣移動互聯網產品設計同樣要符合現實中生活習慣和認知習慣。畢竟移動互聯網是現實生活的衍生。

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

那是哪七個字呢?

移動APP布局設計第一訣:聚

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

圖片1.png

移動APP布局設計第二訣: 藏

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

移動APP設計中常用的隱藏元素有以下三類:

(1)有形的控件:如按鈕、標簽、菜單、導航…

(2)手勢與重力感應:長按刪除、橫滑翻頁、搖一搖都是這一類;

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

圖片2.png

移動APP布局設計第三訣:合

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

圖片2.png

移動APP布局設計第四訣:分

常言道:有合必有分。這話說的真不錯!那么在移動APP設計中是如何體現分的呢?

分在簡單收納的基礎上,如果將空間繼續細化,分割成不同的“小塊”,會使得擺放更有秩序。比如利用網頁設計中的設計技巧:九宮格、柵格、區域劃分…如果小屏幕里靈活運用這些格子組合會讓界面顯得更加完整!

圖片4.png

移動APP布局設計第五訣:換

當我們聚、藏、合、分都不適用的時候,你會想到什么呢?那就是換。

換即替換之意,即合理利用共享空間交替展現。

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

圖片5.png

移動APP布局設計第六訣:擠

移動設計的擠壓案例也特別多。ios4新增的inbox展示方式就是一種自上而下的擠壓處理,除此之外,facebook和path的從左往右的擠壓布局最近也特別流行。現在最流行的就是抽屜式設計。或者多態按鈕設計。

網頁題目:UI不得不知的app設計布局之道
轉載源于:http://www.kartarina.com/news/215566.html

網站建設、網絡推廣公司-創新互聯,是專注品牌與效果的網站制作,網絡營銷seo公司;服務項目有App設計

廣告

聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯

成都網頁設計公司
主站蜘蛛池模板: 免费无码婬片aaa直播表情| 无码国模国产在线观看| 亚洲AV无码成人专区| 国产精品无码专区| 无码国产精品一区二区免费vr| 亚洲成a人片在线观看天堂无码| 毛片免费全部播放无码| 国产精品爽爽V在线观看无码| 韩国19禁无遮挡啪啪无码网站| 无码精品人妻一区二区三区中| 曰韩人妻无码一区二区三区综合部| 在线播放无码后入内射少妇| 久久亚洲AV成人无码软件| 免费A级毛片无码免费视| 成人无码AV一区二区| 影音先锋中文无码一区| 国产麻豆天美果冻无码视频| 日韩乱码人妻无码系列中文字幕| 亚洲AV色吊丝无码| 国产在线观看无码免费视频| 97免费人妻无码视频| 日韩免费无码视频一区二区三区 | 一本大道无码日韩精品影视| 久久久久亚洲av无码专区| 国产午夜无码精品免费看| 国内精品人妻无码久久久影院| 久久精品无码一区二区app| 亚洲欧洲无码一区二区三区| 亚洲看片无码在线视频| 无码粉嫩小泬无套在线观看 | 久久无码AV一区二区三区| 亚洲av无码国产精品色午夜字幕 | 亚洲AV无码一区二区三区性色| 无码人妻丰满熟妇精品区| 无码视频在线观看| 无码不卡av东京热毛片| 无码人妻啪啪一区二区| 成人免费无遮挡无码黄漫视频| av无码a在线观看| 国产亚洲精品a在线无码| 国产AV无码专区亚洲AVJULIA|