设计原则及其重要性

已发表: 2022-03-11

收听本文的音频版本

谈论设计原则最困难的部分之一是弄清楚实际上有多少原则(有五个?七个?10个?)。 一旦弄清楚了,应该包括哪些假定的设计基础?

搜索“设计原则”,Google 将返回包含五到十多个独立原则的文章的结果。 即使是同意该数字的文章也不一定同意该数字应包括哪些文章。

实际上,初学者和专业设计师在开展项目时应该牢记大约十几个基本的设计原则。 此外,还有十几个“次要”设计原则有时被包括为基本原则(例如,格式塔原则、排版、颜色和框架)。 下面解释和说明主要的设计原则。

基本设计原则

如前所述,设计界对于设计的主要原则实际上是什么并没有真正的共识。 也就是说,以下十二项原则是有关该主题的文章和书籍中最常提及的原则。

对比

设计师对客户反馈最常见的抱怨之一通常围绕着客户说设计需要“流行”更多。 虽然这听起来像是一个完全武断的术语,但客户通常的意思是设计需要更多的对比。

对比度是指设计中不同元素的差异,尤其是相邻元素。 这些差异使各种元素脱颖而出。 对比度也是创建可访问设计的一个非常重要的方面。 对比度不足会使文本内容特别难以阅读,尤其是对于有视觉障碍的人。

对比度是基本设计原则之一
Parabola 的网站是高对比度设计的一个很好的例子。

平衡

设计的每一个元素——排版、颜色、图像、形状、图案等——都具有视觉重量。 有些元素很重并吸引眼球,而另一些元素则较轻。 这些元素在页面上的布局方式应该创造一种平衡的感觉。

平衡有两种基本类型:对称和不对称。 对称设计在假想中心线的两侧布置等重的元素。 不对称平衡使用不同权重的元素,通常相对于整体设计中未居中的线条进行布局。

设计基础:平衡
稍微偏离中心的布局在 The Nue Co 网站上的粗体图像和极简版式之间取得了平衡。

重点

重点处理设计中旨在脱颖而出的部分。 在大多数情况下,这意味着设计要传达的最重要的信息。

强调基本设计原则在行动
Clique 的超大字体清楚地强调了它的标语。

强调也可以用来减少某些信息的影响。 这在“精美印刷”用于设计中的辅助信息的情况下最为明显。 隐藏在页面底部的微小排版比设计中的几乎任何其他内容都轻得多,因此不被强调。

部分

比例是更容易理解的设计原则之一。 简而言之,它是元素相对于彼此的大小。 比例表示设计中什么是重要的,什么不是。 较大的元素更重要,较小的元素较少。

比例是设计元素和原则的重要组成部分
小字体和大图像之间的比例差异清楚地描绘了 Collin Hughes 网站上最重要的元素。

等级制度

层次结构是另一个设计原则,它直接关系到使用网站的人对内容的处理能力。 它指的是设计中元素的重要性。 最重要的元素(或内容)应该看起来是最重要的。

设计基础:层次结构
Grafill 的网站通过使用布局(最重要的部分在顶部)、大小(更重要的内容更大)和排版(标题大于正文)来创建层次结构。

层次结构最容易通过在设计中使用标题和标题来说明。 页面的标题应该是最重要的,因此应该立即被识别为页面上最重要的元素。 标题和副标题的格式应显示它们相互之间以及与标题和正文相关的重要性。

订阅 Toptal 设计博客并接收我们的电子书

重复

重复是强化想法的好方法。 这也是统一设计的好方法,该设计汇集了许多不同的元素。 重复可以通过多种方式完成:通过重复相同的颜色、字体、形状或设计的其他元素。

例如,这篇文章在标题的格式中使用了重复。 每个设计原则的格式都与本节中的其他设计原则相同,向读者表明它们都同等重要并且它们都是相关的。 一致的标题统一了整个页面的这些元素。

重复是设计的重要原则
Type and Pixel 网站左侧的图像是设计重复的一个很好的例子。

韵律

重复元素之间的空间可以形成节奏感,类似于乐曲中音符之间的空间创造节奏的方式。 设计师可以创建五种基本类型的视觉节奏:随机、规则、交替、流动和渐进。

随机节奏没有可辨别的模式。 规则的节奏在每个元素之间遵循相同的间距,没有变化。 交替节奏遵循重复的设定模式,但实际元素之间存在差异(例如 1-2-3-1-2-3 模式)。 流动的节奏跟随弯曲和曲线,类似于沙丘起伏或波浪流动的方式。 渐进式节奏随着它们的进行而变化,每次变化都会增加之前的迭代。

基本设计原则:节奏
TheArtCenter网站背景中形状之间的不规则间距创造了随机的节奏。

节奏可以用来创造许多感觉。 他们可以创造兴奋(特别是流畅和渐进的节奏)或创造安心和一致性。 这完全取决于它们的实施方式。

图案

模式只不过是多个设计元素协同工作的重复。 墙纸图案是几乎每个人都熟悉的图案中最普遍的例子。

然而,在设计中,模式也可以指为某些元素的设计方式设定的标准。 例如,顶部导航是大多数互联网用户与之交互的设计模式。

