数据可视化操作时需要考虑颜色搭配,今天介绍一款在线配色工具——Color Scheme Designer。这款工具支持色相、明度和饱和度调整,通过对比色、相近色等设置颜色种类,并可以将颜色以aco色板文件方式输出至Photoshop。

 

       Color-Scheme-Designe-tool-interface Color Scheme Designer配色工具界面主要由两部分构成,左侧的颜色设置区域和右侧的颜色显示区域。

        左侧颜色设置区域的上半部分,可以设置颜色种类:单色、双色对比色、三色对比色、四色相近对比色、三色相近色、三色相近对比色等。左侧下半部分是调整色相的颜色环,在最下面的菜单可以调整饱和度和明度。

        右侧颜色显示区域,根据左侧选择的色相、饱和度和明度显示出配置后的主色和辅助色。通过下面菜单栏可以查看浅色页面示例和深色页面示例。

        下面具体谈谈Color Scheme Designer配色工具的应用方法。

  1. 确定要设计的页面基调。活泼的、严肃的、典雅的或朴素的等。
  2. 确定页面主色调和颜色种类。比如做女性服装页面设计,产品感觉是朴素、简单、大方。因此颜色以浅色、亮色为主。选择triad三色对比色,在色环上选择棕黄色主色调,调整通过滑动白色的定位点确定辅色色相。
  3. 通过adjust scheme调整饱和度和明度。可以在预置下拉列表中选择固有的模式,也可以自定义饱和度和明度。
  4. 查看右侧颜色展示区域preview的基本颜色配比情况,同时点击light page example,查看示例页面颜色搭配是否合理。如果不满意,可以返回重新light-page-example调整色相、饱和度和明度。

        确定颜色之后,有两种方法导出颜色。第一种,通过查看左侧下面的color list直接将颜色六位代码填入相关设计软件中。第二种,点击页面右上角的export,导出一份aco文件到Photoshop中,然后在Photoshop中点击色板——载入色板/替换色板,导入生成的颜色。

        最后,用选好的颜色完成数据可视化制作。



除非注明,本博客文章均为 数据研究与商业应用(TonySong) 原创.
转载请注明本文地址: http://www.searchmarketingart.com/color-tools-color-scheme-designer.html