移动端几种常见的界面设计布局!

手机已成为了我们生活中不可或缺的一部分，每个人的手机可能都安装了几十个甚至上百个APP。使用过那么多的APP，今天我们就来给这些APP分类，看看它们的界面设计属于哪些类型。

移动端常见的页面布局：

1、列表式布局

2、陈列式布局

3、九宫格式布局

4、选项卡式布局

5、轮播图式布局

1、列表式布局

大家熟悉的今日头条、百度百家等新闻资讯类APP，多使用列表式布局。

特点：内容从上向下排列，导航之间的跳转要回到初始点。

优点：

1、层次展示清晰

2、视觉流线从上向下，浏览体验快捷

3、可展示内容较长的菜单或拥有次级文字内容的标题

不足：

1、导航之间的跳转要回到初始点

2、同级内容过多时，用户浏览容易产生疲劳

3、排版灵活性不是很高

4、只能通过排列顺序、颜色来区分各入口重要程度

2、陈列式布局

陈列式布局比较灵活，像小红书使用的就是陈列式布局。特点：布局比较灵活，设计师可以平均分布这些网络，也可根据内容的重要性不规则分布，相对列表式，其优点在于同样的高度下可放置更多的菜单，更具有流动性，曝布流就属于其中一种。

优点：

1、直观展现各项内容

2、方便浏览经常更新的内容

不足：

1、不适合展现顶层入口框架

2、容易形成界面内容过多，显得杂乱

3、设计效果容易呆板

3、九宫格式布局

九宫格这种类型的构图更为规范和常用，用户在使用过程中非常的方便，应用功能会显得格外的明确和突出。很明显的例子就是微信读书。

特点：相比陈列馆式，布局比较稳定为一行三列式布局。

优点：

1、清晰展现各入口

2、容易记住各入口位置，方便快速查找

不足：

1、菜单之间的跳转要回到初始点

2、无法向用户介绍大概的功能，只能点击进去才能获知，初始状态不如列表式明朗

3、不能直接展现入口内容

4、不能显示太多入口次级内容

4，选项卡式布局

这种布局选项卡大部分放在底部，方便用户操作，切换的时候，选中状态高亮显示，有少数放在顶部，例如爱奇艺。

特点：导航一直存在，具有选中态，可快速切换到另一个导航。

优点：

1、减少界面跳转的层级

2、分类位置固定

3、清楚当前所在的入口位置

3、轻松在各入口间频繁跳转且不会迷失方向

4、直接展现最重要入口的内容信息

不足：

功能入口过多时，该模式显得笨重不实用

5，轮播图式布局

这种布局界面展示一张图片，冲击力较强，适合数量少，聚焦度高，视觉冲击力强的图片展示。使用这种布局的APP有猫眼电影。

特点：重点展示一个对象，通过手势滑动按顺序查看更多

优点：

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

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

不足：

1、受屏幕宽度限制，它可显示的数量较少，需要用户进行主动探索

2、由于各页面内容结构相似，容易忽略后面的内容

3、不能跳跃性地查看间隔的页面，只能按顺序查看相邻的页面

结语

以上都是基本布局，了解了这些之后，在日常生活中使用APP的同时，大家可以留意一下这些APP的界面布局，也许会有不同的发现。

参考文章：

移动端几种常见的界面设计布局 作者：文子产品笔记 简书 ，2019年10月31 日

https://www.jianshu.com/p/ba4c9a4c97f6

推荐阅读：安徽热线