新媒体视觉系列（3）：对比
在之前的文章《新媒体运营必需知道的 4 个设计原则》中，琛姐谈到过 4 个设计的基本原则——亲密性、对齐、重复、对比。
本文是对「对比」原则的修正和补充。
对比的目的主要有 2 个，一个是打破统一的版面设计，增强视觉效果。比如，差不多的两个拳头放在一起时，画面很平淡，因为只存在方向的对比：
但如果是一个老人的拳头和一个小孩的拳头出现在同一画面，视觉效果就会强烈很多，因为同时存在方向、大小、糙嫩3种类型的对比：
对比的另一个目的是组织信息逻辑。完全统一的版面无法有效阅读，只有通过对比，读者才能对信息逻辑一目了然，对比越强烈，信息逻辑就越清晰。
比如，一篇文章一般由标题、小标题、正文组成，如果标题和正文间的对比不够强烈，就很难一眼看出文章的逻辑，比如下面左图中，只有文字大小的对比，小标题就不够显眼，辨识较困难，如果加强对比，增加粗细和颜色的对比，改成右图的样式，对比就非常鲜明了，信息逻辑也就一目了然。
对比的方式主要有：方向对比、形状对比、色彩对比、字体对比和图文对比。
1.方向的对比
排版布局时，可以采用不同的方向进行对比，比如下图中纵向文字和横向文字就形成了鲜明的对比：
这种方向的对比不只存在于文字和文字之间，也可以运用于图像和文字间，比如下图的海报中，图像主体中的地平线是水平的，横向的，文字部分是垂直的，纵向的，方向的对比也非常鲜明。
公众号 HomeFacialPro 的排版中也采用了这种方向的对比，标题部分采用纵向布局，正文部分横向排列，整体视觉效果非常灵动。
公众号Voicer中的部分插图也使用了横向和纵向文字的对比，并增加了动态效果，进一步强化了对比。
2.形状的对比
1）大VS小
同时放置2张或2张以上的图片时，常规的方式是将2张图设置成同样的尺寸和比例：
但这样很容易显得单调、乏味，更好的办法是加入尺寸的对比，比如，将上图中的其中一个对象缩小，在尺寸上和另外一个对象形成对比，改成下图这样，整体效果会更生动、活泼：
2）几何VS有机
大部分形状可以分为几何形状和有机形状 2 大类。
几何形状主要包括正方形、矩形、三角形、圆形等规则形状（如下图左），有机形状主要是指受自然启发的不规则形状（如下图右）。
规则的几何形状可以和不规则的有机形状形成很好的对比。比如，下面的这张海报就是由规则的外矩形框和不规则的内边框组成，对比效果非常好。
3.色彩的对比
色彩的对比方案非常丰富，最为典型的有暖色和冷色的对比、亮色和暗色的对比、互补色对比等等，琛姐在之前的文章《新媒体运营必须知道的色彩搭配常识》中详细讲解过色彩相关概念，不清楚的童鞋可以点进去看看，这里不再赘述。
一般来说，色轮的右上方是暖色，左下方为冷色。暖色给人的印象：生动、激情、有表现力，给人感觉在空间的位置靠前。适用于前景色。冷色给人的印象：谨慎、冷静、平静感，给人感觉在空间的位置靠后。适用于背景色。
所以，当我们把这两种颜色放在一起时，对比非常强烈，而且一般把冷色作为背景，暖色作为前景。比如，下面这张海报，就是采用冷暖色的对比，冷色（蓝色）作背景，暖色（红色）作前景。
明暗的对比非常常见，比如，下面的这张图片，就是用暗色作背景，高亮的HOTEL标志作前景，对比非常鲜明，主题很突出。
互补色是色轮上相对的2种颜色，互补色对比是色彩对比中最鲜明的组合之一，比如红色和绿色。
这种对比非常鲜明，画面冲突感很强，故有“红配绿，唱大戏”之说。因为这种搭配的不稳定性，在正式的设计中比较少见。如果想特别引人注目，可以尝试采用。比如，电影《三枪拍案惊奇》就大量采用了互补色的对比，整体视觉效果非常夸张。
4.字体的对比
字体可以分为衬线体和非衬线体 2 大类，衬线体的笔画开始、结束的地方有额外的装饰，而且笔画的粗细会有所不同（如下图左）。无衬线字体，没有这些额外的装饰，而且笔画的粗细差不多（如下图右）。
根据经验，最好选择一种衬线字体和一种非衬线字体来设置对比，因为通常来说，互补的两种元素会产生很好的对比效果。下图logo中非衬线体和衬线体，以及书写体的对比完美平衡了整个设计。
5.图文的对比
在前面的平衡中我们已经说过，图片和文字的视觉重量是不一致的，一般情况下，遵循图重文轻的原则，所以，将图片和文字放在一起时，可以有效突出图片，将图片作为有效的视觉线索。比如，下图中的箭头符号，在一大片文字中显得非常突出，成为了有效的视觉线索。
小结
对比的目的主要有 2 个，一个是打破统一的版面设计，增强视觉效果。另一个目的是组织信息逻辑。对比的方式主要有：方向对比、形状对比、色彩对比、字体对比和图文对比。
