什么是KulerKuler是一个基于网络的应用,它提供免费的色彩主题,我们可以在任何作品上使用它们(不会有版权问题)。下面这篇文章能让我们获得更多关于Adobe Kuler的信息和使用方法。

使用Adobe Kuler来增强Photoshop的色彩工作方式
让我们走近下面这个能帮助设计师节约时间且功能强大的产品--Adobe Kuler。在Kuler网站上,我们将会会学习到如何发现颜色群,以这些颜色创建一个色彩主题并分享它,以及在photshop cs4的扩展中如何快速的使用这些内容。什么是Kuler?Kuler是一个基于网络的应用,它提供免费的色彩主题,我们可以在任何作品上使用它们(不会 有版权问题)。下面这篇文章能让我们获得更多关于Adobe Kuler的信息和使用方法。

序言

Adobe Kuler是如何工作的?我们得准备些什么?要使用Kuler,我们仅仅需要一个可以使用Flash Player 9或者更高版本的浏览器,因为Kuler网站是基于Flash建立的;然后你就可以在任何Creative Suite 4产品(photshop cs4被包含在内)里使用Kuler的扩展,或者直接使用Kuler基于Adobe Air桌面应用程序(安装需要Adobe Air,一个免费的程序环境)。

网页设计师如何使用Adobe Kuler优化配色工作

出现这个页面提示,说明你的浏览器没有安装flash player 9或者版本过低
(译者使用的是firefox+flash插件,可以正常使用)。

网页设计师如何使用Adobe Kuler优化配色工作

这是Kuler网站的首页。

网页设计师如何使用Adobe Kuler优化配色工作

Adobe Desktop Air的Kuler程序

网页设计师如何使用Adobe Kuler优化配色工作

Kuler在cs4套装中的扩展

创建,分享,和使用颜色主题!

不管是职业设计师还是初学者,都经常会为了寻求一个适合作品的色调而头疼。这就是为什么会有 Kuler!不仅仅是大量的个人在为Kuler创建颜色主题,Kuler更加是一个活跃的团体,我们在讨论一些颜色的时候,就会有人创建并发布相关的颜色 样板。下面我们了解一下如何创建一个Adobe ID,这样我们才能登陆Kuler网站,然后才可以在这个充满颜色的世界里寻觅,保存我们喜爱的主题,当然,我们也可以创建并发布自己的颜色主题供别人使 用。

网页设计师如何使用Adobe Kuler优化配色工作

可以很方便的从一张图片中提取颜色并建立样本

申请一个Adobe ID账户来使用Kuler

你可以使用Kuler来进行各种颜色的搭配实验,复制和粘贴那些颜色值来使用。但只有登录之后,你才能下载到可以直接使用的Adobe颜色样本文件,这种文 件包含了整套颜色主题。要记住在所有不同网站不注册的同帐号总是让人感到胸闷,还好Adobe的各种服务只要一个Adobe ID就行了。

如果你有Adobe ID,你可以点页面右上角的“Sign In”轻松的登录到Kuler,如果没有就点击“Register”注册。Adobe 会把你带到注册页面,根据注册向导,可以轻松的完成。得到你的帐号后,再回来登录Kuler。(老外真是细心体贴啊,难道怕Adobe的其他服务会把人吸 引的离开Kuler么)

登入

网页设计师如何使用Adobe Kuler优化配色工作

点击页面右上角的Sign In后,输入你的Adobe ID和密码,然后点GO。

注册

网页设计师如何使用Adobe Kuler优化配色工作

点击页面右上角的Register注册。 网页会跳转到Adobe的网站,然后点击Create an Adobe Account继续注册。加星号的是必填信息,写满。注册成功后回到Kuler用上面说的方法登入。(翻译这段完全是为了保持原文完整性,虽然我的中文版 也没完全按标准重述。)

不同的菜单和模块

Adobe Kuler 分成不同的模块。这些模块允许我们添加和获取一些信息。在下面你可以看到单独的带有简短描述和图片的模块。

浏览方式
* 菜单

