Smart Thumbnail Cropping

Scaling an image down to a thumbnail size is a common practice when hosting it on websites to reduce page load time and save bandwidth and so on.. But very little has been done in optimization of those thumbnails from a human view-ability point of view. Human view-ability, what? Take a large image where background covers the major part of the image and shrink it down to a thumbnail size (say 192 px) and notice that the details of the image is subdued by the background.

To solve this problem of smart cropping, I am using a variation of descriptors and image processing tricks to extract only the most feature rich part of the image and preserve the aspect ratio while cropping the image. Following are the test results of algorithm used:

Sample 1
Original Thumbnail	Feature Extraction	Cropped Thumbnail
Sample 2
Original Thumbnail	Feature Extraction	Cropped Thumbnail
Sample 3
Original Thumbnail	Feature Extraction	Cropped Thumbnail

So what's in the pipeline:

• Open source the image processing code
• Build a http handler (ASP.NET http handler) for dynamic cropping

Thoughts?

Event Viewer - Image Search

"Event Viewer" is an yet another attempt to visualize images similar to my {re}Search Timeline project.
Demo at : http://karthik20522.github.io/EventViewer



The whole point of this proof-of-concept project is to visualize the images from the perspective of the events rather than just displaying an grid of images. For example, a search on GettyImages.com website basically displays a list of images in a tabular fashion which provides no sense of association between individual images being displayed. But having them grouped together as part of an event provides a sense of association and correlation between images.

Displaying images is always a tricky business. A dominant color filter technique could probably provide an alternate way of scanning thru images as user might be more interested in images of particular color than the fine details of an image.

From a technology standpoint for building this project was nothing special.

• ASP.NET MVC 4 - Razor
• Amazon SQS - for event scrapping from GettyImages
• Connect API for event and image detail lookup
• MongoDB
• Dominant Color Extraction

Source code at: https://github.com/karthik20522/EventViewer

Development Stack and stuff

For the past year or two, I had been dabbling with different technologies, frameworks looking for an ideal combination of frontend, backend and development tools. Following are what I tend to use and recommend for both personal and consultancy projects.
I usually customize most of these open-source projects as per my needs

Project Management

• Asana - https://asana.com

Database

• MongoDB

CMS

• Calipso - http://calip.so/

Bulletin Board

• NodeBB - http://nodebb.org/

Configuration Management

• Etcd - https://github.com/coreos/etcd

Logging and Analysis

• Logstash - http://logstash.net
• Kibana - http://www.elasticsearch.org/overview/kibana
• Log.io - http://logio.org

Search

• ElasticSearch - http://www.elasticsearch.org
• Algolia - http://www.algolia.com

Source Control

• Github – http://github.com

AWS – Amazon Web Services

• SQS – Simple Queue service
• SES – Simple Email Service

Hosting

• Rackspace / Amazon
• Digital Ocean - https://www.digitalocean.com

Image processing

• GraphicsMagick with Node API - http://aheckmann.github.io/gm/

Development Tools/Frameworks/Languages

• .NET
  • ASP.NET MVC
  • ASP.NET WebAPI for REST services - http://www.asp.net/web-api
  • Dapper.NET or Simple.Data for SQL ORM’s and MongoDB CSharp Driver for MongoDB access
  • FluentSecurity for user authentication and roles http://www.fluentsecurity.net/
• NodeJS
  • NodeProxy for proxy and load balancing service
  • Node Cluster for Multi Node process
  • Node Express Boilerplate - https://github.com/mape/node-express-boilerplate

Misc Libraries and websites

• ASP.NET Razor Helpers - http://www.mikepope.com/blog/documents/WebHelpersAPI.html
• OverAPI - http://overapi.com/
• JQuery Plugins - http://www.unheap.com/
• MicroJs - http://microjs.com/