移动app设计当中常见8种基础布局方案

在实际的app设计中，要考虑信息优先级和各种布局方式的契合度，采用最合适的布局设计方案，来提高移动产品的易用性和交互体验。

今天25学堂的小编给大家分享的8种常见移动端的基础布局方案，算是给大家温故而知新吧！

 

常见的APP布局干货：

1、 APP细节考量的四个方面：导航、字体、布局和配色

2、四种常见的APP分类界面布局设计案例学习

3、APP设计进阶教程：善用图标风格设计宫格布局

 

 

1、 list 列表布局

 

优点

list列表纵向长度没有限制，上下滑动可以查看无限内容；

list列表在视觉上整齐美观，用户接受度很高；

list列表可以展示内容长和次级文字的标题。

缺点

页面跳转后总是从头开始；

一页展示内容过多，用户疲劳度增加；

页面重点内容不突出。

场景

常用于并列元素的展示，包括目录、分类、内容等。

 

 

2、网格布局，在移动app上主要是讲宫格布局

 

优点

各入口展示清晰，方便快速查找。

缺点

扩展性不如list列表；

标题不易过长。

场景

适合展示较多入口，且各模块相对独立。

 

 

3、仪表布局,也是一种数据展示结构布局

 

优点

展示更加直观。

缺点

信息展示量少，过于单一。

场景

适合表现趋势走向的展示。

 

4、卡片布局

 

优点

每个卡片信息承载量大，转化率高；

每张卡片的操作互相独立，互不干扰。

缺点

每个卡片页面空间的消耗大，一屏可展示信息少，用户操作负荷高。

 

场景

适合以图片为主单一内容浏览型的展示。

 

 

5、 gallery布局

 

优点

单页面内容整体性强，聚焦度高；

线性的浏览方式有顺畅感、方向感。

缺点

可显示的数量有限，需要用户探索；

不具有指向性查看页面，必须按顺序查看页面。

场景

适合数量少，聚焦度高，视觉冲击力强的图片展示。

 

 

6. 瀑布流布局

 

优点

瀑布流图片展现具有吸引力；

瀑布流里的加载模式能获得更多的内容，容易沉浸其中；

瀑布流错落有致的设计巧妙利用视觉层级，同时视线任意流动缓解视觉疲劳。

缺点

页面跳转后需要从头开始，加载量不固定，理论上是无限延展；

用户返回查找信息困难很大。

场景

适用于实时内容频繁更新的情况。

 

 

7. 手风琴布局

 

优点

两级结构可承载较多信息，同时保持界面简洁；

减少界面跳转，提高操作效率高。

缺点

同时打开多个手风琴菜单，分类标题不易寻找，且容易将页面布局打乱。

场景

适用于两级结构的内容，并且二级结构可以隐藏。

 

8. 多面板布局

 

优点

减少界面跳转；

分类一目了然。

缺点

两栏设计使界面比较拥挤；

分类很多时，左侧滑动区域过窄，且不利于单手操作。

场景

适合分类多并且内容需要同时展示。