通过浏览和搜索Kuler的资料库来找主 题。在左侧的主题导航里,我们可以点击Newset,Most Popular,Higherst Rated来分别根据最新的,最受欢迎的,最高得分的颜色主题顺序浏览,Kuler还有一些其他随机的排序选项。我们还可以限定时间范围,这样就只显示在 该时间内上传的内容。

* 搜索
我们可以用搜索框来精确寻找我们需要的颜色。tags标签,titles标题,creators作者或者colors颜色。想让所有人都能轻松的发现我们自己创建的主题,建议上传时在tags标签里填上描述该颜色主题的最准确的关键词。

网页设计师如何使用Adobe Kuler优化配色工作

搜索框和左侧导航

社区

* 主题的详细资料

在Kuler上出现的颜色主题是由整个Kuler社区来发布并维护的.我们的颜色主题从建立,存储到发布,可以开放给Kuler中的其他用户。在这个模块中,其他用户可以参与添加主题的信息,包括作者,标题,不同的标签以及更多。

* 评论

我们可以像很多其他网站一样评论其他用户的主题或者被评价,记得登录后才能够发表评论,游客状态只可以浏览。

网页设计师如何使用Adobe Kuler优化配色工作

上半部分是一个主题的信息,以及被添加的标签
下半部分是comment评论部分

我的Kuler

* MyKuler
MyKuler 模块在下面这张图里是空的,因为我的帐号里没有创建过颜色主题,当我们创建了第一个主题后,在MyKuler-Theme这里就可以存储,预览颜色主题。 曾保存过或设为favorite(喜爱)的颜色主题也会出现在这里。你可以用favorites的方式来保存颜色主题,在每个主题的详细资料里有(下载那 一排三个按钮中的第一个)Add to Favorites。这样回头可以统一把保存的主题导入到Photoshop里。

网页设计师如何使用Adobe Kuler优化配色工作

其他
* 新闻要点
这个模块发布了一些关于Kuler最新消息的重要通知。(在页面的右边)

网页设计师如何使用Adobe Kuler优化配色工作

Kuler - 特性

下载到的颜色主题是样本文件(可以直接在photshop的色板中载入使用)

网页设计师如何使用Adobe Kuler优化配色工作

登录Kuler之后,你可以自己喜欢的颜色主题,只需要点击图中所示的按钮就可以下载了。

.ASE格式文件

网页设计师如何使用Adobe Kuler优化配色工作

上图是.ASE格式文件的图标外观。所有 Creative Suite 4产品都支持.ASE文件的转换。举个例子,我们可以轻松的把的Illustrator或Photoshop作品中的单个颜色或者整个主题转换成.ASE 文件。对我们来说,就是可以把在Kuler下载的颜色文件导入到软件里。

载入色板

网页设计师如何使用Adobe Kuler优化配色工作

在Photoshop中展开色板面板,点击右上角的三角按钮。然后选择“载入色板...”,在弹出的对话框里选择下载好的文件,然后导入就行了。

添加评论

网页设计师如何使用Adobe Kuler优化配色工作

上文提到过,成为社区的成员并不仅可以得到颜色主题,而且可以给主题评价和打分,这样做可以帮助Adobe把这些颜色主题更好的归类。留言的话,点击Add a comment添加一条留言,输入文字,然后点击Submit按钮发表。

为主题投票

网页设计师如何使用Adobe Kuler优化配色工作

五星投票系统告诉我们这个主题在社区的受欢迎程度。我们选择Highest rated按分数排列或Most Popular按受欢迎程度排列时,高分主题会在这里优先显示,并且会出现在Kuler的首页上。

编辑和创建主题

我们刚刚学习了如何浏览和下载主题,但是我们现在想创建自己的颜色主题了。点击任意一个热门颜色主题,在出现的详细资料中,点击查看/修改按钮 (Make changes to this theme and view color values)或者点击左侧菜单中的Create(创建),都可以把我们带到制作页面。可以自行选择是从颜色创建还是从一张图片创建。

网页设计师如何使用Adobe Kuler优化配色工作

回顾一下这三个按钮,分别是设为喜爱,下载主题,查看/修改主题

网页设计师如何使用Adobe Kuler优化配色工作

从颜色创建主题

网页设计师如何使用Adobe Kuler优化配色工作

从图片创建主题

