At the 2007 SIGGRAPH conference, an annual convention for computer graphics specialists to discuss new computer graphics techniques and applications, Shai Avidan and Ariel Shamir of Mitsubishi Electric Research Laboratories demonstrated an innovative new method for resizing the dimensions of images. The new method, called content-aware image resizing, preserves the size and visual quality of the more important regions of the image by sacrificing accuracy in the less important areas. It’s difficult to describe in words alone, so here is a video from the creators illustrating the impressive results:

Classic resizing methods work by removing vertical and/or horizontal columns of pixels at regular intervals as needed to account for the difference between the original dimensions and the desired dimensions. As you shrink the image, you inevitably lose some of the detail. If the image consists of a single person and some unimportant surroundings, you could maximize the detail of the person in the resized image by first cropping out some of the surroundings so they don’t take up the precious pixel real estate in the final image.

But what about when an image consists of a person and a house with some featureless landscape in between? In order to preserve the detail of the person and the house, you would ideally want to remove some of that space between them. Simply cropping out that space and shoving the two sides of the image together would leave a very apparent and ugly division in the middle. There isn’t any good solution using classic resizing and slicing methods.

This is where content-aware image resizing comes in. Rather than just removing entire columns of pixels at regular intervals, this algorithm analyzes the image and determines the least noticeable sets of pixels to remove. It does this by calculating the “energy” of pixels. The energy relates to the relative visual importance of those pixels (in other words, how much the pixels stand out). By removing the pixels with the lowest energy, the image can be resized with minimal change to the most visually significant parts of the image.

There’s one more key aspect of the algorithm: Let’s imagine for a moment what would happen if it simply removed the lowest-energy pixels from each horizontal row. What if the lowest-energy pixel in one row were on one side of a house and the lowest-energy pixel on the next row were on the other side of the house? Suddenly, after removing those pixels, the edges of the house would be noticeably zig-zagged. So in order to also preserve the shapes in the image, the algorithm makes sure that it only removes pixels along continuous paths from one side of the image to the other side. The creators of this technique call these continuous paths “seams”.

This works great for shrinking images, but what about enlarging them? It turns out this algorithm is also well-suited for enlarging images. It follows the same procedure, except instead of removing the lowest-energy seams, it doubles them (with a little mixing to smooth them out). Since the seams are low-energy, doubling them has a minimal visual effect. In other words, the result doesn’t look nearly as blocky or blurry as it would with traditional resizing methods, and the sizes and shapes of the most important parts of the page are preserved.

The above video also illustrates how this concept can be used to convincingly remove whole objects from an image by manually forcing the algorithm to treat the particular object areas as being low-energy and then resizing appropriately.

An obvious limitation of the algorithm used in the above video is that it simply removes whole pixels rather than performing some sort of resampling. As I explained above, the classic resizing technique is to remove columns of pixels at regular intervals. While this is the fastest method, it also introduces significant visual data loss, even compared to other traditional resizing techniques.

Image resampling is a way to resize the image without completely discarding any pixel data, by instead calculating each pixel on the resized image as a combination of pixels on the original image. For example, if you were resizing the image to half its original height and width, each pixel on the resized image would be an equal mixture of four pixels (two by two) from the original image.

The content-aware image resizing algorithm could be modified to incorporate some aspect of this technique, by condensing pixels near the seams rather than stripping out the pixels entirely. This would probably improve the outcome of the last example in the above video, where the current algorithm’s limitations were quite apparent.

For more information, see the PDF. The download may be temporarily unresponsive since it has recently been linked to by several very high-traffic websites.

Update: Following the huge attention this new technique has received, co-inventor Shai Avidan has just been hired by Adobe, presumably to add this technology and other work to the popular Adobe Photoshop image editing software.

Web applications have been all the buzz lately. Traditional desktop applications for e-mail, calendars, and basic word processing have begun losing favor to the online versions you can use in a web browser. Google has so far lead the pack in web application development, and they have recently released a tool which will help take web applications to the next level.

