
Show HN: My Node.js two weekend project. Color palettes from Flickr images. - bfm
http://colorapi.com
======
Wolf_Larsen
This is "minimum viable" done perfectly. Well done.

Personally, I'll use this for color schemes.

Check out <http://colorapi.com/#!q/plumb%20tree> ,
<http://colorapi.com/#!q/iceland> , <http://colorapi.com/#!q/alps> ,
<http://colorapi.com/#!q/rainforest> .

~~~
runevault
Wow Plumb Tree in particular got some amazing palettes back.

Been playing with random keywords. Beer came back with some amusing pictures
but no color combinations I really liked.

~~~
evilduck
Beer geek here, that's search term issues. If you're wanting traditional "beer
colors" but not colors from logos and parties, try "malted barley" for an
average yellow-orange beer color gamut, and "chinook hops" (a specific
variety) for the greens you might expect.

~~~
runevault
MUCH better results, thanks!

------
stevelosh
This is really nice -- much easier for a photographer like me to use that
Kuler or the alternatives.

I have a question though: is it cool to use "All Rights Reserved" images on
Flickr for something like this? Clicking through some of the photos shows that
they're marked as "All Rights Reserved".

I'm asking because I made the decision to not use those on
<http://viewfinder.io/> based on the fact that I'm not a lawyer and prefer to
err on the side of caution.

However, if it's not a legal problem to use copyrighted photos I could have
much more data to play with, so I'm curious.

~~~
jrockway
This is fair use, so the author's copyright wishes are not applicable. The
copyright info applies to republication in full, not use in meta-analyses.

~~~
stevelosh
Maybe I'm missing something obvious, but doesn't embedding the photo in the
colorapi.com page count as "republication in full"?

~~~
jrockway
No more so than embedding it in a Google Images search.

What it comes down to is: has anyone filed a DMCA claim yet?

------
robflynn
Great work. I did something like this and had it generate a sample website: a
head, a content area, some tabbed navigation, a logo, and some headline
colors.

I essentially quantized the image that was uploaded (I didnt use flickr) into
5 or 6 of the most obvious colours, then applied a little bit of math to
determine which colours would work well together as well as adjusting the
lightness (up/down) to help contrast.

It worked out okay. Maybe I should upload it? Your take on the flickr version
is much, much cleaner than mine. Mine was a quick and dirty hack but was done
as a learning experience.

Here's a screenshot using the UPS logo as an uploaded image:
<http://dl.dropbox.com/u/3731176/auto-ups-logo.jpg>

------
bfm
Some background on the application [http://www.bermi.org/announcing-colorapi-
search-for-colors-i...](http://www.bermi.org/announcing-colorapi-search-for-
colors-inspiration-on-flickr-photos)

------
revorad
This is gorgeous. Woud love to read how you built it.

~~~
dfnkt
agreed

------
futuremint
Does the image processing happen in a child process in node? I'm curious how
your code does the heavy CPU without blocking node's main thread.

~~~
bfm
Yes image processing happens in a child process.

Right now I'm using GraphicsMagic resource limiting flag -limit for preventing
it from taking down all the resources.

~~~
DTrejo
Would what you're doing right now be possible using canvas on the client side?

On second thought, that might make things much more complicated / slow, you'd
have to write something that allowed clients to send back processed results to
speed things up for future searches by other users.

I wonder if there's any desire for something like <http://maprejuice.com/>,
but easily applicable to any processing task that needs to happen in realtime
* , as mentioned in the previous paragraph.

* But also support cached results.

PS If/when your no.de server crashes, do you have to push again to get it to
restart? I was having this problem the other day — it's annoying to have to
add a space to a file, commit and push just to restart the server.

~~~
bfm
I'm sure this can be done using Canvas. I might give it a try as a learning
exercise in the future. Thanks for the suggestion :)

Didn't know MapRejuice, looks promising.

Regarding no.de, I have the same issues you describe. I'm looking forward
moving to a larger SmartMachine where I can deploy using capistrano.

------
MichaelStubbs
I have a couple of issues with the design.

1) <http://i.imgur.com/uzsiH.png> \- overlapping text/controls on the
homepage. Tried it in a few browsers. Width issue?

2) On the swatch pages, I'd make the controls just a little less translucent.
Right now they're a little hard to see, though I grant that when you're used
to the layout it becomes much less of an issue.

Other than those two minor points it's very nice website & I hope to use it in
the future.

~~~
bfm
Thank you Michael for the feedback.

So far I've just tried it on FF, Chrome and Safari on Mac. Cross browsing is
on my list.

------
karterk
Very well executed. My only question is whether you have any definite ideas
for monetizing it, or just a project for learning and fun. Either way, awesome
job.

~~~
bfm
Thank you!

This project is just for learning and fun. No ideas yet for monetizing it.

------
roryokane
Small suggestion: when viewing one picture and its color scheme, put the “Hex
RGB HSL HSV” text next to the radio buttons inside <label
for="the_radio_button_id"> tags. This will provide a bigger hit-box for each
choice by making the text and the radio buttons, not just the radio buttons,
switch the color representation mode.

------
alexkearns
Is there anyway that you can specify a particular image, by entering the url
of the image, for example?

------
krmmalik
Genuine question (if anyone knows): This isnt a mockery or complaint, i'm only
an amateur DSLR photographer, but how does one actually take advantage of
these color palettes. I mean, what can they actually do for me?

~~~
swah
I think they are only useful to a designer which wants to extract color
schemes from pictures he enjoys.

