画面太平?帮你学会经典的对比原则!

Date 2026-03-16 17:01:41

重复、比较、对齐和亲密是布局设计中的四个原则。各种排版形式和规则都是基于这四个原则衍生出来的,掌握这些指导设计原则可以帮助我们在短时间内更快更好地实现设计目标。本期将向您解释四个原则 —— 对比原则。

比较原则是什么?

「对比」强调事物之间的差异,避免页面上的视觉元素过于相似。如果元素是不同的,则有必要增加对比度,以确保明显的对比度和清晰的页面。在生活中,我们可以到处找到比较的存在,比较形式也是多样化的:

画面太平?帮你学会经典的对比原则!

人们习惯了生活中的对比。如果图片没有对比,就会让人觉得单调乏味。对比可以突出重点,使布局有层次感,内容点显示更有组织。对比度越清晰,视觉效果越强。通过对比,画面将生动、主次分明。

对比的作用

1. 突出重点

适当的比较可以很好地创建焦点(图片主体)。在布局安排中,有效利用视觉差异,通过组成元素之间的比较,吸引读者对图片主体部分的关注,提高布局的关注效果,是布局设计的首要任务。

画面太平?帮你学会经典的对比原则!

通过鲜明的对比,可以形成强烈的对比效果,让读者在第一时间捕捉到主体和重点。本案主要采用色彩对比,主要人物和文字在布局上非常显眼,因为它们与周围的视觉元素有很强的差异。

2. 丰富画面层次

对比是建立有组织层次结构的最有效方法。强烈的对比可以形成视觉差距,建立良好的信息水平,增强布局的节奏和乐趣。

画面太平?帮你学会经典的对比原则!

3. 打破僵化,活泼生动

通过对比,可以避免布局单调乏味,使布局更加有趣,使布局更加生动生动,产生良好的视觉体验,激发读者阅读和观看的兴趣。

画面太平?帮你学会经典的对比原则!

与方向、大小和颜色形成对比,使标题和文本的水平更加清晰,同时添加纹理对比,为主体创造三维感,使布局更加生动和引人注目。

对比文字编排

从理论上讲,所有可变元素的特征都可以形成对比,本期只举例了一些常用的文字编排对比形式。

画面太平?帮你学会经典的对比原则!

1. 大小对比

制造视觉冲突的效果是通过视觉元素体积的差异来实现的。视觉元素的体积形成了层次划分。体积越大,层次越高,越突出。

画面太平?帮你学会经典的对比原则!

标题、小标题、内文、关键信息和非关键信息通常分为布局所需的信息。放大重要信息,缩小次要信息,形成尺寸对比。其优点是减少次要信息对重要信息的干扰,使其更容易接收,尺寸对比也可以丰富布局的层次。

2. 粗细对比

厚字体重,细字体轻,字体厚度变化形成重量对比。主要信息可以使用较厚的字体,次要信息可以使用较细的字体,使用这种技术创建视觉流线,引导观众阅读信息。

画面太平?帮你学会经典的对比原则!

在上述情况下,只使用思源黑体字体,但通过比较不同字体的大小和厚度,也可以很好地区分信息的主要和次要层次。

3. 字型对比

如果布局中有更多的信息,只使用一个字体,它可能会显得单调,与字体类型进行比较,不仅可以区分不同的信息,而且可以丰富布局。

画面太平?帮你学会经典的对比原则!

不同的字体有不同的气质,字体类型的对比是不同气质的碰撞。在比较字体类型时,还应深入考虑:字体类型的选择是否与主要内容相匹配,字体风格能形成多少对比。

4. 色彩对比

色彩对比能有效突出重点,区分信息,还能起到装饰画面的作用。

画面太平?帮你学会经典的对比原则!

大面积的背景色与少量的主色形成了强烈的对比效果,可以在第一时间将读者视觉引导到文字信息和主角。

画面太平?帮你学会经典的对比原则!

高亮度、高饱和度的黄色主体文本与低亮度、高冷度的黑色背景形成强烈对比,使布局充满活力,有效突出文本信息。

5. 方向对比

将布局中的文本信息分别朝不同的方向排列,可以有效地增加布局的动态性和空间感。

画面太平?帮你学会经典的对比原则!

6. 疏密对比

密集排版大段文字可以使文字形成块,视觉上更紧凑。剩下的大面积可以用来展示图片的主题。通过这种密集的变化,不仅可以形成良好的阅读节奏,还可以加强主题。

画面太平?帮你学会经典的对比原则!

7. 肌理对比

纹理是指物体表面的组织纹理结构,不同的材料具有不同的触摸和视觉体现。文本或背景添加纹理,使用粗糙细腻、简单华丽、厚重轻盈的对比,可以增加图片的丰富性和表达。

画面太平?帮你学会经典的对比原则!

主体「叶」书法文字具有手写动态,具有纹理。水墨画的纹理进一步强调了效果。它能很好地区分文本信息的主次关系,增加画面的视觉美感和艺术表现力。

8. 动静对比

在布局设计中,有扩散感或流动性的图形或文字的排列通常被称为「动」;将水平或垂直性强、稳定性强的图形或文字排列为「静」。「动」使整个布局充满活力,获得更高的关注度,「静」使布局具有稳定的效果,将两者结合起来,可以产生一定的空间层次感。