创建自己的主题

Kuler为快速创建新主题提供了极为高效的工具。我们可以选择不同的调色规则,然后使用交互式色盘、亮度以及不同颜色模式的滑块来建立颜色,也可以从图片中提取颜色,当然,也支持直接输入颜色代码。

网页设计师如何使用Adobe Kuler优化配色工作

建立自己的颜色主题

基础颜色和关联颜色

就像名字里说的那样,你可以选择一个基础颜色然后创建以它为中心的颜色主题。在设置了基础颜色之后,另外4个关联颜色会自动生成,调色规则可以让你在改变基础颜色时自动改变它们。我们可以在色盘里拖动调整基础颜色,关联颜色会根据规则一起移动。

 
网页设计师如何使用Adobe Kuler优化配色工作

基础颜色和关联颜色

色彩规则

这些色彩规则都是基于色彩理论建立的。如果你对Kuler上的这些理论感兴趣,可以到下面提供的链接里去看看。选择基础颜色之后再选择一个色彩规则 就可以快速的创建出一个协调的颜色主题。我想理解这些色彩规则最好的方法就是一个个的去试一下。如果选择Custom(自定规则)的话,你可以自由的调节 单个相关颜色。

网页设计师如何使用Adobe Kuler优化配色工作

色彩规则

色盘

通过在交互式色盘里移动标记点来选择颜色。可以选择一个色彩规则来完成,单独的调整颜色也行。在色盘的下面是控制颜色亮度的滑块。

网页设计师如何使用Adobe Kuler优化配色工作

色盘和亮度滑块
颜色值

如果色盘里的颜色还不够准确,你可以为颜色输入一个具体的数值,Kuler支持HSB, RGB, CMYK, LABHEX 这5种颜色模式.如果你想只改变一个颜色,在色彩规则中选中Custom,然后输入一个新的数值会调整它。接着再选回之前的色彩规则来做整体调整。使用各 模式的颜色滑块。会有各种新奇的结果,方便我们做颜色实验。以上这些,如果你没有登录的话,也可以轻松的创建颜色主题,然后将结果的数值粘贴到 Photoshop或者其他软件里。

网页设计师如何使用Adobe Kuler优化配色工作

色彩模式

从图片创建颜色主题

Kuler还提供的一个非常绝妙工具,就是从图片中提取颜色来生成主题。我们可以从本地上传或者使用Flickr相册里的图片。同样这里也有调色规 则,Kuler为我们提供了下面这几种模式:Colorful(五彩缤纷), Bright(明亮的),Muted(浅色的),Deep(深色的), Dark(灰暗的),和 Custom(自定)。选择规则后,会自动从图片中提取生成颜色。通过移动标记点的位置,Kuler提取当前位置的颜色并中图片下面的主题预览中显示出 来。Keler支持的图片格式有TIFF,JPEG,GIF,PNG和 BMP。

网页设计师如何使用Adobe Kuler优化配色工作

保存和发布

在保存主题之前,我们需要给他取一个恰当的标题和准确的标签,以便于其他用户发现。我们可以选择保存为Praivate mode(私人文件)放在Mykuler里面,也可以选择和其他用户分享(选Public),这样可以得到投票和回复建议。标签和回复会显示在该主题的详 细信息模块里。热门的标签会以特定的字号出现。越大的字号,说明标签越热门。主题作者们可以用图片或者一个色板的缩略图作为自己的头像。其他用户可以通过 点击头像来查看所有该作者创建的颜色主题。

网页设计师如何使用Adobe Kuler优化配色工作
保存和发布颜色主题

在Photoshop中使用Kuler扩展

 

下载的Adobe Swatch Exchange Files(色板扩展文件),可以在Adobe CS2以上版本中使用。我们看看Kuler扩展在Photoshop CS4中的使用情况

找到并打开Kuler扩展

在全新的CS4版本中,Adobe 在Photoshop中整合了Kuler。你可以在通过点击“窗口”-“扩展功能”-“Kuler”来开启它。加入你仍然不知道Kuler是啥玩意或者不 知道它是干什么的,你可以通过点击“关于”按钮来获得一些信息,如果感兴趣的话也可以看看那些使用条款和隐私策略什么的。