Web applications have several advantages over traditional desktop applications. The data is stored at a central remotely-accessible location, so you can access it from any computer. The application is run within a web browser, so it isn’t dependent on certain operating systems or versions. The “software” itself is typically hosted by the vendor, so security updates and other improvements can be seamlessly deployed by the vendor without any user action or user responsibility. Companies like Google have more safeguards in place to prevent data loss than most users do, in case of hardware failure, cracking attempts, etc. Web applications are usually built on top of the well-established HTML, CSS, and DOM standards which may allow for better accessibility and user control over the presentation.

But along with these benefits, there are also some shortcomings to web applications. The data isn’t in the user’s control, so it may be difficult to manually move data in or out of some web applications. Although desktop applications have equal or higher potential for violating your privacy than web applications, it’s possible for advanced users and tools to monitor and control what your desktop applications are sending across the Internet; with web applications, it’s out of your hands. Software updates are typically done at the vendor’s whim, so you often don’t have the opportunity to review or prevent certain updates. Also, web applications generally require an Internet connection in order to function; if you’re on the road and aren’t near a hotspot, you may be completely unable to access your data.

Google has released an open source browser add-on called Google Gears which will help to address that last shortcoming. Google Gears sets up a local database and API on your own computer which web applications can choose to use for offline storage and functionality.

This is similar to a proposed feature of the upcoming HTML 5 standard, due in 2010, which the developers of the Mozilla Firefox web browser plan to implement natively by the end of 2007. Unfortunately, Google Gears does not use the model proposed in the HTML 5 drafts, so there is currently an issue of two competing standards. This is unusual, since Google usually works closely with Mozilla on contributions like Firefox 2’s fraud protection and Firefox 3’s upcoming malware protection. Whether or not Firefox or any other browser will end up supporting Google Gears’ API natively (without an add-on) is up in the air, and will probably depend on how widely Google Gears gets implemented in web applications, but Mozilla Technology Strategist Mike Shaver said that Mozilla wasn’t about to simply give up on the work already done on supporting the HTML 5 model. It will be possible for a browser to support both models at the same time if the browser developers choose to implement them.

For now, the Google Gears model is the only one of the two currently available to regular users, and it is available as an add-on for the Firefox and Internet Explorer web browsers on Windows, as well as Firefox on Linux and Mac. A Safari version is planned in the future. Google Gears is currently used by Google Reader’s offline mode, and more web applications are expected to adopt it in the future.

Feed-based website syndication has become popular in recent years, but there is still a lot of people who haven’t learned about it and the benefits it brings.

Website syndication is a way to read about all of the recent news articles, blog posts, and website updates that interest you all in one place. In a single view, you can read headlines and summaries of articles on all of your favorite news sites and keep up-to-date without having to browse through all of those sites one-by-one every day. It streamlines your reading experience.

To get started with website syndication, you need to get something called a feed reader. Two popular ones are Google Reader and Bloglines. Most of the newest web browsers even have simple feed reading capabilities built-in. For the purposes of this post, I will assume you are starting out with Google Reader.

Once you have your feed reader, you need to look for feeds on your favorite websites. Feeds usually come in either the “RSS” or “Atom” variety. The difference between the two is negligible for most typical subscribers.

Many websites that offer feeds will provide some link on the page itself. You may see a plain text “RSS” or “Atom” link like in the sidebar of this blog; you may see an orange or blue “RSS”, “Atom”, or “XML” button (in this case, XML is just another term for either RSS or Atom); or you may see the standard orange feed icon shown at the top of this article. If you find one of these links, make note of its URL — the web address you see at the bottom of the browser window when you hover your mouse over the link. You can copy it to your clipboard by right-clicking the link and clicking “Copy Shortcut” or “Copy Link Location”.

