unofficial Google Image Search by Drawing

How To

Draw and Search

• Choose a color.
• Draw something.
• Adjust pencil size with the range slider.
• Choose another color.
• Draw some more.
• Click on the "Search by Drawing" button.

Drag'n Drop, Draw and Search

• Drag and drop an image from your computer into the drawing area.
• Wait a second.
• Draw something on the picture.
• Click on the "Search by Drawing" button.
• This works only in Chrome and Firefox, not Safari.

Take a picture

• You need to have Flash installed.
• You need to have a webcam.
• If you don't have a webcam or Flash installed, this won't work and you won't see anything.
• Below you should see a Flash window.
• Click on "Allow".
• Now you should see yourself.
• • If you don't see yourself, please go to "Webcam Troubleshooting"
• Click on the "Take a photo" button.
• Wait a few seconds.

Take a photo

Webcam Troubleshooting

• Sadly we have to use Flash to access the webcam.
• Sadly Flash is a very buggy software.
• So there is no guarantee for success.
• Right click (on the Flash area) -> Settings
• Click on the ugly webcam icon on the right hand side.
• Select another webcam in the drop-down menu.
• Click on close.
• Wait a few seconds.
• If nothing shows up, try it again with another camera in the drop down menu.
• And then again.
• And again.
• Hope it works now.

Add a color

• Enter a color hex value #
• Click on Add Color
• Scroll up to the color gird.

Change the brush size

• Use the scroller below the drawing area.
• (Or the drop down on FireFox)
• Alternativly you can set the brush size here px
• Click on Change Brush Size
• Scroll up to the drawing area.

FAQ

• • Does this work on iPads, iPhone, tablets, Androids, ...?
  • It should, sadly it doesn't. Google offers a tablet/mobile experience for some mobile/tablet devices. This experience sadly redirects users from the "Google Search by Image" search page to the Google homepage. The bug is already reported to Google. You can star it to make it more prominent.
• • Does this work with Internet Explorer 6/7/8/9/10/...?
  • No, yes, I don't know. I don't care. Get a real browser!
• • Is this an official Google product?
  • No, this is totally unofficial .
• • Is this site affiliated with Google?
  • No.
• • Are you a Googler?
  • No.
• • Then why is the "Google" on top of the page?
  • It's a homage and the main image search action happens via Google Search by Image.
• • Who created this?
  • I did. Well kinda. I glued it together. The "Search by Image" functionality is provided by Google. Accessible via a simple URL. The canvas drawing thingie is a fork of drawingCanvas by a guy called balaclark. The Flash webcam thingie was created by taboca.
• • How does this work?
  • You mean technically? Quite simple actually.
    • You draw something on an HTML5 canvas.
    • Click on Search
    • Image gets converted into a base64 encoded data uri
    • Image data gets send to server (powered by Heroku)
    • Image gets uploaded to Amazon S3
    • The Amazon S3 Image URL gets communicated back to your browser.
    • Browser gets redirected to Google Search by Image.
• • Who are you?
  • Franz Enzenhofer - Github, Hacker News, Twitter, Google+ and i even have a Fan-Page on Facebook.
  • And www.franz-enzenhofer.com
• • What technology did you use?
  • • emacs
    • HTML5 canvas
    • HTML5 drag/drop API
    • CoffeeScript
    • jQuery
    • socket.io
    • node.js
    • Heroku Cedar Stack
    • Amazon S3
    • Flash
• • Does this work over all browsers?
  • No, i tested it on Chrome, Safari, Firefox on Mac.
• • Can i fork it?
  • Sure. (Docs to come.)
• • Thx
  • You are welcome.