A guy here told us the other day that he did this "manually" with pictures he
liked, for creating palettes for his projects.

~~~
krmmalik
I dont know if you use lightroom at all, but if say i want to create a preset
filter, could this data be useful for that?

I often see photographs that have had color processing work done in Photoshop
but can never quite seem to match them. I wonder if there is some way in which
this would help(?)

~~~
bfm
Never used Lightroom, but the presets on <http://goo.gl/wQ0PV> seem to be
formatted in json.

Seems like this presets can be created easily from a list of colors.

Interesting application.

~~~
krmmalik
Interesting. I'll have to explore this further. Thanks for the heads-up

------
color
Very nice site. I've used colr.org in the past, which does basically the same
thing. I have to say, though, the UI on colorapi.com is much better. Good job!
This site is bookmarked for use on my next web design project.

One feature request: the ability to upload images directly to colorapi.com.

Uploading images directly would allow designers to build a color palette to
match a corporate logo, use the same color palettes as movies (by uploading
images from <http://moviebarcode.tumblr.com/> ), etc.

------
krig
this is really great, well done. Finding some interesting colours from
surprising keywords. <http://colorapi.com/#!q/chipotle> ,
<http://colorapi.com/#!q/lapland> (for some reason showing a quite nice scheme
taken from a lego church), <http://colorapi.com/#!q/athens>

I've been playing around with node.js as well, lately. It really is very nice
for trying new ideas.

------
Silhouette
Interesting idea, but I'm guessing the UI is severely broken on
Firefox/Windows: all I'm seeing after a search is a long band of colours
scrolling across a tiny part of my screen, with no apparent way to see what
RGB values they are, which photo(s) they came from, or any of the other
interesting-sounding things mentioned by other posters here. What _should_ it
look like?

~~~
BobKabob
I'm using FF on Win. I think you need to key in a search term at the top, and
press enter, to see what others are seeing.

------
rwolf
It's so beautiful!

~~~
bfm
Thank you

------
atgm
It would be really nice if I could middle-click "details" to open palettes in
new tabs, or favorite palettes to come back to or even compare in a grid view
later.

I'm also really confused about the swatch download. It tries to download as
"default," and even if I change the file type to aco, I can't load it as a
swatch in Photoshop.

~~~
bfm
I'll add favorite colors support in the future.

What browser/OS where you using when you had the download issue?

~~~
atgm
Opera 10.11 on Windows 7 x64.

------
theone
A nice, gorgeous app. Definitely added to my collection. Interesting to see
these different color schemes.

There's one particular thing which I liked was that, it stores previous search
results. I wasn't expecting it in first place, But liked to see previous
search results.

One more thing, will there be any API access to this service.

------
gaoshan
That's really nice, Bermi. Good job. So what resources did you find useful for
learning to best use node.js?

~~~
bfm
Thank you!

I learnt Node.js mostly by looking at projects on github, reading Node.js API
<http://nodejs.org/docs/v0.4.2/api/> and following these two great resources
<http://howtonode.org/> and <http://blog.nodejitsu.com>

------
xutopia
Any chance you could switch the rgb value to something we can easily
copy/paste in CSS? rgb(128, 128, 128)

~~~
bfm
Thanks for the suggestion. I just changed it.

------
alexkearns
Stunningly brilliant. Develop a widget that other companies can put on their
sites, and charge for it.

------
sage
It looks great. I like how the settings controls are mostly invisible until
the mouses over.

Here are some ideas for additional features:

1) Let a user load their favorites from Flickr and show the palette for each.

2) Create a bookmarklet than can be run on Flickr photo page to bring up the
colorapi.com page for that photo.

~~~
bfm
Thanks for the suggestions this is something it will certainly work on.

------
theunknown21
This is honestly really cool. This reminds me of the Adobe Ideas iphone app
that lets you import photos to get a color swatch (but still doesnt let you
export them!!). I'm curious what you're using to host your app?

~~~
bfm
Thank you. The app is hosted on <http://no.de> Its a Solaris server with just
128RAM and 5GB HD

------
tropin
It would be cool if it had an API, like the picture url and palette in JSON.

~~~
stagas
I was expecting to see an API too, with the name being colorapi and all.

------
Tycho
This is absolutely brilliant. The interface is very intuitive. Was node.js
instrumental in making this work, or did you just want an excuse to learn it?
(ie. rather than use a different server language)

~~~
bfm
Event driven development was instrumental. Back in 2007 I coded a similar
project in PHP and had to take the app offline because it was painfully slow
for end users.

I'm sure you can do something similar in any language by using something like
RabbitMQ.

------
the3dguy
Sorry if someone already asked this, but could you release the source code for
this project if it was just a learning experience for you? We could all learn
from this and would appreciate it.

------
PeterMcCanney
A great product.

I've been doing web design since 1997 and this is one of the most useful
online tools for colour inspiration I've seen.

Your naming structure for the downloadable swatches is a nice touch.

------
makethetick
This is a great tool to get colour scheme ideas from using 'real life' colour
combinations. Well done!

~~~
bfm
Thank you!

------
cubtastic71
Sweet - this is definitely getting bookmarked to use at work :) Very
refreshing interface and flow.

------
noonehome
Just typed in Brazil and loved the colors (and photos) returned. Thanks Bermi.

------
kingsidharth
I am officially switching from kuler to colorapi!

------
snissn
sample searches always help

------
dpkendal
Very, very well executed idea, with one exception: hashbang URLs. Really?
Reaallly?

