Most of the folks I hang out with
are pretty scaryare code geeks so we rarely talk about design or design related issues. As someone interested in technology in general though I find it interesting. Some time ago Adobe released kuler, a site that lets people create and share color swatches. I'm not sure what a swatch is - I think it has something to do with putting colors together nicely. For me 'putting colors together nicely' means getting dressed and checking out the face my wife makes. The kuler site is pretty fun to look at and play with - and it turns out it has a pretty nice API as well.
As you know - the only word that makes me more excited than API is wishlist - so when I saw the docs I thought I'd see if I could whip up a quick little CFC.
It turned out to be rather easy. My CFC supports everything the API does:
- Get latest, most popular, and highest rated themes
- Search themes
- And it also provides a few utility functions to make linking a bit easier.
Check out the sample code below:
<cfset k = createObject("component", "kuler")>
<cfdump var="#k.getRecent()#" label="Recent" top="3" expand="false">
<cfdump var="#k.getPopular()#" label="Popular" top="3" expand="false">
<cfdump var="#k.getHighestRated()#" label="Highest Rated" top="3" expand="false">
<cfoutput>
<a href="#k.getThemeURL(11)#"><img src="#k.getThumbURL(11)#"></a>
</cfoutput>
<cfdump var="#k.search('ocean')#" label="Search for ocean" top="3">
<cfdump var="#k.search(title='Asian')#" label="Search for title=Asian" top="3">
Archived Comments
You like APIs, eh? You might want to check out this list of APIs. Maybe we'll see a few on RIAForge sometime soon?
http://techmagazine.ws/full...
Ray,
This is fantastic! I've kept in the back of my mind an option to
allow the user to choose a kuler theme and have it change the:
1 background color (sometimes called the wrapper)
2 content color (760 pixels wide)
3 navigation
4 outline (header/footer)
5 breadcrumb/message area
The only problem is that it might not work with a foreground font.
I'm unclear how to get the hex values for each of the 5 swatches.
I see that there is an array with three elements, but shouldn't there be 5?
Each element has Channel1, Channel2, Channel3, Channel4,
a ColorMode ("rgb"), a hex and an Index (0,1,2).
I suppose I should use the hex, but I'm confused by the number of elements in the array.
Hi Phillip,
Not all themes have 5 swatches - kuler allows between 3-5 swatches when saving a theme. So you will want to verify that there is 5 swatches for the theme you retrieve. You can also view a sample RSS feed with notations at http://labs.adobe.com/wiki/...
It's because the cfdump had a top="3" argument.
But you're link helped, too!
add that to blogCFC 6 - the ability to set a primary color then have it get a theme from kuler that go with it.
kuler rocks!
It has helped me immensely in my design work, and I simply love the layout of the application itself--very sexy (sexy=truth).
As to the definition of a swatch, think of it in terms of Photoshop and Illustrator which allow users to apply colors (swatches) to various elements. The killer part about kuler is that it allows one to download swatch collections that can be directly imported into these programs and used immediately. Simply awesome.
As a side note, as soon as Galleon 2 is released, the winner of the logo contest should be required to submit a Galleon 2 scheme to kuler...
@CeeVee - Yep, I'm aware of the list. :)
@Phillip - Due to the complexity of the data, I had to munge a bit for the swatches. So everything else is normal query data, but swatches are arrays of structs.
Oh and yea - sorry - the darn top= works nice - but stops EVERYTHING at 3, not just the query.
ScottP - you trying to make BlogCFC6 even long to develop? ;)
Existdissolve - I keep saying it is a week away - hopefully it will be this week.
Now, if there was somehow a way to get these swatch in a format that I could take to the paint shop and have them match the color swatches, I'd be in heaven! I'm supposed to be picking out the colors to paint the room in ths house but it's quite overwhelming to stand in front of the paint chip wall and try to come up with a combination that isn't so awful.
I don't know how accurate this is, but http://www.easyrgb.com/ has a service into which you can import rgb values and it finds the closest match to various paint-provider's collections (e.g., Sherwin Williams). You could, I guess, create a theme in kuler and then paste the values into this service, though I can't make any claims for the accuracy.
Nice CFC idea!
Ok, here's what I mean:
http://www.aacr9.com/index/...
Proof-of-concept type thing.
What I really need to do is show the swatches and allow the user to determine everything that can be colorized (including fonts).
Plus it could use some AJAX help.
The zip file is:
http://www.aacr9.com/index/...