随着技术和用户界面的变化, 视觉设计对设计技能的需求持续增长. 每年都有典型用户界面的新例子出现, 我们对视觉层次的基本理解吗, 感知, 成分也发生了变化?

视觉感知的现代概念不仅植根于科学，而且植根于心理学. 因此, 不管用户界面如何不断变化, 我们看到和感知视觉信息的方式将保持不变. 考虑到这, 当代交互设计是否有可能在图形构成和视觉层次的基础上进行改进?

视觉感知的基本规则对任何视觉设计都至关重要, 因为他们指导如何以最快的速度传达具有隐含意义的信息. 然而, 因为视觉设计是平面设计的近亲, 这些标准是为印刷媒体制定的, 并且还没有被重新定义为数字化.

像“数字包豪斯学校”这样可能建立新的设计原则的东西还没有形成. 因为人们体验UI的方式与印刷品完全不同, 视觉层次和构图的规则不仅过时了, 它们简单地折叠在用户界面中.

在很大程度上， 设计师 仍然倾向于将屏幕视为一个静态的、二维的对象，并对其进行挑战 交互设计师 是超越简单地将印刷格式应用于数字媒体项目的创新. 但在新设计得以推进之前，对视觉层次的基本理解， 感知，构图需要重新审视.

视觉层次:对交互界面视觉构成的新理解

什么是视觉层次，为什么它很重要? 视觉层次是为了有效地传达信息和传达意义而对内容进行的布局. 视觉层次结构引导浏览者首先看到最重要的信息, 然后是次要内容.

通过适当的使用而建立起来的 大小，颜色，形状，距离，比例和方向， 的意思, 概念, 构图的情绪是通过创造性地使用图形元素来传达的，这些图形元素决定了视觉层次.

视觉层次对于任何类型的视觉设计都是至关重要的, 无论是需要引导访问者眼球的登陆页面，还是移动UI的导航. 用户对每个元素的理解取决于组合中的其他元素及其上下文. 为了形成视觉关系并由此建立，对组合元素进行相应的处理 整个设计的视觉层次结构.

视觉层次中的颜色

视觉层次的许多规则可能看起来很简单，甚至是平庸的, 但它们是优秀视觉设计的重要基础. 例如，颜色是 最具影响力的创意元素 在视觉设计中.

考虑一下红十字与单色十字的直接含义. 几乎在所有国家，红十字都象征着中立和保护. 这就是使用颜色进行即时交流的潜力. 颜色也经常被用来区分群体, 就像三个单色的红十字中有一个显得更重要一样.

明亮、丰富的颜色比柔和的颜色更突出，因此具有更大的视觉冲击力. 在一个接口中, 颜色可以用来呈现一种结构感，并指出可用的交互. 单色界面中的单一颜色可以区分选择, 甚至建议用户在鼠标悬停的按钮之外还有什么.

颜色也播种了 意义与情感 它可以将明确的信息传递给观众的潜意识. 在品牌化方面，人们对颜色进行了大量的心理学研究，因为它创造了一种 本能的反应 在消费者与品牌有任何有意义的互动之前. 例如, 蓝色通常被认为是可靠的, 安全, 和平静的, 而红色则具有刺激性，可以提高人的心率. 然而, 颜色可能有不同的意义 取决于文化.

在网页设计中有意义、有结构地使用颜色的一个很好的例子是 改变的名字 网站. The 网站 immediately communicates its structure through the use of color; the organization is scattered by default but can be rearranged by topic and/or color.

然而, 所选择的色调有助于克服场地意义的潜在困难之一. 为袜子或卫生棉条等日常用品筹款本身并不令人兴奋, 因此，场地激进的图形色调在建立必要的底层组织结构的同时，提高了日常物品的感知价值.

视觉层次中的尺寸

让我们想象一个插图，一只大鸟坐在三只小鸟旁边. 没有任何进一步的资料, 这个简单的图形立即传达了元素之间的关系:父元素和子元素, 它们共同构成了一个家庭.

在传统平面设计中, 一个典型的策略是把最重要的元素做得最大, 然后逐步缩小元素的层次结构. 大小决定视觉层次 因为最大的元素首先吸引注意力，因此似乎是最重要的.

不同的字体大小也经常用于文本主体，以表明显著的差异, 比如标头, 部分, 和报价. 二级内容, 比如图片说明, 通常是较小的，以免与正文竞争.

考虑一些最广泛使用的可视化界面，例如 Instagram. 屏幕上没有任何东西能与图像和视频相竞争——它们占据了大多数屏幕的60%以上. UI的目的是直接的.

一个颠覆传统的例子 视觉层次结构 在网页设计是投资组合网站的艺术/设计工作室 Ro /逻辑单元. 他们不寻常的网站可能不是最直观的, 但它挑战了典型的在线创意作品集的视觉安排. 因为他们有意将不同的项目随机化, 每次访问者访问网站时，就会出现一个不同的主界面, 是什么让每次访问都独特而有趣.

在大多数创意设计工作室的作品集中，工作并没有分层组织，因为每个项目都是独特的，并且被认为同样重要. Ro /逻辑单元场地的设计创造了一个动态的组合，每次访问都有不同程度的兴趣，并鼓励观众调查工作室广泛的投资组合. 因此, 的折衷, 设计工作室的跨学科性质体现在内容的随机展示上.

视觉层次中的对齐

视觉层次中的对齐通过在空间上连接元素来传达一种秩序感. 就像非线性小说中的章节一样, 想象一下，在一幅图形构图中，一个正方形站在线外. 当一个单一的元素打破了一个既定的结构, 它从构图中脱颖而出，从而获得相对于其他部分的意义.