这个扩展是通过Kuler的RSS feed向我们提供资源的。直接从Kuler的在线数据库载入颜色主题。你也可以从你的Adobe 账户登录(上文有说怎么申请),点击“窗口”-“扩展功能”-“连接”,会出现一个登录adobe服务的窗口,输入帐号和密码,登录成功后会显示是否注 销,直接关掉窗口即可。

网页设计师如何使用Adobe Kuler优化配色工作

Photoshop中的Kuler扩展
功能介绍:浏览和创建

浏览

浏览标签下面显示了当前上传的和可用直接使用的颜色主题。注意:需要连接到网络,才能载入RSS Feed和颜色主题列表。我们可以浏览,搜寻和整理主题,使用方法和在网站上类似。在Kuler面板底部,我们可以看到向上和向下的箭头,用来查看上一页和下一页的内容。

网页设计师如何使用Adobe Kuler优化配色工作

Kuler扩展面板浏览标签
创建

创建标签显示的内容是Kuler网站上Create页面的缩小版。我们可以看到那些熟悉的强大功能,比如选择规则,调整颜色,亮度,设置基础颜色和关联颜色等等。面板底部的三个按钮分别是保存主题,添加到色板以及上传到Kuler。

网页设计师如何使用Adobe Kuler优化配色工作

Kuler扩展面板创建标签

色板

下面这张图是标准的photoshop色板。可以同过点击“窗口”-“色板”调出。前面我们学习过如果导入ASE格式的主题文件到色板里。 Kuler扩展把这一步变得极为简单。我们可以方便的浏览主题,并直接添加到我们的色板中,而不用麻烦的跑到Kuler网站上下载ASE文件,然后再回到 Photoshop中导入它们。

网页设计师如何使用Adobe Kuler优化配色工作

Photoshop的标准色板

直接添加主题到色板里

Kuler扩展面板中的左下角,有个“将所选主题添加到色板”的按钮。现在我们可以任意选择颜色做为前景或背景然后在工作中使用他们。在色板右上角的三角菜单里,我们可以重设色板或者删除不要的颜色。

 

网页设计师如何使用Adobe Kuler优化配色工作

添加Kuler扩展中的主题到色板

使用Adobe Air Kuler的桌面应用程序

下载和安装

目前为止,我们已经用过了Kuler的网站和Photoshop CS4中的扩展,别忘了我在前面提起过,还有一个超酷的Air程序可以独立运行于Photoshop之外的。装之前需要先安装Adobe Air程序环境(下面提供了官方下载链接,速度慢的话可以去迅雷搜索)。

网页设计师如何使用Adobe Kuler优化配色工作

在Kuler网站中下载

双击安装程序,按照安装向导的要求很快安装成功。打开Kuler,呃,好像很眼熟的样子。这个Air程序和扩展差不多,还提供了一些其他的功能。主题下载后会直接添加到photoshop的色板里。

网页设计师如何使用Adobe Kuler优化配色工作

Kular的Air程序

特点

你现在可以在桌面上直接浏览,搜索和保存主题。还可以单独把一个主题拖动到桌面上,任意改变它的大小,复制颜色值或是访问Kuler网站去给主题添加信息或投票评价。建议多玩玩来增加对程序的了解。在我们使用任何Adobe的软件时,有Kuler的帮忙,真的很有用。

网页设计师如何使用Adobe Kuler优化配色工作

Kuler简示

附加信息

Kuler相关链接

其他一些提供颜色主题和图案的网站

写在最后

我在工作中使用Kuler并记录了它的那些优秀的功能.现在大家知道了Kuler的如何工作,搜索,保存以及使用在Kuler找到的主题,并且还可 以有灵感的去创建一个属于自己的独一无二的颜色主题.我经常创建一些自己以后用不上的主题.拿去Kuler上传要比删除它们有乐趣的多.假如文中有什么不 对的地方,请在留言中告知我,这样其他读者也可以知道.

来源:http://article.yeeyan.org/view/84509/41262
翻译:hibem

收藏 6
点赞 2

复制本文链接 文章为作者独立观点不代表优设网立场,未经允许不得转载。