在色彩中设计

admin管理员组

文章数量:1794759

在色彩中设计

原著：@jonathanzwhite on medium翻译：杰克 jacklidesign2u@gmail

在色彩中设计

色彩是设计师手中强大的工具。他吸引眼球，激发情感，而且传递着深意。在一篇广泛引用的研究-色彩在市场中的影响，研究人员发现对于一些产品，人们对产品的9冰柜价格0%拍脑袋仅仅基于颜色，色彩的重要性可想而知。

在设计中有效的使用色彩至关重要。但是使用不同色彩的组合却很难。每一种颜色有它独特的含义，而且它们的组合形式是无限的昆仑紫瓜。

你对色彩探索的越多，你就会培养一种对于好的色彩组合的直觉和鉴赏力。

选择一个色板优秀色板一瞥

有时候一个色板是瞬间灵感的产物，但是大多时候它来自于一个系统的过程。

确定目标

在做任何事之前，首先确定你的目标。好的设计是将色板和你的目标统一的。

你想通过你的设计传递什么讯你设计的目的是什么？陈子仪是用于告知还是重在说服？你想要你的设上升三角形计激发什么情感？

你的设计目标将会成为你挑选色板的指导准则。

确定用户谁是你的受众银行实习，你如何通过设计影屏幕像素密度响他们？

人们看待色彩是不同的。正如

Fairchild 所说

，色彩是由观察者由内而外引发的一种心理学现象. 人有不同的个人偏好，文化熏陶和人生辛烷值经历，所以色彩对我们有不同的影响。因此，为了理解人们如何对你的设计做出反应，你需要定义你的用户。

有些色彩的含义不分地域的，有些则迥然不同。绿毫无疑问代表了自然因为它是植物的颜色。然而红是因文化而异的色彩，在西方，红和火悬臂货架，暴力还有战争紧密相连。它还和爱与激情有着不解之缘。然而，在中国红却与富饶，幸福联系在一起。

中国的红色信封

正因为色彩有如此多的含义，将你的心理色彩模型与用户的相匹配是至关重要的。

想了解更多的关于不同国家和地区的色彩含义，请参考：

品牌与市场中的色彩心理学

和

色彩的含义

。

研习色彩理论

当选择色板时，懂一些色彩理论往往很有帮助。

色彩理论

是对色彩混合的逻辑结构和实践指导。 从色轮到色彩的单独含义，它无所不包。

设计学院的

色彩原理

和Hubspot的

101个色彩理论

都是好的入门书。有关色彩理论的有趣应用，请参考 为什么Facebook是蓝的？市场色彩运用背后的科学。

寻找灵感

有哈克深蹲时很难将符合你设计的色板可视化。没有问题，伟大的艺术家窃取。换句话说，他们从其他的艺术家找寻灵感。

通常我们是通过Dribbb外商投资合伙企业le和Behance来寻找色板的灵感。如果你想要找到像Material Design这样的设计风格的色彩灵感，可以使用一个叫

MaterialUI

的网站。对于扁平化设计，可以参考

FlatUIColors

。

那些网站很有用，不过可以尝试从你要设去刀疤计的媒介之外的东西中学习。这样做能够让你得到意想不到且独一无二的色板。例如，你可以看看室内设计。

室内空间重获新生

如果你想要一点不同，找一找其他文化中的色彩灵感。例如，韩国的MV闻名于他们对色板的运用。每一帧甚至都能成为一种灵感来源。

装置设计也是一个好的灵感源

你没有必要去韩国找色彩灵感。只要你想，你的生活中哪里都是。下次你出门，留意一下你身边的色彩吧。

色彩灵感无多多历险记处不在

当你找到一些能够激发你灵感的东小小的手心西，就为他创建一个色板吧。你可以用相应的色彩工具将相片中的色板提取出来并可以适当加以修改。

建立一个设计系统

一个设计系统，或者叫做（style guide）样式准则，就是一个包含你所有设计要素的框架。想想你在线网站将会使用什么按钮和导航栏，从按钮到字体，设计系统都能囊括。

例如，

Salesforce的设计系统

，还有 创业公司必看的

50条优美的设计样式准则

。

MashCreative的设计系统

在选择色板之前建立一个设计系统往往很有帮助金融战争，哪怕是一个草图。这样做会让你知道你有哪些元素，还有你需要对他们应用哪些色彩。

当为你的设计选择色板的时候，最好遵循

KISS（Keep it simple，stupid）

准则。颜色越少越好。对于大多数设计系统来说，一下的结构是一个好的开始：

背景首要色次要色错误色完成色

首要色就是你通常给重要的按钮和强调用的颜色。对于多数公司来说，首要色往往就是他们logo的颜色。

次要色是用来区分次要行为和首要行为的颜色。例如，首要按钮和次要按钮。错误色和完成色，典型的说红色和绿色，传递了色彩的状态。例如，成功或者错误的通知。

设计状态选择色板

现在你已经有了设计灵感和设计系统（哪怕是粗略的草图），也是时候该选择色板了。

对于一个基本的色板，南美洲美女我喜欢将我的颜色一一放好，就像是艺术家对待他们的调色板一样。

是时候拿出你所有的色彩灵感然后创建你的色板了。多多益善。不要害怕对你的色彩做实验。

当你要缩小你的色板选择时，再回头想想你一开始的两个部分：确定目标和确定用户。问你自己下面的问题：

什么颜色是更易得到的？什么颜色具有视觉影像，而且能抓住你的眼球？你需要一个浅色还是暗色的色板？一天的什么时候人们会用你的产品？什么情感状态是你的设计想传达的？有没有那个色板比中国古典名著其他的更符合这个情感状态？

正如我在上一个部分提到的，色彩在设计系统中有不同的角色。这些意味着每一种颜色在系统中有不同的权重。例如，你的背景色将会比强调色用的更多。

正因为如此，创建一个简易的包含在设计中出现概率和覆盖面积相匹配的不同尺寸的色板是一个不错的选择。

例如，这是

Invision

的色板：

一个集合的表达可能会像这样：

应用色板

让我们看看

Airbnb

是怎么将色彩运用到设计系统的。Airbnb的首要色是Rausch, 该颜色是以公司诞生的街命名。Kazan所谓次要色，而另外两个灰色则作为背景色使用。

Airbnb的品牌色

对于大多数页面来说，Airbnb用了Foggy灰作为背景。你能看到他们用了rausch 作为他们的主色来强调重要的行为比如发出预约订单的请求。

Kazan，类似于绿松石的颜色，被用于吸引眼球。注意他是如何衬托主paypal登陆要色的。

对于错误信，Airbnb使用了亮红，可以说是一种rausch的阴影吧。这种红，配上惊叹号，石膏矿立马吸引住了眼衬衣怎么搭配球而且将系统的状态提醒你了。

一开始你的设计不需要任何颜色。关注布局和原色的排列。当你满意了你有的之后，你就可以开始将色板应用到设计中去。

色彩的从无到有

想一想你的设计中的视觉层级。考虑那些组件你想要高亮并且给他分配合适的颜色。而且还得考虑对于鼠标悬浮和点击状态使用不同颜色的灰度。

小结

色彩的运用来自于实验和迭代。如果你想要更好地运用它，唯一的答案就是多加练习。将色彩看做一个添加剂。如果你已经将布局和功能设计好了，那么你就可以尽你所能试验你的色板了。

学习如何设计色彩对于一个设计师而言是无比珍贵的。随着你能更好的选择色板，你将会培养出一种一拿到项目就能够可视化色彩组合的能力。

更多干货和养料，请关注微信公众号: UX未来

还可以加入QQ群：261193629

本文标签： 色彩