除非有一个元素从视觉网格中脱颖而出，否则僵硬的构图可能会显得停滞不前，在视觉上无趣, i.e.从秩序感. 不对齐，或“打破网格”，是赋予图形元素更多视觉重量的机会. 这个概念是设计中视觉层次的基础.

根据传统视觉设计的一个原则, 放置在画面中心的元素显得更加重要. 例如, 主要内容或界面元素可以放在中间, 虽然导航, 菜单, 而其他次要内容往往被放在一边.

但先锋 设计师 喜欢挑战现状. 交互设计何时适用 基本视觉层次原则 然后将边界推向创新的视觉构图, 有趣的新体验由此产生. 通过使用不同的对齐方式，元素之间产生了新的关联和含义.

例如, DNA计划 一个网站是否使用一系列脱节的层次结构来传达音乐家专辑的创造性结构. 网站的结构很复杂，专辑的构造也是如此.

第一个, 参观者被邀请通过点击专辑的曲目来听音乐, 哪些传统上以专辑的形式排列. 然而, 通过允许访问者重新排列网站的DNA元素, 专辑的概念是传达的, 不仅仅是一系列的曲目, 而是随着时间的推移，碎片化元素的非线性结构.

视觉层次中的形状

说到形状, 让我们考虑一下，在大多数社交网络用户界面中，简单的心形是如何迅速传达其“喜欢”的潜在用途的. 要建立重要性或群体，在四个圆圈中考虑一个心. 几何形状就像颜色一样，形状带有一定的内涵，赋予元素个性或意义.

在交互设计中, 几何形状对于有效的交流是必不可少的，因为它们比文本更快速、更普遍地传达意思. 而不是文本, 图标(符号), 哪些通常是简单的几何形状, 已经成为大多数导航系统和用户界面的模拟.

“点赞”图片背后的目的, 下载文件, 打个电话, 或者通过图标(几何形状)简单而直接地传达信息。. 这种有效的视觉交流形式在全球市场中变得越来越重要，因为数字产品通常以多种语言服务于广大的国际受众.

强调传统印刷媒体与数字媒体之间不同的互动模式, 考虑一下在真正的报纸上搜索艺术部分的区别, 在大多数应用程序中使用搜索图标. 直到最近, 大多数报纸网站的页面布局与印刷版相同, 筛选内容的体验是笨拙和迷失方向的.

打破传统的网页布局 《每日符号 网站使用基本的方形和圆形，以一种微妙的方式呈现出独特的视觉层次，引导访问者浏览内容. 菜单在页面的中央, 当访问者点击它时, 四个彩色的圆点代表了场地的四个部分. 然后，游客将其中一个点拖到方格中，进入该区域.

视觉层次中的运动

在一组静止的元素中，一个移动的元素会带来更大的视觉重量, 视觉层次中的运动是一个不可能在印刷中使用的原则，但绝对可以包含在 视觉设计师的工具箱.

除了字面上的翻译，动作还能传达什么? 在UI中，动作通常被用作元素可以与之交互的线索. 动作的使用是否可以进一步推进，并作为一种独特的交流方式? 如果视觉层次不仅仅是关于沟通的效率, 而且还包括内在意义, 如何将运动作为一种重要的视觉交流工具?

我记得网站, 主界面(是动画的)因为邀请交互而立即脱颖而出. 虽然运动和界面是功能性的导航工具， 视觉设计师 利用这些元素的潜在损失作为传达网站潜在使命的一种方式:阿尔茨海默病. 就像组织为之筹集资金的病人逐渐消失的记忆一样, 如果没有积极的互动，网站就会慢慢消失.

信息层次中的声音

声音是另一种不可能在印刷媒体中使用的工具, 但还有待在等级制度的原则下发展. 因为声音是完全非视觉的，所以没有规则可参考. 但声音也可以成为有效传达内容的设计工具, 以及情绪或意义. 设计元素 携带特定声音的声音可能会相对于另一个进行分组, 那些最大胆的可能看起来是最重要的，或者可能意味着与群体分离.

与一个元素相连的声音的音质应该很快被识别出来, 描述, 或者帮助构建内容. 与视觉元素形成对比的声音如何传达新的含义?

声音本身是非常复杂的，它们在视觉感知之前就形成了一种完整的情绪或设计信息. 就像一个彩色的背景建立一种情绪, 背景中可以有声音, 或者在UI中提供反馈, 比如对手机按键的响应. 这项技术的原理是基本的, 但是，创造力的运用才是奇迹发生的地方.

由于它在集体创造性工作中的重要性, 为德国艺术家团体的展览创建的网站 古根海姆的零 使用声音作为大气背景，也作为导航网站时的一种反馈形式. 大胆的铃声建立了代表主题开始的片段, 而第三级项目在后台点击.

视觉层次的概念

视觉层次是一个直截了当的概念, 而理解理论实际上比设计师执行结构良好的构图的实际能力更容易. 然而，在保持良好状态的同时，要在新媒介中发挥创造力 设计 是具有挑战性的.

新媒介总是会出现，而具有挑战性的情况也不会减少——恰恰相反. 如今，这一数字已超过200 不同的屏幕尺寸 在使用. 这只是二维的. 第一个, 是互联网, 桌面浏览器, 然后是手机和平板电脑, 而现在，我们正通过互动电视等技术进入新的领域, 物联网, 穿戴。, 虚拟现实和增强现实.

真正推动数字媒体边界的设计仍处于起步阶段. 希望, 视觉层次和良好设计的原则将与技术的快速发展保持同步，使我们对数字媒体的体验充满意义和乐趣.