关于栅格设计的总结笔记
时间：2023-09-05 23:36:01 | 来源：网站运营
时间：2023-09-05 23:36:01 来源：网站运营
关于栅格设计的总结笔记：
什么是栅格系统 栅格系统介绍网格起源印刷设计，现在随着传播媒介变化网格系统也延伸到网页设计（响应式网站）甚至于移动端的设计中了。网格设计是将版面分成不同形式的列或模块组成的垂直或交叉的格子。这些格子可以帮助我们更好的排列所要传达的内容，管理内容在版面中元素之间的比例。
栅格设计不是简单的将文字、图片、图标图形等版面中可见元素排列起来，而是遵循画面结构相互联系延伸来的一种形式法则。
它的特点是：
重视比例、秩序还有连续感。在使用栅格设计时，有效可视区域内的元素尽量对齐格子，并按照格子的划分参照某种比例有序的分布和组织。01栅格的作用 保持内容的清晰和一致
通过合理的比例、节奏、留白和层级提升版面的阅读效率，网格系统下有助于在版面中清晰的划分出来；
提升效率方便协作
多个设计可以分别按照这套栅格系统来处理不同的组件和设计细节。
易于修改和重复使用
栅格帮助设计师将不同的设计元素按照某种比例与联系组在一起，来构建更好的产品以此来实现有效的层次结构统一和一致，使设计更有条理。
02 栅格的要素 边距安全距离或版心区域，由于展示媒介的不同，安全距离不一样。
列列是网格纵向排布的依据，列数越多纵向排布内容就越细致，版面的内容就会变得更稠密内容较零碎，一般移动端为6列，网页设置为12列。
水槽列与列之间的分隔间距，它有助于分离内容
水槽的宽度可以根据实际情况来设置，当水槽的宽度比安全距离宽时，眼睛向外指向并且存在更多的张力，当水槽的宽度比安全距离窄时，眼睛向内引导并且张力得到缓解。通常如果水槽为X的话，则安全距离通常为 1X 、1.5x、2X、2.5X，也可以根据项目情况进行设置
模块模块是行和列的交叉形成的独立空间单元格
最小单位在制定栅格之前还需要了解一个最小单位，这些栅格都是有这个最小单位组成的。目前比较常用的最小单位有4、5、6也有用8的Materia Design就是基于8作为最小单位。
由于近期比较忙还有下半部分就安排在下一篇
03 制定栅格
04 案例应用.....
在线咨询
