设计构图-构成骨骼-网格系统联动讲解
摄影、绘画、设计等等学科内知识,都关心着一个问题,就是构图,如垂直水平构图、对角线构图、三角构图、三分法构图、黄金分割构图等众多的构图法,纵观各种构图法其最终想要达成的目的就是如何在页面空间内首先框定出一个大的结构,从而有目的和选择的安排内容,布置画面,这个大的结构我们就可以理解成一个大范围的骨架。
正如上图参考,我们对设计作品以整体视角观察,就会发现它是以怎样的结构布置画面。这也能启发我们如何开始设计,在针对内容有清晰梳理后,就可根据风格的设定,对画面整体的大结构进行骨架的划分,比如稳重严谨的画面倾向于纵横向的平稳构图,对角线的构图会带来更多的灵活动感。
除构图外如果我们在进行版式编排工作中,想采取一种有一定预见性和结构性的方式进行构思和设计,那另一个绕不开的话题就是关于网格系统的运用,利用网格,将复杂的文本体例,规划到固定的版面空间当中,形成同时具备功能性和数学逻辑美感的设计作品。
对网格系统的认识可以总结成三个关键词:骨骼、秩序美、逻辑美。也可以理解为具有复杂结构和多样功能的参考线。
但不知道你有没有发现或意识到无论是构图还是网格,其中都提到了关于骨骼的建立,而骨骼的概念又同时存在于平面构成的知识体系中,三者之间最核心的部分重合度很大,意味着其三者之间有着很强的关联性。如果试着将三者结合起来学习,那么即完成了一次知识整合,将分散的知识内容归整理给大脑腾出更多内存,也解决了构成知识与实际应用割裂的问题。
一、关键词-骨骼
骨骼是画面的基本框架,如何设定骨架决定所创造的版面形态会朝着那种方向进行,这也是预见性的体现,我们在页面空间中搭建骨骼,最主要想要达到的目的无非两种一是对页面空间进行切割划分建立不同的结构,二是定位元素,给需要出现的视觉元素确定编排位置。(分割空间+定位元素)
二、关键词-秩序美、逻辑美
我们期待利用骨骼的建立能给画面带来一定的秩序美和逻辑美感,那么就涉及该如何搭建骨骼的问题,平面构成里关于骨骼类型的划分就能够一定程度的解决这个问题。
1、规律性骨骼
按数学规律或含一定比例关系,类制定的骨骼,最简单的是重复性网格,它带来的秩序感是显而易见的,其次如按黄金比例,白银比例制定的网格都属于规律性网格,当元素按这类有一定规律的网格进行编排时,就会产生一定的数学美感。
△我们首先看下规律性网格中重复骨架的运用,其规律性和秩序感是显而易见的,但由于元素切割错落的布置却不会给我们呆板的感觉。
△黄金比有这天然就具有创造和谐的力量,自然界的一些植物生物包括人体的生长都趋向黄金比,对黄金比的欣赏是人类共有的审美经验,当页面空间被这样划分后自然与和谐也随之体现,所谓的顺眼也就是这么回事。
△当然除了黄金比的运用,我们也可以在页面中采用其他比例进行划分,如图文字部分以等差递减的方式分割后进行排版,有种递进的韵律在其中。
2、非规律性骨骼
非规律骨骼的特点是具备一定的自由性,按照这个标准归纳后可大致分为三类:
第一是在规律性骨骼的基础上进行局部的规律打破,表现出一定的冲破规律束缚的自由感;
第二是由规律性网格进行演变而来,只保留规律性骨骼的形式感,由呈现出的弱规律性获得的自由感。
第三是完全去除规律性,只考虑形式美感的完全自由骨骼。
规律性骨骼更倾向于强秩序感,非规律性骨骼更倾向于逻辑性,都是在建立骨骼时可以考虑的方向,也许你会对完全自由的骨骼比较迷惑,其实当思考绘制自由骨骼的同时将形式美感考虑进去,那么骨骼自然会因人的偏好而产生隐含的逻辑性。
三、骨骼作用于视觉元素
我们设定好骨骼框架后第一个要考虑的问题即是视觉元素该如何依照骨骼进行编排,这里取决于我们如何利用骨骼,这里要加入设计师的主观思考,是要严谨的按照骨骼编排,还是只使用骨骼的其中一部分作用完成画面。
1、骨骼对空间进行分割,不同的分割形式决定画面的结构布局形式,同时骨骼影响视觉元素的编排形式;
2、视觉元素的变化(位置、方向、正负等)都是在骨骼线所框定的范围内进行,超出的部分被切割掉
3、视觉元素的变化(位置、方向、正负等)在骨骼线所框定的范围内进行,视觉元素可以超越网格线。
4、骨骼只起到元素的定位作用。
5、在设计作品中可以不去隐藏网格,让网格线成为设计作品中的视觉元素,也可隐藏网格只利用骨骼的辅助功能部分,可根据用途风格去灵活使用。
四、复合网格
一个页面 空间中可以出现不止一种网格,两种以上的网格同时用在一个页面中的情况称为复合网格,不同网格发挥着不同的作用,同时还能增强页面的丰富度。
五、总的来说
总的来说,构图、构成骨骼、网格系统,更像是对页面划分的不同层级,从骨架的整体划分到精细划分的过程,给我们一定的启发,在设计执行过程中,完全可以以构图的视角首先将页面空间以大结构上的布局划分,接着再考虑更精细的骨架搭建以完成设计目标。
感谢观看,期待三连