dria.org

In Firefox 3 the URL bar is being completely revamped in extremely exciting ways. In Firefox 2 the URL bar is fairly staid and plain, giving you a drop-list of recently-visted URLs and partial page titles. If you started typing in the Firefox 2 URL bar, it would generate a drop list of URLs whose domains matched what you were typing, like so:

It would only match the start of the domain, however, so typing “mozi” would only list URLs that started with “http://www.mozi…”, which doesn’t include things like “http://developer.mozi…”. Those would only be listed if you started typing “developer” in the URL bar:

This is OK behaviour. If you happen to know the URLs of the pages you’re looking for, the Firefox 2 URL bar will help you out by giving you a list of URLs whose starting bits match what you’re typing. Saves a little time, and becomes a quick way to get back to sites whose URLs you have at least partially memorized. If you were hoping to revisit a site but you didn’t know how the domain started, you’d be out of luck and would have to resort to using one of the major search engines to look for it.

Enter AwesomeBar

In Firefox 3, however, the staid and plain URL bar has been transformed into a much, much more powerful and useful tool. Dubbed the “AwesomeBar”, it lets you use the URL field of your browser to do a keyword search of your history and bookmarks. No longer do you have to know the domain of the page you’re looking for — the AwesomeBar will match what you’re typing (even multiple words!) against the URLs, page titles, and tags in your bookmarks and history, returning results sorted by “frecency” (an algorithm combining frequency + recency).

Not only that, but the drop-list results show you the page’s favicon, the full title, the URL, and whether you have bookmarked and/or tagged the page in a richly formatted two-line display.

Here are some screenshots illustrating the magic. I tend to look up a lot of recipes on the internet, and the other day I wanted to find the recipe for a spicy ginger carrot cake I’d seen somewhere in my surfing. Here’s how the new AwesomeBar makes this unbelievably simple:

I start by typing “ginger”, and AwesomeBar searches through my history and bookmarks to return everything that matches that keyword, showing the first six and letting me scroll through the rest. You’ll notice here that several of the results are bookmarked (blue star icon on the right), and tagged (tag icon). The sites’ favicons are displayed on the left, making it really easy to scan through the results if you know what site you’re looking for in particular:

Instead of scanning and scrolling, however, I just add another keyword, “carrot”. AwesomeBar updates the list to show only the three results that match both these keywords:

Adding one more keyword, “cake”, narrows the list to just a single option:

Et voila. Out of thousands of entries in my bookmarks and history, AwesomeBar has found the single “ginger carrot cake” recipe I had read somewhere online in the past year. I had no idea which site it was on, so wouldn’t have been able to search by the site’s domain. Even Google wouldn’t have helped me here since this recipe doesn’t appear until the 8th page of results when searching for “ginger carrot cake”. AwesomeBar searches only my personal, local bookmarks and history, making it an incredibly powerful tool for finding pages that I’ve visited before and want to find again.

I’ve been using the Firefox 3 nightly releases for some time now, and I can honestly say that the new AwesomeBar behaviour has absolutely changed how I use the Web. Not having to remember URLs or resort to global web searches to find pages I’ve visited before has made using the Web a whole lot easier and more efficient.

So, yeah. AwesomeBar? Awesome. If you’re willing to play with not-quite-fully-baked software (by which I mean “beta”), you can experience the awesome yourself by grabbing the Firefox 3 Beta 5 download and testing it out.

Want to read more?
Edward Lee, the primary AwesomeBar developer, has written a bunch of blog posts over the course of AwesomeBar’s development:

• SmartBar to AwesomeBar - Nov 4, 2007
• Not Just Awesome - Jan 6, 2008
• Another Way to Awesome - Jan 19, 2008
• Beyond Awesome - Mar 3, 2008
• Using the AwesomeBar - Mar 11, 2008
• Awesomeness in Beta 5 - Apr 8, 2008

There are a lot of add-ons available for Firefox now, and I was wondering which you think are the most interesting, useful, innovative, or otherwise awesome. These don’t have to necessarily be your “favourite” or “must-have” add-ons (although they can be), just those that you’ve seen and played with and thought were particularly neat, useful, smart, or well designed.

Post a comment here (moderation is on, so it could take a while for your comment to show up) or email me privately at deb-at-dria-dot-org.

Technically quote of the day a few days ago, but I just read it:

“So the most creative people don’t have higher hit rates. They just make more stuff.”

This courtesy of the ever-fascinating Bob Sutton in his article The Power of the Prototyping Mind-Set.

I’ve been reading bits and pieces of the Design Observer archives all day, and expect to continue doing so for quite a while. Good stuff.

Every once in a while I stumble across some random bit of a web application that honestly causes me “surprise and delight”. Today was one of those days, and the thing in question is the shopping cart at the Panic.com Apparel store.

The concept is basic, simple, and brilliant — create a shelf at the bottom of the page to which the user can simply drag the items she wants. If she makes a mistake, simply drag the items off. When finished, there’s a nice obvious “Check out” button. It works extremely well, and they’ve gone so far as to add size bubbles to the items in your cart so it’s easy to check that you’ve selected the correct sizes. Very nicely done.

Here are some screenshots. First is the clear shelf:

This is dragging an item on to the shelf (you can’t see it, but my mouse pointer was over the little transparent t-shirt):

The last is dragging an item off the shelf — instead of just disappearing, it actually vanishes in a poof of smoke (exactly like the OSX dock, if you were wondering). Again, my mouse pointer was in the middle of the little poof of smoke there but my screencap cleared it:

Anyhow, kudos to the panic.com designers. I really like your shopping cart.