Date 2026-03-16 16:51:44
本文由英语流利设计团队成员制作。自学设计，结合多年的工作经验，分享一期平面设计。
关于平面设计 4 大原则，在 RobinWilliams 所有的《给大家看的设计书》都写得很详细，很多小伙伴都看过。
Contrast / 比较Repetition / 重复Alignment / Proximity / 亲近现代主义设计的先驱 Jan Tschichold 说过「对比是平面设计中最重要的元素」。对比不仅有我们最熟悉的大小对比，还有颜色对比(对比)、对比空间(清晰&模糊）、对比时间(传统)&未来）；表现形式的对比(混乱)&整洁)等等。
重复不是单调的复制。重复可以用少数元素快速传达图片想要传达的信息。重复也可以形成一种风格。它是品牌设计中的象征，也是奢侈品中常用的视觉手法。
△ 去年 Burburry 升级新 logo 重复排列形成图案
排列方法在视觉引导中起着很大的作用，使画面中的元素找到平衡，更理论化的是排列形成一个系统，比如「网格」。
△ 企鹅图书封面 - 用网格设计排列的经典案例
「亲近」它是英语的直译。简言之，它是处理元素与元素之间的关系。我们按照一定的逻辑关系排列图片中的元素。相关元素相互靠近，无关元素相互远离。
下面「道士下山」你明白设计原则的使用了吗？
虽然这 4 点是平面设计中最基本的原则，但最简单的事情往往是最简单的「复杂」无论是平面设计还是平面设计。无论是平面设计还是平面设计 UI 设计离不开这些基本原则框架，这是打好基础的第一步。
许多小伙伴经常使用它 4 原则上，但在设计一些结构复杂的内容时，往往无从下手。
这个时候借点「工具」构建框架是一种简单、有效、快速的方法。这里说的「工具」它是比例和网格，在设计布局中起着非常重要的作用，但非平面专业毕业的设计师可能很少有机会深入了解。
平面设计中常用的比例：
黄金分割 / 黄金比例三等分 / 格斐波那在九宫的契约数列出√2 / √2矩形黄金分割 / 大家都知道黄金的比例，就是 0.618 ，这个比例在 logo 常用于设计。最简单的用法:b=a*0.618，这里的 a、b 指任何尺寸的单位，如线段长度、圆度等。
三等分/九宫格在摄影构图中使用较多，简单易懂就不多介绍了。
斐波那契额数列听起来很厉害，其实是黄金比例的数学近似版。数列规则的最后一个数字是前一个数字 2 数字加和。也就是说。 1、1、2、3、8、13、34、55、84、144 …...
知道这个数列后，具体怎么用？最简单的就是以数列画参考线网格为排版依据。
最后一个 √2矩形听起来很奇怪，但它实际上是我们通常最常见的A系列纸张尺寸（A2、A3、A4等）。
它的构成方法是先画一个正方形，然后连接到对角线，然后以一个终点为圆点旋转对角线。当转向与正方形重合时，形成「√2矩形」长边，正方形边是「√2矩形」的短边。
「小知识」：再延长一次，继续连接「√2矩形」对角线、旋转、重叠形成长边的矩形 √3矩形。以此类推 √4矩形，√5矩形，√6矩形 ……
在了解了一些比例规则之后，让我们来看看 Josef Müller-Brockmann 设计的海报。我想知道你是否发现了一些比例规则？
也许有些小伙伴对上面的海报并不了解，但是觉得有点花里胡哨没有效果。实际上并非如此， Josef Müller-Brockmann 它是网格系统的作者。书中介绍的强大的网格工具使平面设计师在复杂的书籍、杂志和报纸排版中感到轻松愉快。书中的方法是网页APP 设计也有许多参考价值。
在基本的平面设计中，你可以把点当成文字或者单独的小元素，线是文案，面是文字等等。
需要注意的是，点、线、面之间没有绝对的界限。它们可以通过程度的变化自由变化。如下图所示 B 相对于 A 来看，B 是面；B 相对 C 来看，B 是点。E 它可以看作是更密集的 D；F 可以看作是更高的 E。
点成线，线成面，点是几何最基本的组成部分。许多点聚集在一起可以形成节奏和图案，点的密度、重复、规模和数量变化可以影响图像效果。
线具有很强的视觉引导性，是连接任何两点的路径。表现形式可以是直线、斜线、曲线、实线、虚线等。
表面有一定的长度和宽度。不同形式的表面可以在视觉上表现出不同的情感。直线表面稳定有序；曲线表面柔软、轻松、活泼；不规则表面更自然、更生动。
无印良品海报是点、线、面使用最简化的经典案例：
细节决定成败，平面设计中有许多小细节值得注意。
注意按钮内部的空白，空白可以使界面看起来更简单和快速。
在软件中打开避开头尾和间距的组合，可以避免句头出现标点符号，增加中西文混排时的半角间隙。（sketch 和 figma 等 UI 不支持设计工具)。
因为中文是方块字，所以字符的高度一般高于普通的非衬线西文字符。因此，在中西文混合排列中，可以手动调整西文的大小，使中西文保持在和谐的高度。方法通常是增加西文的大小，然后使用基线参数将西文的位置向下偏移。
△ 手机横过来看比较清楚
注意视觉平衡/对齐。不同形状的元素有不同的视觉大小，如边长 400px 正方形和直径 450px 圆在视觉大小上其实是相当的。
背景的深度会影响对齐的方式。
在设计长表格列表时，背景色(条纹)的分割优于线条分割。
欢迎关注「设计团队流利」公众号：
