优秀配色方案的探索过程

选择配色方案往往是个难题,尽管网上有各种各样的色彩库,配色仍然至关重要,有时候最好还是亲自动手。而且这个过程也非常有意思。

为这类工作找到一套标准流程是不可能的,因为它天然具有创造性。我使用Sketch来进行这项工作,你当然也可以用Illustrator甚至Keynote和PPT来做。

提醒:品牌建设包含的远不止选择颜色和字体,如果你想要给自己的公司寻找一套配色,我还是建议你雇佣专业的品牌设计公司。

我接下来会重现我选定配色方案的过程,我需要把它用在一些演示当中。一切开始于这张照片,Zurich机场,由Erez Attias拍摄。在Unsplash上你可以找到许多更加漂亮(并且版权免费)的照片。

瑞士Zürich-Flughafen的Zurich机场

首先要做的是从图片中选取一些颜色。目前,我只会选出4种颜色:一种强调色彩、一种浅色、一种深色、还有一种其他颜色。我们之后可以随时回来查看这张图片。

初始配色,从图片中选出的样本。

有了4种基础色彩,可以开始做一些色彩上的探索了。尽管我不是这方面专家,但我有色彩理论的基本知识,我以此来引导我的决策。

探索色调和饱和度

使用Sketch的调色盘,我们可以减淡或加深每一种色彩。既然有浅色和深色,我们就得稍微调节一下饱和度和明度。通常情况,调节色调时最好保持饱和度与明度近似,反之亦然。

通过其他工具探索

我们可以使用像Paletton这样的在线工具帮助我们发现新的色彩。在本例中,我用了两种不同工具来计算互补色和三色系。

最后,还可以尝试在配色上叠加40%透明度的白色和黑色。

尝试各种叠加

我最后尝试的一件事情,来自Marko Vuletič的绝佳提议。建议你直接看看:

《快速创建配色方案的秘诀》

选择强调色时,我们可以尝试之前生成的某些更亮的颜色。

这整个过程帮助我们生成了相当多不同的颜色。如果我把最初的配色去掉,它们就是这些:

最后得到的色彩样品

哎呀,这颜色太多了

一点没错,这颜色确实太多了。我发现通常最好保持4到5个主要色彩,其中有一个应当作为强调色。还可以有一系列的辅助色来支撑,比如用来表达某些含义(红色代表错误等等),将不同部分或者概念分组,(比如用在我的演示中),或者用于代码语法高亮。

现在我们已经有了这一大堆演示,该花些时间相互搭配,尝试看哪些可以凑成对、可以用在哪里。在这里我给不出什么建议,你只能相信自己的内心,还要考虑这些色彩能否很好描绘你的气质和身份。

打磨配色(这不是在玩俄罗斯方块)

纠结一阵子后,得到最终的配色方案:

更新:自从把本文的草稿发给一些朋友看,就有人指出我的主要配色和Deliveroo几乎一样。这当然不是故意的,不过我忍不住想,是不是我的潜意识已经被伦敦遍地都是的Deliveroo品牌形象影响了。

medium

译文地址:可乐橙

作者:Danny Smith

译者:可乐橙

(0)

相关推荐

  • 理清这八个问题轻松搞定完美配色方案

    编者按:配色的文章并不少,有的是关于趋势,有的则探讨技巧.那么要搞定一整套的配色方案,从头到尾应当注意哪些问题,又该拥有怎样的思路呢?今天的文章,就帮你解决这个问题. 不论是品牌设计还是网站设计,配色 ...

  • Win7家庭普通版系统下"windows standard"配色方案丢失怎么办

    故障现象: Windows 7系统在使用过程中由于软件配色方案原因 会自动转变成windows basic的风格样式,且因无法找到windows standard的配色方案导致开始菜单显示不正常。 因 ...

  • PPT动画教程:配色方案

    今天我们用动画的形式介绍在Powepoint演示文稿中设置配色方案和背景颜色的方法和技巧。 如果对当前的配色方案不满意,可以选择其内置的配色方案来进行调整,并可以修改其背景颜色。 1、执行“视图→任务 ...

  • Win7家庭普通版系统下"windows standard"配色方案丢失

    故障现象: Windows 7系统在使用过程中由于软件配色方案原因 会自动转变成windows basic的风格样式,且因无法找到windows standard的配色方案导致开始菜单显示不正常。 因 ...

  • 助你快速搭配 Material Design 配色方案的10款Web工具

    在设计 Material Design 的过程中你会发现一个很大的问题,那就是如何大胆.灵活的使用色彩组合. Material Design 里的调色板工具将色彩描述为"受大胆排列色块并结合 ...

  • 为用户界面选择合适的配色方案:浅色还是深色?

    我们的日常生活总是会面临无数的选择,尤其是在职业生涯中,我们必须考虑到很多的反对和挑战,更好的设计解决方案不仅是基于建议,而且是以事实.和知识为基础的.今天我们要讨论的是UI设计师在工作中经常会遇到的 ...

  • Win7提示是否要更改配色方案来提高性能怎么办

    在使用电脑过程中,Win7弹出窗口提示"是否要更改配色方案来提高性能",对此该如何解决呢?导致此类现象出现的原因是Windows Aero配色方案的使用导致系统性能下载所造成的.对 ...

  • win7桌面窗口管理器配色方案:[2]改回Aero

    今天在用屏幕录像专家V2011录制桌面视频的时候,桌面图标小面突然显示,桌面窗口管理配色方案的弹出窗口,说桌面管理器将配色方案从Windows Aero改成windows7 BASIC一开始我也没在意 ...

  • 网站建设的常见的配色方案

    南昌云端在网站建设过程中会经常运用到网页的配色方案,下面就介绍一下常见的配色方案有近似色.补充色.分离补色.组色等. 操作方法 01 1.近似色    近似色是色环上已给定的颜色临近的任何一种颜色.如 ...