网格分析

3、网格表现：
首先，在版式四周要留出 页边，采用线条。其次，把该 空间等分，以使各列文字相互 间不接触，每个单元格之间也 要有一条空白的分隔带，网格 内采用细线。 网格以垂直单元与水平单 元的数目定义。一个两栏四行 的网格被称为8单元网格，或 2×4网格。
4、网格基础：表现为八种形式
（1）水平
（3）竖版
文字用竖的来排，打破阅读方向，丰富了版面，为阅读增加趣味性。
（ ） 成
体 易 趣 味 。 也 给 版 面 增 加 了 一 定 容 来 字 排 文 编 的 格 斜 网 ， 倾 的 角 感 ， 代 读 出 现 用 45 度 阅 现 使
4
的
角
（5）倾斜
版面主体形象或多幅图像作倾斜编排，造成版面强烈的动感和不稳定因素，引人注目。
网格分析
目录：
一、网格
1、网格概念 2、什么是网格 3、网格表现 4、网格基础 5、网格类型
二、视觉流程类型
1、线型视觉流程 2、导向视觉流程 3、多向视觉流程 4、复向视觉流程
三、图片分析
1、网格概念
信息内容有着它自己的内在结构和固定的 组 成部分，需要一定的鉴赏力去揭开各部分的 相互连续性，网格为设计提供了一个基本的框 架，帮助形成清楚、连贯的信息关系和易懂的 页面，给设计一种内在凝聚力。
1、首先定下一条水平线，距离约为页面高度的四分之一
3、根据这些纵列格线，放上元素
2、每个内页定好七列格线，并将标题放在上面
4、从左到右，将所有格线区域填满
（2）垂直
A ：垂直柱状线条下面是整幅的图片，而在左边则用一则引言来吸引读者的眼光，标题及文字仍然在右边。 B ：右边的图片则好与柱状线条接触，而正文则处于另一边。留意标题放在了页面的下方，但仍然给人是标题的感觉。 C ：这里可以说是一个标准的杂志版面（插图 - 标题 - 正文），这时垂直线条去到了最右边，而同时，它与上方的栏目 文字相交接。
①文字导向：体现简约的 ②手势导向：容易理解， ③指示导向：醒目、强劲 风格，有一种干练的美。 具有一种亲和力。 的视觉冲击力
④形象导向：生动活泼、自 然亲切。
用手指写标志形状，恰 文字在版面中充单和风、 细雨、花的芳香。极具趣味 到好处地突出了主题，构成 生动有趣的版面 性和诱导性。
运用箭头所示方向，将 视线导向主题，形成醒目、 强劲的视觉冲击力
该设计是一张杂志 版面设计。文字与 图 片的编排采用了对称栏 状网格的编排形式，使 整个版面文字编排更有 秩序，版面更严谨。对 称栏状网格形式使该版 面在视觉上达到了平衡。 但是从视觉角度来看， 版面虽然达到了平衡， 文字变化不大，缺乏活 力，编排较密集，使整 个版面显得有些单调， 让人阅读时容易造成视 觉疲劳。
（6）、网格绘制
（7）三分法
在一个页面中把它分成上下和左右各三等分，形 成一个3X3的网格，网格线的交叉点为“热点区域” 三分法的演示
（8）奇数法
5、网格类型：表现为六种形式
（1）对称式网格：分为三种
对称式网格的目的主要组织信息，平衡左右版面的作用。
1 单栏对称网格
2 双栏对称网格
版面平衡，使阅读更流畅。文字编排比较密集，显的画面有点单调。
(3)非对称式网格
非对称网格是指左右 版面采用同一种编排方 式，但是在编排的过程中 并不像对称网格那样绝对。 非对称网格形式在编排的 过程中，根据版面需要调 整版面的网格栏的大小比 例。使整个版面更灵活， 更具有生气。
非对称网格主要分为非对称栏状网格与非对称单元网格两种。
非对称栏状网格
非对称单元格网格
版面中由于有一条竖线贯穿 诱使人们的视线左右移动， 上下，牵引着人们的视线上下来 产生平稳、条理性的感觉。 回地浏览，具有直观的感觉。
具有不安定斜置处理因素， 版面的曲线视觉导向，寓 往往更能吸引人的视线 意深刻，构成丰富、饱满的回 旋形而具有变化，形式与内容 达到了完美的结合
2、导向视觉流程
导向视觉流程，是通过诱导性视觉元素，主动引导读者视线向一定方向作顺序运动，按照由 主及次的顺 序，把页面 各构成要素依次串联起来，形成一个有机整体。导向视觉流程的应用也很多见，可以 使网页重点突出、条理清晰，发挥 最大的信息传达功能。视觉导向元素有多种，有虚有实，表现多样。导向视觉流程表现为四种形式：
Biblioteka Baidu
(4)基线网格
基线网格通常是不可见的，但它却是平面设计师的基础。基线网格提供了一种视觉参 考，它可以帮助版面元素的准确编排与对齐页面，是凭感觉无法达到的版面效果。
(5)成角网格
成角网格在版面中往往很难设置，网格可以设置成任何角度。成角网格发挥作用的原理跟其他网格一 样，但是由于成角网格是倾斜的，设计师在版面编排时，能够以打破常规的方式展现自己的风格创意。
本设计为杂志内页版面设 计。该版面采用双栏网格与单 元 格网格形式的结合，将版 面划分出明确的结构，文字与 图片按照网格的结构编排在版 面中，体现了版面的稳定与整 洁。该版面层次清晰，文字采 用左右均齐的编排形式，体现 了版面的整洁与朴实感。图片 运用单元格的形式编排，展现 了整个版面的活跃性。
该设计是是一张网页版面设计。该网页采用对称式单元格网格的编排形式，该网页设计中每个单元格的 距离为零，图片集中编排在版面中心，使整个版面结构更紧凑，更具有规律性。版面的四周空出很大面积的 空间，强调了版面的视觉中心，同时也加强了版面的空间节奏感，整个版面给人规律、整洁的视觉效果。
将眼神倾注于蝴蝶，自然地牵连 着视者的眼睛与主题对焦。又使版面 充满了趣味与情感。
通过望远镜远眺，把视线引向 主题，这种夸张的趣味性版面，让 读者耳目一新。
③散点视觉流程
④重心视觉流程
版面通过标题的快速、紧张的阅读后，再回到各图与 文字的跳跃性阅读，传达一种轻松、愉悦的版面气氛。
舞者向下的姿势正好与标题重合，把版面重心 引向下方，异常出位。
4、复向视觉流程
①连续视觉流程 ②渐变视觉流程 ③近似视觉流程
图形的四方连续构成，产生 一种回旋的气势，在那不染凡俗 的艺术格调中含不尽意味，视觉 识别率高，在众多版面中脱颖而 出。
从花盆渐变到炸弹，版面构成 极具震撼力，并产生强烈的视觉动 势。
版面营造一种情理之中、预料之外的抒情写实性氛围。
④重复视觉流程
以眼神为诱导元素，把观众 的视线引向主题，有效提高了美 感和注意值。
3、多向视觉流程
多向视觉流程指线向、导向相反的视觉流程。强调版面视觉的情感性、自由性和个性化的随意编排。刻意追求 一种新奇、刺激的视觉新语言。表现为四种形式：
①反向视觉流程
②趣味视觉流程：
这福版面构成都违背了视觉流程的规律。但 从整体布局来看，更有一种与众不同、标新立异 的独特魅力。
该设计为杂志宣传广告，整个版面以图片为主要表现因素。在版式设计中图片的比例大小对整个画面 的视觉效果有着很大的影 响。图片比文字更能吸引 人们注意。采用了满版型 的版式设计，从画面上强 调宣传目的。文字根据画 面的需求进行有机的调整 排列，使整个画面显得和 谐层次清晰，达到了宣传 的目的。
2、什么是网格
网格是一种包含一系列等值空间（网格单元）或对称尺度的空间体系。它在形式和空间之间建立起一种视 觉和结构上的联系。形式和空间的位置及其相互关系通过二维网格来限定。网格的构图能力来自于所有元素之 间的规则形和连续性，它能够决定一个页面上元素的零散或整齐程度、页面上插图和文字的比例，通过网格建 立连续的秩序或参考区域，从而产生普遍联系。 网格由垂直线与水平线相交构成网格单元，网格单元之间的空白区域称为分隔线。
(6)打破网格
打破网格的约束使版面设计更具有自由性，但是很难把握版面的平衡，就算是很优秀的设计师也很难准确的把握画面的 平衡感。
网格与无网格对比版面
网格与无网格对比版面
无网格版面
5、网格应用
（1）网格的建立
一套好的网格结构可以帮助设计师明确设计风格，排除设计中随意编排的可能，使版面统一规整。设计师可以利用两者 的不同风格来编排出灵活性较大，协调统一的版面构成设计。
对称网格
栏状网格与单元格
（2）多语言网格编排
（3）说明式网格编排
二、视觉流程类型
1、线型视觉流程
使页面的流动线更为简明，直接地诉求主题内容，有简洁而强烈的视觉效果。直线视觉流程表现为四种形式：
①竖向视觉流程：给人坚 定、直观的感觉。
②横向视觉流程：有稳定、 ③斜向视觉流程：以不 ④曲线视觉流程：有含蓄、 恬静之感。 稳定的动势引起注意。 柔美、在内蕴中见激越。
3 多栏对称网格
避免视觉疲劳感。三栏网格的运用使版面 具有活跃性，打破了单栏的严肃感。
有关表格形式的文字，比如说联系方式、术 语表、数据目录等信息。这种版式的单栏太窄式 不适合编排正文的。
（2）对称式单元网格
对称式单元网格在 版面编排中，将版面分 成同等大小的网格，再 根据版式的需要编排文 字与图片。这样的版式 具有很大的灵活性，可 以随意编排文字和图片。 在编排过程中，单元格 之间的间隔距离可以自 由放大或者缩小，但是 每个单元格四周的空间 距离必须相等。
版面的重复视觉流程，具有情节虚假、细节真实的底蕴
三、图片分析
该版面图片编排在版面的上部具有强烈的视觉效果，文字编排在图片的下部具有信息 说明的作用。该版面的视觉重心设置在上部，给人以轻松、愉快之感。
版面采用网格结构中 的两栏对称编排的网格结 构，使整个版面左右具有 强烈的稳定性。运用图片 的对比编排使版面具有活 跃感。文字的大小对比关 系打破了对称网格的沉闷， 具有版面的活跃感。