四种常见的构图方式

一、九宫格网格构图:

常用于功能分类为主的一级页面,起到功能分类的作用。

常见的九宫格式设计:屏幕锁,app导航页。


四种常见的构图方式_第1张图片
四种常见的构图方式_第2张图片

二、圆心点放射形构图

生活中,圆形的东西给人以灵动,活泼的感觉;圆有圆心,在界面中,圆心能够起到聚焦和凸显的作用。我们将主要的功能设置在板式的中心位置,其他功能点可以圆形的范式排布在中间,用户的视线就会着重聚焦在中心功能处。

常见圆心点放射构图:APP功能向导


四种常见的构图方式_第3张图片


四种常见的构图方式_第4张图片
四种常见的构图方式_第5张图片
四种常见的构图方式_第6张图片

三、三角形构图:

主要运用在文字与 图标的板式中,能让界面保持平衡稳定。从上至下式的三角形构图,能把信息层级罗列的更为规整和明确。

常见的三角形构图,如下的个人信息页:


四种常见的构图方式_第7张图片
四种常见的构图方式_第8张图片

四、SF型构图:

由于人视线的轨迹多是从上至下从左到右移动,因此S行视线构图能更好的引导用户阅读。

四种常见的构图方式_第9张图片

F形构图:

F形构图能让图文搭配更有张力,更大气,产品信息更为简单和明确。

在F形构图的规律中,主图为F的主干,右侧两行文字为辅。

F形构图常用于banner中,能将标题更为突出,主题更加吸引视线。


四种常见的构图方式_第10张图片


四种常见的构图方式_第11张图片


构图时,可充分利用主图的画面指向性,如下图中,主图少女朝向左侧,可将朝向的位置放置文本信息,方便用户最快速的关注到文本信息。


四种常见的构图方式_第12张图片


四种常见的构图方式_第13张图片

你可能感兴趣的:(四种常见的构图方式)