设计原则:图案
顶部导航是互联网上最普遍的设计模式之一,在 Isabelle Fox 的网站上进行了说明。

白色空间

白色空间——也称为“负空间”——是不包含任何设计元素的设计区域。 这个空间实际上是空的。

许多新手设计师觉得有必要用某种“设计”来包装每个像素,而忽略了留白的价值。 但是白色空间在设计中有许多重要的用途,最重要的是让设计空间的元素可以呼吸。 负空间还可以帮助突出设计的特定内容或特定部分。

它还可以使设计元素更容易辨别。 这就是为什么使用大写和小写字母时排版更易读的原因,因为小写字母周围的负空间更加多样化,这使人们可以更快地解释它们。

留白是最重要的基本设计原则之一
空白空间为 Jan Behne 网站空间的简单文本和插图内容提供了“呼吸”,同时有助于极简主义美学。

在某些情况下,负空间用于创建观众可能不会立即看到的次要图像。 这可能是品牌推广的重要组成部分,可以取悦客户。 仅以 FedEx 徽标中的隐藏箭头为例。

FedEx 标志使用设计基本的白色空间来创建一个隐藏的箭头。

移动

运动是指眼睛在设计上移动的方式。 最重要的元素应该导致下一个最重要的元素,依此类推。 这是通过定位(眼睛自然首先落在设计的某些区域)、重点和其他已经提到的设计元素来完成的。

运动是设计的基础
倾斜的图像和数字有助于 Abby Stolfo 网站上的运动原理。

种类

设计的多样性用于创造视觉兴趣。 没有多样性,设计很快就会变得单调,导致用户失去兴趣。 可以通过颜色、排版、图像、形状和几乎任何其他设计元素以多种方式创建多样性。

然而,为了多样化而多样化是没有意义的。 多样性应该加强设计的其他元素,并与它们一起使用,以创造更有趣和更美观的结果,从而改善用户体验。

多样性是重要的基本设计原则
Kennard Lilly 的网站背景使用各种颜色和形状来创造兴趣,同时也强调主要的文本内容。

统一

每个人都见过一个网站或其他设计,似乎只是在页面上放置元素,而不考虑它们如何协同工作。 几乎立刻就会想到使用十种不同字体的报纸广告。

统一性是指设计元素协同工作的程度。 视觉元素在设计中应该有明确的相互关系。 Unity 还有助于确保以清晰、连贯的方式传达概念。 与统一性差的设计相比,具有良好统一性的设计似乎更有条理,质量和权威性更高。

设计原则:统一
在整个设计中使用蓝色(包括图像上的蓝色覆盖层),以及一致的排版和比例,在设计中营造出一种统一感。

其他设计原则

有关该主题的各种文章也涉及其他设计原则。 这些包括排版、颜色、格式塔原则、网格和对齐、框架和形状。 有些绝对符合“原则”的定义,而另一些则更像是设计元素。

排版是指文本在设计中的排列方式。 这包括使用的字体、它们的间距、大小和粗细,以及不同文本元素相互关联的方式。 良好的排版设计深受本文前面提到的所有其他设计原则的影响。

在设计中使用颜色是设计中最重要的心理部分之一,对用户体验有巨大的影响。 色彩心理学和理论严重影响了前面提到的其他一些原则。

格式塔原则包括相似性、连续性、闭合性、接近性、图形/背景以及对称和顺序(也称为 pragnanz)。 其中一些原则与上述原则密切相关。

网格和对齐与平衡密切相关,是指元素相对于页面上不可见网格的排列方式。

框架是指设计的主要主题如何与页面上的其他元素相关。 在电影摄影或摄影中最常听到的是图像的主要焦点如何放置在整体图像中。 但该原则延续到设计中。

形状也是任何设计的主要部分,无论是在设计中用作元素的特定形状,还是设计本身的整体形状。 不同的形状可以唤起不同的感觉,即圆形是有机的和流动的,而正方形则更加僵硬和正式,而三角形则给人一种能量或运动的感觉。

这些设计“原则”或元素是良好设计的重要方面,应与其他基本原则一起考虑,以创造最佳用户体验。

结论

什么构成了设计的“基本”原则,当然还有待商榷。 但是理解和实施上述原则对于任何设计项目的成功都是至关重要的。

设计师应该致力于了解这些设计原则中的每一个如何实际影响他们的工作。 研究其他设计师如何实施这些想法来构建自己的设计也是学习创造更好设计的非常有价值的工具。

如果不彻底了解这些元素和设计原则,完全有可能创造出好的设计。 然而,它通常是由“设计师的直觉”完成的,并且可能需要大量的试验和错误才能创造出真正看起来不错的东西并创造最佳的用户体验。 设计师可以通过实践我们讨论过的原则,直到它们成为第二天性,从而节省大量时间和精力。

•••

进一步阅读 Toptal 设计博客:

  • 设计原则:层次结构介绍
  • 使用这些成功的交互设计原则提升您的用户体验
  • 探索完形设计原则
  • 有说服力的设计:有效地使用高级心理学
  • 终极用户体验钩子——用户体验中的预期性、说服性和情感设计