When you have a feed URL, add it to your feed reader. In Google Reader, this is done by clicking the “Add subscription” button on the left side of the Google Reader screen, then typing or pasting the URL into the box that comes up, and finally clicking the “Add” button.

If you’re using the Firefox web browser, it can help you out with the above process: When you come across a page that offers a feed, an orange feed icon will appear on the right side of your URL bar. Click on the icon. It’ll either bring you to a new page or simply display a small list of available feeds, in which case just choose one. You’ll now be on a page with the text “Subscribe to this page using” and a dropdown list. From that list, pick Google Reader and click “Subscribe Now”. Finally, on the next page click “Add to Google Reader”. You’re now subscribed to the feed.

Once you have subscribed to a feed, your feed reader will automatically check for updates every few minutes. Feeds with updates will be indicated in the left column. You’ll read the feeds much like you read e-mails. Feel free to play around in the feed reader; once you get used to it, it will increase your productivity and make reading your daily news that much more relaxing.

If you just want to subscribe to the Tech Center Current blog for now, here’s a quick button to hurry you along:

Most of us probably have lots of user accounts on various websites, complete with their own specific usernames, passwords, and other information. Over time, all of these different user accounts can become difficult to keep track of.

This is where OpenID steps in. OpenID is a system designed to give you just one username and password that you can use on any website (once enough websites support it). It can also make registering for new user accounts faster and easier.

Here’s how it works:

The first thing you do is sign up for an OpenID account from an OpenID provider. A lot of sites provide free OpenID accounts. MyOpenID is a popular one. The sign-up process is quick, simple, and familiar.

The OpenID provider will give you something called an “OpenID URL”. This is a web address that you will use for your username on OpenID-supporting sites. For example, my OpenID URL is dhammond.myopenid.com

Let’s say you want to sign up for an account on a website that supports OpenID. Take a look at http://jyte.com/auth/login as an example. In the login form, you will see an OpenID identity field, which looks like a regular username field but with the standard orange OpenID logo. In that field, you write your OpenID URL and click the “sign in” button.

When you click the button, you will be taken to your OpenID provider’s website where you fill in your password. You will then be returned to the site you came from (jyte.com in this example) and the site will complete the registration.

Basically, what this all does is establish a trusted connection between the site and the OpenID provider so you can keep your account details in one place — the OpenID provider. Once you have your initial OpenID account, you don’t have to worry about your username being taken on other sites because your OpenID URL is truly universally unique. And you know that your login password is the same for all of these sites because it’s only stored in one place. In fact, the various OpenID-supporting sites never even have to know your OpenID password; they instead get a separate difficult-to-crack “key” from the OpenID provider that is handled in the background.

OpenID has really taken off lately, with many big-name sites and products rushing to offer support for it.

• Firefox 3 will have OpenID management built into the browser.
• Microsoft is working on adding native support for OpenID in Windows itself.
• AOL and Yahoo! are developing OpenID identity providers similar to myopenid.com.
• OpenID logins are currently supported by ImageShack, Ma.gnolia, Technorati, Wikitravel, LiveJournal.com, blogs using the Movable Type blog system, and other sites. (See this list of OpenID-supporting sites for more.)
• Wikipedia and digg.com are among high-traffic sites that have announced plans to support OpenID logins in the near future.

The OpenID standards are published under very liberal no-cost licenses. The owners of the rights to OpenID have stated, “Nobody should own this. Nobody’s planning on making any money from this. The goal is to release every part of this under the most liberal licenses possible, so there’s no money or licensing or registering required to play. It benefits the community as a whole if something like this exists, and we’re all a part of the community.”

More information is available from the following links:

• Wikipedia article on OpenID
• Official OpenID website

Although it is significantly more difficult for a website to be written to support OpenID than traditional login systems, there is currently a lot of development work on library packages to manage this. I can see OpenID becoming very popular within the next couple of years if it can get enough early adopting websites.