你好，世界。你在寻找一点你的设计生活吗？也许从零到英雄拍摄你的图像？嗯，我的名字是迈克·普罗德在这里与visme，我在这里向您展示如何将图像带到下一级使用11设计原则的视觉层次结构。

“这件事为什么这么做？”你问。好吧，一个执行良好的设计将毫不费力地引导读者通过您的形象。没有混乱。没有浪费的能量。

拿摩根士丹利的网站， 例如。这是一个真实的生活网站，它已经将视觉层次结构应用于其页面，它指示读者在哪里看。

首先，我们从页面左侧和长期以来，我们从这个独特的有趣的图像开始，我们会在哪里找到字体，这是我们所知道的最大的字体。但当然，当我们滚动页面剩下的速度时，我们希望学习一点。

接下来你知道，我们在底部的图像上，我们被锁定了。在接下来的几分钟内，我们将向您展示一些更好的例子以及一些坏的例子。所以坚持我们。我们要开始吗？

设计原则的层次结构＃1：尺寸

“规模”吗？绝对地。就像兆蒙在这里一样。尺寸可以推动情绪。他们可以表示重要性。而且，规模越大，重点越大。没有那么小的小潜水员在那里，它可能只是看起来像是一个正常的每天鲨鱼穿过水。

这是没有视觉层次结构的文本的示例。这是完全相同的大小。我不知道焦点是什么。而且我不知道最重要的是什么。

但这是具有完美视觉层次结构的文本的示例。包括王冠的图像，因此观众可以通过重要性的顺序进行层次结构和传统的国王和王子感，以及设计中使用的层次结构。

设计原则的层次结构＃2：透视

我们的第二个视觉等级原则是透视。

透视可以造成深度的幻觉。这正是你在这里看到的。这五个人实际上并不是在两个靴子之间捆绑的鞋子上平衡。当靴子带来更近距离相机时，他们就在一段距离内才能让它们在现实生活中看起来更大。

这是一个较差的视角和对比的例子。你几乎无法阅读文本。“esti快乐？”翻译成“你开心？”不，我不开心阅读这篇文章。没有景深，很难阅读。

但是，埃西幸福纠正自己。它们在此图像中有一个模糊的背景，称为散景效果，并且尽可能看到它现在是3D图像，非常非常易于阅读。

请注意这里的颜色。颜色也可以创造深度。当它们在黑暗的背景时，明亮的颜色看起来更近。当暗颜色在明亮的背景上看起来更接近。

设计原则的层次结构＃3：颜色和对比

早些时候我们讨论了提请对您的形象引起注意时大小的重要性。但是可以说同样的事情颜色和对比。

带着这个疯狂的男人的例子。你有一个强烈的黑白对比，但你也扔进那个爆震，让你的形象脱颖而出，甚至注意到疯狂男性标志中的那张漂亮的衣服。

如果你带来这个人口统计，那么没有对比，我不知道你在谈论的人口百分比。但是，如果你暗中大多数人口，我确切地知道你在谈论什么，你有一个干净且凝聚力的形象。

设计原则的层次结构＃4：排版

啊，挑战选择一个字体。如果我告诉过你这不是关于曲线的话，它真的只是回到了大小。

这是糟糕的排版层次结构的一个例子。俞辰，他并没有真正强调任何东西。我不知道在哪里开始看他的简历。坦率地说，我进入了下一个。

在John Doe，一切都是完美的。他的名字是最大的，他的头衔是大胆的，我正在乘坐去巴哈马的途中像船一样巡航。另外，不要忘记颜色。约翰在这里应用了视觉层次结构，我会告诉你什么，他有这份工作。

设计原则的层次结构＃5：接近

我们第五个原则是靠近的。就像在高中或中学一样，你想围绕那些你最相像的人。这正是这些家伙正在做什么。这正是你想用你的形象做什么。

例如，采用这些宠物机器人图像。标题的有点以谁知道谁知道。标题向侧面的方式。它并非都在一起。你想把它放在一起，你把标题放在图像下面，你有一个完美的凝聚力在一起贴在一起。

设计原则中的层次结构＃6：负空间

是的，我真的希望你的家或办公室看起来不像这样。你想保持混乱，你想保持我们的生命的消极情绪。对？嗯，不是我们的设计。

使用负面空间更有吸引力。摘要更容易挖掘，这正是戒指的主 - 两座塔用那只戒指达到该戒指。

这是一个小负空间的一个例子。你到处都有字体。读书很难。不，这并不容易消化。

这是更好地使用负面空间的一个例子。他们凝聚了一切。只是几句话来让它更容易阅读和更容易遵循。

设计原则中的层次结构＃7：结盟

第七原则是对齐的。

当然，我们的眼睛喜欢读“F”模式。这意味着我们在页面的左上角开始前移动，然后向下移动。然后再次通过页面的其余部分。

此图像在此并非完全遵循“f”模式。今天今天太中心了。但是，如果你今天在这里拿到并使它更大，而且你将它移到页面的左侧，你有完美的“f”模式，为读者遵循。

设计原则的层次结构＃8：赔率规则

你有没有朋友加入了新的关系，他们只是两个人跑了下来，变得非常乏味？它肯定发生在我身上。我对此并不痛苦。

但这正是为什么每个人都应该遵循赔率的规则。当应用奇数对象时，这表明图像更具吸引力。

拍摄这些产品功能的图像。其中只有两个。没有大量的平衡，坦率地说，这很无聊。您添加了一个产品功能，并在整个图像中创建该余额。

设计原则的层次结构＃9：重复

重复，重复，重复。

正如你可以在这里看到的那样，他们统一的形式重复创造了一个团结和凝聚力。

但如果你从演示文稿中提出这些幻灯片，你可能无法判断他们都应该一起去。没有相同的字体，都没有相同的图标。我有点困惑。

这将我们带到这些演示文稿幻灯片。这是所有完全相同的颜色，样式，字体等，让您知道所有这些幻灯片都会因为重复而在一起。

设计原则的层次结构＃10：领先的线路

如果您真的想抓住观众的注意力，您可以以领先行的形式创建运动。

就像在这里那样带着这些炸薯条，这是一个导致番茄酱瓶和突然间的炸薯条，我很饿。

但是在此图像中，根本没有领先的线条。我真的不知道在哪里看，更不用说，字体直接在男人的脸上。

但是，如果你翻转过来，他的目光将一目了然地向您的业务指导。

请参阅：领先行的完美示例。

设计原则的层次结构＃11：三分之一

我们的第十一和最终的视觉等级原则是三分之一的规则。

这意味着你想拍摄你的图像并将其分成三个网格，每个交叉点都是图像上的焦点。

此图像并不完全遵循第三个规则。这位女士再次在中间右边有一个措辞。图像上没有真正的平衡。

但是，如果您创建该网格并获得这四个焦点，可以在此图像中看到，该女性已关闭到侧面，因此措辞完美地在图像中创建平衡。

这会这样做。这就是我们在设计原则中为11个视觉层次结构中拥有的一切。

确保你过后你的下一个设计，并确保你订阅我们的频道就在visme。

目前，我是迈克·普罗伯制作美丽的信息。