VI设计的基本技巧

知识分享
 - 正规平台网站

品牌VI设计规范是一组设计原则和规则,用于创建一致的视觉信息。它适用于品牌分发的所有内容,从网站设计到印刷品到广告甚至社交媒体。

视觉风格指南设定了品牌的视觉基调,因此任何可以访问它的人都可以跳进去设计出符合客户和粉丝习惯的东西。

如果您还没有视觉风格指南,那么现在是开始着手制作指南的时候了。好消息是,这比您想象的要容易!这里有一些入门提示。

 - 正规平台网站

从必需品开始

你的大部分风格指南本质上应该是可视化的,这样很容易看到设计元素应该是什么样子。唯一的例外是指南的第一小节,它应该解释指南的内容并简要概述如何使用它。这很重要,因为该指南可能会分发给需要额外背景信息才能开始品牌推广工作的代理机构和自由职业者。

您的介绍部分应包含基本信息,例如:

  • 公司概要(使命、行业、客户类型等)
  • 设计理念的简短描述
  • 基本设计的预览,例如徽标或网站主页
  • 徽标、调色板、字体和图像的目录
  • 印刷和数字应用的注意事项
  • 品牌经理的联系信息,以便用户知道向何处提出问题

标识

这听起来可能很简单,但一个可靠的风格指南是保持团队视觉集中的关键,这样你的品牌材料就永远看起来像你。标志是最重要的起点。

无论您拥有一个普遍使用的单一徽标,还是出于特定案例或特定平台的原因使用多个版本,视觉样式指南都应提供有关如何正确使用和不使用徽标的示例。

这包括许多因素:

  • 尺寸和放置规则(例如,某些品牌指定徽标必须始终位于左上角)
  • 概述何时应使用颜色而不是黑色和/或白色的颜色用法
  • 主要和次要徽标示例和用法(许多品牌为社交媒体资料或将在图标大小使用徽标的地方提供第二个更简化的徽标)
 - 正规平台网站

颜色和排版调色板

颜色和排版应该在你的视觉风格指南中都有自己的部分,并附有用例。两个菜单都应该只包含少数选项——两到三种颜色和相同数量的字体——以保持调色板易于管理。

颜色

对于样式指南的这一部分,您可能不需要太多文本。包括显示每个颜色选项(和可接受的色调)的色板调色板。确保拼出实际的颜色代码和混合,以便设计师可以在需要时匹配颜色。包括 RGB、CMYK、Hex 和 Pantone。

还要为调色板创建层次结构。每种颜色应该如何使用?文本元素或阴影框应该有原色、副色和颜色。

排版

排版调色板的工作原理很像调色板。显示字体以及如何使用它们。这包括大小、字距、行距和颜色等所有内容。

创建一个排版层次结构,显示标题、副标题、正文的样式以及如何使用粗体、斜体和下划线等变体。确保这些之间的大小差异足够明显,样式不容易混淆。

在排版方面,您的品牌可能具有用于印刷和数字项目的略有不同的排版调色板。确保包括两个排版调色板,并清楚注明哪个是印刷品,哪个是数字版。作为一个额外的好处,包括一个图表,显示哪些字体在印刷项目和数字项目中被交换。

图像学

图标和图案可能是棘手的设计元素,但它们并没有那么令人生畏,有明确的指导方针。

图标是一个重要的设计元素,为副本和内容提供上下文支持。想想贵公司电话号码旁边的电话图标,以及象征贵公司独有流程的更多品牌元素。这些小图像还可以作为元素的视觉提示,例如社交媒体链接或引导用户完成设计。图标可能是您的数字形象的重要组成部分,您希望确保图标不会被随机使用(或设计)用于每个新项目。

就像创建颜色或排版一样,创建一个图标调色板。选择与您的品牌标识相匹配并符合观众期望的尺码和款式。

 - 正规平台网站

摄影风格

即使您在设计中包含的照片类型也应该具有视觉风格。为图像创造一致的感觉和情绪,只需一瞥,即可将用户与您的品牌联系起来。像 Spotify 这样的公司在这方面做得非常好,主要是挑选人物图像,然后对所有人应用双色调过滤器。他们还在每张图像上使用一致的大小和文本处理。

在开发摄影风格时,请包括以下信息:

  • 风格
  • 框架
  • 作物指南
  • 颜色使用
  • 尺寸指南或纵横比
  • 在印刷和网络项目中放置的规范。
  • 必要时精确尺寸的轮廓(例如您网站的横幅图像的尺寸)

一种方法是考虑always 和never 必要性,这样你的设计师就有了要寻找和避免的元素。找到介于两者之间的东西比面对整个图书馆更容易,没有概念从哪里开始。例如,切勿使用预先应用了过滤器的图像。这似乎是规定性的,但突出显示要避免的某些关键事项将简化设计人员的流程。

数字元素

请记住在您的视觉风格指南中包含您的网站或移动应用程序的元素。创建一个单独的部分,详细说明如何处理按钮、导航、表单、动画、链接和悬停效果等元素。

这通常是视觉风格指南中最容易被遗忘的方面——也是创建一致用户交互的关键部分。例如,按钮不仅应该在每个实例中看起来都一样,而且它们的行为应该始终相同。这包括从用户将鼠标悬停在按钮上时发生的情况,到它的外观,再到单击时发生的一切。一致的用户界面工具可提供更流畅的用户体验。

由于其中许多元素的性质,这里最好应用风格指南的数字版本。考虑在您的网站上添加一个隐藏页面,供内部用户参考。您甚至可以包含可下载模板或示例的链接,作为用户的起点。

提供大量示例

它被称为视觉风格指南是有原因的。使其可视化,以便轻松查看您的品牌风格。

当涉及到视觉示例时,许多样式指南都包含有关如何使用和不使用设计元素的部分。只坚持好的例子。这样做的原因是,一旦有人看到一个例子,他们就会记住它。想象一下,同一个人后来正在为社交媒体撰写帖子,并记得在指南中看到过一些内容并复制它,但事后发现它实际上是不该做的一个例子。

保持简短

视觉风格指南不必很长。上面描述的许多元素只需要一个要点或图像来显示。对于某些品牌,样式指南是网站上的一个页面或内部分发的 PDF。对于其他人,它可以是小册子,甚至只是一张纸。

一页样式指南应该是大多数品牌的目标。这样你就知道你已经创造了一些简单和可用的东西。如果您的指南将跨越多个页面,请考虑在指南的前面添加一个备忘单,其中包含徽标样式、颜色和字体等关键元素 – 或者,一个指向单个菜单项的热链接的菜单 – 以便用户有一些事情要做一目了然。如果指南易于查找、理解和使用,您的创意团队将更有可能查阅该指南。