Content Aware Image Resizing

Image resizing has been around since the early days of paint programs, but the ability to be able to resize parts of a given image based whether it’s content is considered important is a relatively new technology. St├ęphane Roucheray’s Content Aware Image Resizing demo uses the canvas API to display the dynamically resized bitmaps, showing updates as the algorithm calculates which parts of the image should and should not be resized.

The spaceman isn't squished using this technique

The spaceman isn't squished using this technique

How does it work?
First, the algorithm generates a grayscale image from the source. From the grayscale image it generates an edge detection and energy map. The algorithm then runs from the bottom to the top of the energy matrix looking for the pixel with the lowest energy, creating what is known as a seam of least energy. This seam is then removed from the original image and the result is becomes the source image to repeat this process again until the image is of the desired size.

Try the demo!


Applications, Graphics
St├ęphane Roucheray
Posted on:
September 29th, 2009
Posted by:
Andi Smith



Your Rating:
1 Star2 Stars3 Stars4 Stars5 Stars

Works on

BETA Please let us know if you find Content Aware Image Resizing works in other browsers by leaving a comment below.



Broken link?

Posted on April 16, 2011

Add comment

(will not be published)