“画面太平?帮你学习经典的对比原则!”

电影海报《影子》的反白书法作为背景,动感强烈,与主角的静态形成鲜明对比。阴阳与刚柔并济,反映了中国古典美学的浓厚。

画面太平?帮你学会经典的对比原则!

9. 空间对比

布局设计不局限于平面上的层次,也可以使元素有一定的前后关系。文本和图像之间的叠加或分散的布局,使布局有层次关系,使布局更加生动活泼。

画面太平?帮你学会经典的对比原则!

虚拟与真实的对比也可以创造一个空间层次,利用虚拟背景突出前景,不仅可以突出关键信息,还可以创造一种氛围感、场景感和立体感。

画面太平?帮你学会经典的对比原则!

利用远近对比来反映空间关系,根据透视原理,近则大,远则小,能营造出近景、中景、远景的画面层次感。

画面太平?帮你学会经典的对比原则!

案例演示一

为了让大家加深对「对比原则」理解,提取本期文章的主要内容作为原始数据,应用「对比原则」设计示范。

画面太平?帮你学会经典的对比原则!

运用「亲密性原则」调整信息的分组和距离;排版时遵循「对齐原则」;运用「对比原则」主次划分信息层次,添加文本大小和厚度对比;使用「重复原则」将相同级别的文字设置为相同的文字风格,增加组织性,加强统一性。

画面太平?帮你学会经典的对比原则!

为了丰富对比度,可以添加字型和色彩对比度,加强层次关系,突出关键内容。

画面太平?帮你学会经典的对比原则!

现在图片文本信息已经清晰有序地排列,但缺乏主题。标题内容「对比原则」设计为主要元素。

1. 打开AI软件,画一个正方形;

2. 执行「效果-3D-突出和斜角」。勾选「预览」,「位置」使用「等角-左方」,「凸出厚度」可自行调整,使正方形变成正方体。

画面太平?帮你学会经典的对比原则!

画面太平?帮你学会经典的对比原则!

6. 四个字分别执行「效果-3D-突出和斜角」,把「位置」改为「等角-上方」,厚度改为 0:

画面太平?帮你学会经典的对比原则!

7. 将文字填充色改为白色,画边改为绿色背景色,按参考线放置文字位置「原则」逆时针旋转两个字 90 度放置;

画面太平?帮你学会经典的对比原则!

8. 选择四个字,右键选择「编组」,复制两组新单词,一组备用,一组放在下面。

画面太平?帮你学会经典的对比原则!

9. 选择上面的文字组,右键「排列-放置在顶层」;

选择工具栏「混合工具」,单击两个文字组,然后双击「混合工具」调出「混合选项」,间距选择「指定的步数」、「30」;

画面太平?帮你学会经典的对比原则!

10. 用绿色填充之前复制的备用文字组,右键选择「排列-放置在顶层」,再次移动到原文字组位置;

画面太平?帮你学会经典的对比原则!

11. 英语按同样的方法设计,放在下面,主体刻画;

12. 按「Ctrl+Alt+2」按钮解锁所有对象,删除参考线。

画面太平?帮你学会经典的对比原则!

将以前描绘的文本信息排列在图片下方,严格按照对齐原则排列。主图形与文本信息形成方向对比和纹理对比,视觉效果更丰富。

画面太平?帮你学会经典的对比原则!

通过观察图片的整体效果,我们发现宋体字符与布局中的风格不一致,因此删除了字体比较,并将所有字符统一修改为思源粗体;试着取消颜色比较,布局的视觉效果更简单、更纯粹。设计完成:

“画面太平?帮你学习经典的对比原则!”

案例演示二

重新尝试使用其他对比技术来设计新方案。把「对比原则」四字放大,错落地放置在布局中,形成位置对比。

画面太平?帮你学会经典的对比原则!

将之前描绘的文本信息放入图片中,整体文本排版采用两端对齐的形式,但局部采用左右对齐的形式,形成排版方向的对比。

画面太平?帮你学会经典的对比原则!

添加丰富的英文图片,将排版方向改为纵向排列,从而增加方向对比;在背景中添加点状纹理,形成纹理对比。

画面太平?帮你学会经典的对比原则!

为了丰富对比效果,把「对比原则」四字执行「模糊-模糊-径向模糊」,形成动静对比和空间对比,设计完成:

画面太平?帮你学会经典的对比原则!

总结

对比可以突出重点,使布局具有层次感,内容点显示更有组织,对比,图片生动、主次;理论上,所有可改变的元素都可以形成对比,本期只举一些常用的文本安排对比形式;通常不仅使用一种对比,而且使用多种对比方法。比较关系越清晰,视觉效果就越强。但是,我们应该根据布局内容选择合适的比较技术,强调比较,注意图片的和谐统一。

下载链接:练习素材与源文件及PDF课件:https://pan.baidu.com/s/1g2fipl3twatcasw6g28eq提取码

备用下载链接:https://share.weiyun.com/5997MyR

欢迎关注作者微信微信官方账号:「艺术海拾贝Desing」

画面太平?帮你学会经典的对比原则!