Greasemonkey & Web Design

by Luke Wroblewski May 17, 2005

As a Web interface designer, I’m watching the recent torrent of Greasemonkey scripts with great interest.

For the uninitiated, Greasemonkey is a Firefox extension that allows users to load custom DHTML scripts that modify a specific website anytime they visit it. “Greasemonkey allows you to fix website annoyances or add desired functionality missing from a site. Additionally, the scripts can bring content from other sites and resources and embed them into the page you are viewing.”

I guess my interest in Greasemonkey is tri-fold:

  • As a new form of User Needs Analysis
  • As a means of Improving the Web Experience
  • How it impacts content/site/interface/etc. Ownership (and responsibility)

User Needs Analysis

Greasemonkey provides a very interesting way to learn what changes or feature additions users want from Web sites. As Chris Palmieri put it “Site developers could mine [the library of Greasemonkey scripts] for new feature ideas and get instant feedback on what's frustrating people or what's missing from their product.”

“Greasemonkey enables people to remix the web. You are giving control of people's browsers back to users. There's always a balance between what a website designer wants people to be able to do and what they are actually doing, and Greasemonkey swings it very firmly in the direction of the user." –Wired, May 2005

A great example is the seamless addition of Persistent searches (a.k.a. saved searches) to Gmail. As the author put it: “While one doesn't normally think of web apps as having such advanced power user features, it recently occurred to me that it should be possible to add persistent searches to Gmail”

Improving the Web Experience

Let’s look at how Greasemonkey “allows you to fix website annoyances”. Mark Pilgrim developed a script that allows users to resize any text area input. Gone are the days when a small text box limited your ability to post a lengthy comment within a Web form:

Zoom Textarea alters web forms to add a toolbar above every textarea element (used for entering multiple lines of text). The toolbar lets you increase or decrease the text size of the textarea, without changing the style of the rest of the page. The buttons are fully keyboard-accessible; you can tab to them and press ENTER instead of clicking them with your mouse.”

While Zoom Textarea address a usability problem, FoxiPod significantly simplifies a multi-step process: “FoxiPod uses Greasemonkey to add special links next to any MP3 or other Music file on every Web page. When you click on the icon, the music file is immediately downloaded by the FoxiPod application and added to iTunes or to your iPod.”

A Greasemonkey concept I mentioned a few weeks ago attempts to address the problem of information overload when shopping online. As users browse multiple e-commerce sites, a Greasemonkey script can store the products they have seen and remind them when they encounter the same products again at a different site. Think of it as cross-site comparison shopping based on user actions.

Ownership

A very interesting discussion emerged around Dean Edward’s article on How To Disable GreaseMonkey On Your Web Site. As Dean put it “You see, GreaseMonkey broke my site.” To which one of his readers replied: “I am sorry, but once your code leaves your server, it is no longer ‘your DOM’ but the ‘user’s DOM’ and they can screw with it as they please.”

The question of ownership also becomes interesting when one looks at examples like Premshree Pillai’s addition of a Yahoo! Search tab to Google: “I use Google as my primary search engine. However, nowadays, more often than not, I tend to use Yahoo! Search too. After I search using Google and I’m not satisfied with the results, mind you.”

Carlo Zottmann’s BetterShopper (a Firefox extension -not a GreaseMonkey script) “will look up the prices of the currently displayed Amazon product in over a dozen stores across the web, and then it'll display those (in multiple currencies) in a neat little box right there on your current page. All that without the need for you to leave Amazon.” Jesse Andrews' Book Burro accomplishes a similar effect with Greasemonkey (minus the currency exchange).

It’s examples like these that led Nivi to comment Greasemonkey “is going to blow up business models.” Not that business models will be blowing up tomorrow, Greasemonkey is still in its infancy and only available to Firefox users (though Internet Explorer versions are in the works). Still, keeping on eye on how the Web is being changed by its users is a worthwhile exercise for any Web designer.