【Airbnb】色板解析

写在前面

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

 

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

 

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

 

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

 

例如，这是Invision 的色板：

 

 

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

 

 

应用色板

让我们看看Airbnb是怎么将色彩运用到设计系统的。

 

Airbnb的首要色是Rausch, 该颜色是以公司诞生的街命名。Kazan所谓次要色，而另外两个灰色则作为背景色使用。

 

 

Airbnb的品牌色

对于大多数页面来说，Airbnb用了Foggy灰作为背景。

 

你能看到他们用了rausch 作为他们的主色来强调重要的行为比如发出预约订单的请求。

 

Kazan，类似于绿松石的颜色，被用于吸引眼球。

注意他是如何衬托主要色的。

 

 

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

 

写在最后

 

一开始你的设计不需要任何颜色。

 

关注布局和原色的排列。

 

想一想你的设计中的视觉层级。考虑那些组件你想要高亮并且给他分配合适的颜色。

 

而且还得考虑对于鼠标悬浮和点击状态使用不同颜色的灰度。

 

当你满意了你有的之后，你就可以开始将色板应用到设计中去。

---

 

---

 

---

  注：以下内容无关设计竞赛相关信息。为本网站关于版权声明。

本网站中未标注“来源或是标注“来源**(网站)”的作品，均转载于第三方网络平台，本网站转载系出于传递设计大赛信息之目的，不保证所有赛事的准确性、和完整性，请您在阅读、创作过程中自行确认，不代表本站的观点和立场，版权归原作者所有。若有侵权或异议请联系我们删除。

关于附件下载问题：如果附件下载显示无权限，请更换浏览器，不要用EDGE浏览器，推荐谷歌浏览器。