TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

How We Built a Cutting-Edge Color Search App

43 pointsby mattangriffelover 11 years ago

11 comments

joshdotsmithover 11 years ago
This is really awesome. For anyone who wants a naive, poor man&#x27;s implementation of this, I have an unfinished Ruby gem that&#x27;s a good starting point for you: <a href="https://github.com/JoshSmith/kaleidoscope" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;JoshSmith&#x2F;kaleidoscope</a><p>Here&#x27;s how I got it to work (cribbed from my own README):<p>TL;DR: I used k-means clustering to segment a database of images into color bins for quick searching.<p>Using imagemagick, I ran histograms on images and converted their top n most frequent colors into L<i>a</i>b* color space for an approximate representation of human vision.<p>Colors were then matched to a user-defined set of colors using Euclidean distance, i.e. a &quot;bin&quot;. I could choose any array of RGB values of arbitrary length.<p>I then stored hexadecimal values of the image&#x27;s original color and the matched color, along with the frequency of that color within the image (for sorting based on frequency) and the Euclidean distance (for sorting by tolerance).<p>Then finding images close to a certain color was as simple as Photo.all.with_color(&#x27;#993399&#x27;) and order by frequency and Euclidean distance. Here&#x27;s a photo of the results: <a href="https://github-camo.global.ssl.fastly.net/89cc87ac84cd3a1d1223e8f9d560e65eb8447ef6/687474703a2f2f636c2e6c792f696d6167652f336e3243313631373069306b2f53637265656e25323053686f74253230323031332d30322d30352532306174253230362e35362e3434253230504d2e706e67" rel="nofollow">https:&#x2F;&#x2F;github-camo.global.ssl.fastly.net&#x2F;89cc87ac84cd3a1d12...</a><p>I might spend some time reverse-engineering Shutterstock&#x27;s implementation, since it sounds way better than mine and clearly works at scale. But for my purposes, my own implementation worked just fine.<p>If you want help implementing it, feel free to reach out to me!
评论 #7173433 未加载
评论 #7173521 未加载
darshamover 11 years ago
Reminds me of TinEye&#x27;s multicolr demo [0] that searches through CC-licensed images on Flickr. Their multiple color feature was really nice (however they don&#x27;t have shuttershock&#x27;s keyword filtering.)<p>I wonder if anyone ever bought TinEye&#x27;s color-search-engine-as-a-service [1]. The as-a-service model seems really awkward for something that requires so much integration, and this new shuttershock feature (developed from the ground up) seems to confirm this.<p>[0] <a href="http://labs.tineye.com/multicolr" rel="nofollow">http:&#x2F;&#x2F;labs.tineye.com&#x2F;multicolr</a><p>[1] <a href="http://services.tineye.com/MulticolorEngine" rel="nofollow">http:&#x2F;&#x2F;services.tineye.com&#x2F;MulticolorEngine</a>
评论 #7173447 未加载
basseqover 11 years ago
I think the next step for them is to cluster by similar images. A green hue, for instance, shows a lot of similar-looking pictures of leaves—better to show one picture and have a &quot;show similar images&quot; feature to dig into a finer level of variance.<p>V. cool, though.
评论 #7173633 未加载
frikover 11 years ago
Airliners.net had something similar since 2005.<p><a href="http://www.airliners.net/similarity/" rel="nofollow">http:&#x2F;&#x2F;www.airliners.net&#x2F;similarity&#x2F;</a><p>It was on Slashdot back then: <a href="http://tech.slashdot.org/story/05/05/04/2239224/searching-by-image-instead-of-keywords" rel="nofollow">http:&#x2F;&#x2F;tech.slashdot.org&#x2F;story&#x2F;05&#x2F;05&#x2F;04&#x2F;2239224&#x2F;searching-by...</a>
clbeckerover 11 years ago
Thanks to the Hacker News Gods, my account is no longer blocked on here. I&#x27;m happy to answer any questions about the original blog post.
kfkover 11 years ago
Is somebody thinking on applying this to a different stock photo model? I mean, I have heard shutterstock takes a big cut and pays very little to photographers. Nobody out there with these innovative ideas but with a business plan more friendly for photographers?
carlobover 11 years ago
The three sliders here correspond to averages of the three LCH channels. Has anyone thought of looking into the second moments of those? As in variances and covariances in order to get high contrast in luminance or high contrast in hue…
frikover 11 years ago
&quot;the prototype had over 20 sliders to control all the visual attributes&quot;<p>I cannot read the slider labels, the screenshot is very low-res :(
评论 #7173360 未加载
评论 #7173649 未加载
abvdaskerover 11 years ago
This is incredibly cool. Shutterstock has done a great job in creating a beautiful product to address a fun problem. Kudos.
bpphillipsover 11 years ago
Neat! It&#x27;d be nice to see some more discernible screenshots of the prototypes to compare with the final version.
iterableover 11 years ago
this is dope. Shutterstock is bomb