超有趣！高级设计师必知的6个视觉设计基础技巧

同样一个三角形，位置不同，差别极大。本文总结了6个有趣的视觉设计基础技巧，高级设计师都在学，一起来看看！

重力

重力适用于物体和形状，同样也应用在视觉传达中。这里说的重力并不像生活中理解的那样将平面物体向下~ ` e f 9 B = {拉。

但是，引力的概念深深地扎根于我们对现实的感知中，以至于它甚至可以转换为页面$ / r 5 / i上的二维物体。

⇧ 顶部的物体好像随时会坠落一样，应该会感到有d ] ( F X $ s ,点不舒服

⇧ 这张图视觉重力与上图相反

这种构图形式，看上去不像是要掉落的物体，而更像一个物体停留在g y 7页面底部。

通过这个例子能说明什么呢？当你j H G ; Y i 在规n 0 Z 8 P w X划页面时，顶部的视觉压力可能会造成不安，可以有意识地尝试其他版式 （除非你就是要传达这种感觉）。

阅读方向

通常情况下，我们的阅读顺序是从左到右，从上到下。这种习惯应用到界面上，很自然的理解成左侧的对象为进入，而右侧的对象为离开。

△左边的物体像) C E { | o (是刚进入了画面。在下方，圆圈感觉像是在退出

△ 右侧边的物体像是要离开画面

你也可以使用它来{ l _ $ K k / J :传达某些情绪。例如，想让一个物体看起来像在t x (偷窥吗？

△ 看，我在左下角偷窥你

或者要传达要逃跑的物体。当画面元素丰Q j ` x g A [ & J富时，还可以建立更直观的场景。

△有内鬼，开遛O ; N @ D $ | @ ,～

阅读优先

因为c q { I ? w我们从左到右从上到下阅读，所以我们自然会先看到左上角的对象，然后我们的眼睛自然会移到右下角，然后再看那里的东西。这一点很重要，因为如果你尝试创建视觉层次结构（比如你希望用户先看到标题，然后再看到内容），即使它们的形状、颜/ w { x 4 E [ . D色、大小相同. w E Z i +，也可以使它们放置在此处有所不i X z 5 3 E @ B .同。

这里扩展一下，有一个著名的法则，x G 8 & ~ y % 6 P古腾堡图。

古腾堡图，又叫对角线平衡法则。由 14 世纪西方活字印刷术的发明人约翰古腾堡提出。它揭示了一个B ; 9 J `实用的视觉轨迹规律：阅读引力是从上到下，从左到右。

从图中可以看出，用户视线很自然的会从第一视觉区开始，逐渐移动到终端休息区。整个阅读过程视线都会沿着一条方向轴E } Z 4 ~ M J n开始从左到右浏览。用户会更容易关注到页面的开始与结束区域，除非有特别的视觉强调，否则中间V H % 1 w 的段落则很少被关注到。

遵循古腾堡原则把关键信息放在左上角、中间和右下角，能够更好的体现元素的重! w D +要性。例如：我们平时所看到的页面弹窗、各种证明文件和合同文件等等。K d w

* 这个规律只适用于习惯文字以从左到右水平形式书写的读者，若是以古代中国d . i : ? X人的阅读习惯可能就不适用了。

视觉张力（Visual Tension）

不知道视觉张力什么意思？举个例子，尝试把手机放在桌面边缘处（例子而已，别真放）y & * p L，悬空的部分越多越好@ R N G + = ` G，是不是感D m : + ^ _ 9觉手机要跌落出去了，但还没真的跌落。你总能感受到物体的 . Q动势，往相同（或不5 i / M同）方向运动。通常情况下，视觉张力只是Z $ { D无意识的。设计师没有意识到他们不小心将形状彼此相邻，不知不觉中产生了张力。这可能是无意造成的。

⇧ 定睛一看，这是啥？艺术？？？

⇧ 上图突出. 4 } b p S f显示的所有张力点

其实你可以利用视觉张力，使用视觉张力吸引用户的视线并强化重点。也许你正在设计夸张形式的海报，或者你想将某人的注意力集中在某物上。

⇧b ; 5 k ^ x Q v | 相同的构图，其中的张力集中在特定的位置，并且有意将其放在特定的位置

动态与静态

静态的构图经常会让人感到无聊、呆板。改变它的捷径只需简单地倾斜地平D r _ F # v {线。

⇧ 一张感觉平静的静态图像

⇧ 倾斜地平线后，城市景观看起来有趣了不少

为了使构图更具动感和刺激性，你可以结合画面边缘并让形状出血的形式来实现。

⇧ 3 点透视构图

负空间

你可以使用带有指向性的形状来创造负空间，以此暗示某一画面区域。

⇧倾斜的三角形，可以引导你的视线向上和向右移动（形状微小时不会有这种视觉引导）

但有一个问题，当你视线到达页面右上角时，你的注意力可能会消失。你的眼睛移过对象，但是那N B s V d 6里的空间太大，而来自三角形物体的方向不再指使着视线继续移动，你的视线会从这部分区域移开，该区域没有焦点了。

但是，通过裁剪/缩放的方式，让指向性形q z , v D L u % O状再次出现视野中，指向关系得到强化。整个画面的空间，看起来既t h E有意又很有趣。

通过这个例子，我们可以得到什么启发呢？如果你要移动@ L V , . s Y某人的视线到目的处，有两个办法可以选择。第一种，在画面中增加带有负空间的指向性物体，指向目的处，这样视线就, O u D t g q被引导着移动。第二种，从起始点到目标处，可能要经历很长4 % M +一段距离，但注意别丢失引导性的指示，否则视线会分神。

欢迎关注作者微信公众号：「RaDesign」