1700424280
1700424281
1700424282
用户体验要素：以用户为中心的产品设计（原书第2版） [:1700422510]
1700424283
用户体验要素：以用户为中心的产品设计（原书第2版） 配色方案和排版
1700424284
1700424285
色彩可能是向外界传递品牌识别的一个最有效的方法。一些品牌与色彩具有如此密切的关系，很难相信如果没有色彩，这些企业如何才能被不假思索地记住—想想可口可乐、UPS或柯达。这些企业多年来一直坚持使用了同一种很特别的颜色（红、棕、黄），这在公众的脑海中创造了一个很强烈的感觉。
1700424286
1700424287
这并不是说他们使用这些色彩而排斥其他所有的颜色。核心的品牌色彩通常是一个更广泛的配色方案（color palette）的一部分，这套配色方案是要在一个企业的所有材料中得到应用的。一个企业的标准配色方案中所使用的色彩，是为了它们在一起工作而专门挑选出来的，它们之间是互补而不冲突的。
1700424288
1700424289
一套配色方案应该能整合其中的色彩，以便于能将它们应用到一个广泛的范围之中。在大多数情况下，更亮或更醒目的色彩可以用于设计你的前景色—那些你希望得到更多注意的元素中。更暗淡的色彩最好用于那些不需要跳出页面的背景元素中。拥有多种可选择的色彩，为我们提供了一套能做出高效的、可供设计选择的工具包。
1700424290
1700424291
正如“对比”和“一致性”对于视觉设计的其他领域很重要一样，它们在创建配色方案时也扮演了一个重要的角色。在同样的环境中使用时，一个非常接近其他颜色、但又不完全一样的色彩，会破坏你的配色方案的效率。这并不意味着你只能使用一种红色、蓝色，等等。这是说如果你想使用不同色度的红色，要保证它们之间的差异足够用户把它们区别开，同时也用了一致的方式来应用它们。
1700424292
1700424293
1700424294
1700424295
1700424296
Orbit的特性和功能采用了受限的配色方案（上图），之后将其应用到了网站上（下图）
1700424297
1700424298
对于一些企业来说，排版（typography）（对于创建一个特殊的视觉样式而言，如何使用字体或字型）对他们的品牌识别是如此重要，他们已经发明了特殊的字型来专门供自己使用。一些企业，从苹果电脑到大众汽车，再到伦敦地铁，甚至Martha Stewart（知名家居品牌），都已经使用了专门定制的字型，在他们的品牌传达中创建一个强烈的印象。即使你选择不采取这个特殊的步骤，字体仍然可以作为“用设计来有效传达形象”的一部分来利用。
1700424299
1700424300
对于正文来讲，任何文本都会呈现在一个较大面积的区域并且被用户长时间地注视，因此，简单最好。面对华丽字体组成的大段文本，我们的眼睛很快就会疲倦。这就是Helvetica或Times等简单的字体被广泛使用的原因。当然，它们不是你唯一的选择，你没有必要为了可读性而牺牲风格。
1700424301
1700424302
对于更大的文本元素或者类似在导航元素中看到的短标签一样的文本，稍微具有个性的字体是非常恰当的。但我们的目标之一，不是用混乱的视觉、或不必要的各种字体（甚至通过不一致的方式来使用一小部分字体）来吓跑我们的用户，而是要对那种凌乱的感觉有所贡献。在大多数情况下，你不需要用太多字体来满足你的沟通需求。
1700424303
1700424304
有效地使用字体的原则与那些视觉设计的其他原则完全一样：不要使用非常相似但又不完全一样的风格。只有在你需要传达不同的信息时才使用不同的风格。风格之间要有足够的“对比”才能在你需要的时候吸引到用户的注意，但是不要使用过于广泛和多样的风格。
1700424305
1700424306
1700424307
1700424308
1700424309
用户体验要素：以用户为中心的产品设计（原书第2版） [:1700422511]
1700424310
用户体验要素：以用户为中心的产品设计（原书第2版） 设计合成品和风格指南
1700424311
1700424312
在视觉设计领域中对线框图最直接的模拟是视觉模型（visual mock-up）或设计合成品（design comp）。“合成”的意思是“综合的”，因为确切地说，它就是从已选定的组件中建立起来的、一个最终的可视化产品。这种合成物显示了各个独立的组件是如何结合到一起形成一个有机的整体的；或者，如果它们没有组成一个整件，就说明某个地方破坏了它，同时也表明这是一个任何解决办法都必须要考虑到的约束条件。
1700424313
1700424314
你应该能看到在线框图的组件和设计合成品的组件之间的一个简单的一对一的相互关系。这个合成品不一定忠实地再现了线框图的布局—事实上，它也不需要这样。线框图没有说明视觉设计的关注点，而是侧重于记录框架层。在我们处理设计合成品之前建立起线框图，使我们首先能独立地了解到框架层的问题，然后再关心到表现层的问题。尽管如此，线框图的核心概念，尤其是信息设计方面，应该显著地呈现在设计合成品中，即使它们没有精确地按照在线框图中出现的样子来进行组合。
1700424315
1700424316
1700424317
1700424318
1700424319
视觉设计不一定要精确地按照线框图来做—只要它考虑到了相关的重要级别以及线框图中各元素的组合关系。
1700424320
1700424321
当然，所有的这些文档是大量的工作，但是有一个很好的理由值得去做：随着时间的推移，我们的决策原因会逐渐从记忆中消失。那些“在某种特殊环境下用来解决某个具体问题的临时决策”和那些“为了形成将来的设计工作的基础而有意识地做出的决策”会混杂在一起。
1700424322
1700424323
另一个记录你的设计系统的原因是人们最后都会离开这个工作。当他们离开时，他们带走了关于这个产品如何设计出来的、如何在日常基础工作上建立起来的丰富知识。如果没有一个保留每一次更改、符合最新的标准和惯例的风格指南，这些知识就丢失了。随着时间的推移，在人们改变职位的同时，整个企业逐渐会出现集体失忆，“这些事情是如何被完成的方法”和“这些决策的理由”偏移到了企业的其他部分，或被工作人员给丢弃了。
1700424324
1700424325
承载这些设计决策的权威性文档是风格指南（style guide）。这个汇总文档确定了视觉设计的每个方面，从最大到最小的范围内的所有元素。影响到产品的每一个局部的全局标准（比如设计栅格、配色方案、字体标准或标志应用指南）通常是风格指南中的第一部分。
1700424326
1700424327
风格指南还要包括某一个模块或网站功能的具体标准。在某些情况下，在风格指南中所记录的标准，应该包含各个层级的标准从独立界面到统一的导航元素。风格指南的总体目标是提供足够的细节来帮助人们将来做出明智的决策—因为大部分的想法都已经为他们实现了。
1700424328
1700424329
创建一个风格指南同样有助于在一个分散的企业中实施设计的一致性。如果网站运营包括各种各样正在执行中的独立项目，并且由分布在世界各地的人员来完成的话，那么你的网站很可能会像一个“风格和标准随机混杂的产品”。让所有的这些人遵循一套统一的标准来运作，需要做大量的工作，这就是为什么负责执行风格指南的团队在企业中的级别往往比你所预料的要高的原因。有了风格指南，你就有了一套唯一且高效的方法，让你的产品看起来像是一个协调一致的整体，而不是一堆乱七八糟的碎片。