Innovation

Why I love Readability, with screenshots

February 23rd, 2010  |  Published in Design & Usability, Firefox, Innovation, Productivity, Reading, Web, Work, add-ons

Readability is a Firefox add-on that improves the experience of reading long articles in your browser by getting all the extraneous cruft out of the way. I use it every single day and love it to bits.

Here, for example, is a screenshot of what a typical Harvard Business Review article looks like in Firefox (Persona: Save the Bees Plz by monorail cat):

Old Crufty
before-readability

With the Readability add-on installed, all I have to do is hit a quick keyboard shortcut (alt-cmd-R) and the page will reload and be reformatted by Readability. It looks like this:

New Clean
after-readability

It’s just so, so much better. arc90, you have made a great thing. Thanks :)

Feedly – Awesome feed reader add-on for Firefox

September 3rd, 2008  |  Published in Firefox, Innovation, Internet, Web, Work, add-ons

I read a lot of web feeds. Hundreds of feeds bring me thousands of stories on all manner of topics every day — Mozilla stuff, food and cooking, photography, gaming, news, technology, literature, writing, politics, business, innovation, design, etc. Feeds are how I get almost all of my news, whether it be local, national, or international. It’s how I view my friends’ blogs and my Flickr contacts’ photo streams. Feeds keep me up to date on most forums and newsgroups I follow, and they’re the first place I turn when I want to waste some time catching up on my entertainment news or to see what’s up at the renovation/interior design blogs I read. Feeds are, by and large, how I access the vast majority of the Web content I consume.

Until a few days ago I have been using the Vienna feed reader for Mac OS X. It’s a pretty decent workhorse of a reader with a standard email-client-like user interface, the ability to group feeds into folders and subfolders (and sub-subfolders), and all that. It has always frustrated me, however, that my feedreader — through which I consume the majority of my Web content — wasn’t part of Firefox. In fact, I could go so far as to say that Vienna was on close to equal footing to Firefox as my core tool for accessing the Web. This has always struck me as somewhat ridiculous, so I’ve played with all sorts of tools for reading feeds via Firefox, whether they be add-ons or web-applications or what have you. None have ever been compelling enough to switch me away from Vienna until now.

Feedly Screencap

I’ve discovered Feedly, you see, an incredibly slick Firefox 3 add-on that’s been in development for quite some time.

While I’ve only been using Feedly for just over a week now, it has already completely streamlined how I manage, view, and deal with my feeds. Brilliantly, Feedly leverages the existing Google Reader web application as its back end, and throws in added functionality, other service integration points, and a significantly improved UI for good measure. It installs as quickly and easily as any Firefox add-on, displays your feeds in their own tab, and essentially integrates your entire feed reading experience right into your Firefox. Feedly is almost exactly the sort of tool I was hoping to find, and while it does still have a few bugs and rough edges, it’s by far the best feed reader I’ve used to date.

Check it out: Feedly at Mozilla Add-ons.

Education evolving…

August 13th, 2008  |  Published in Education, Innovation, Internet

Cool article over on Ars Technica: Prof tweets about course, ends up moving whole class online.

AwesomeBar is awesome

April 17th, 2008  |  Published in Firefox, General, Innovation, Mozilla, Work

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:

Firefox 2's URL bar - less awesome than AwesomeBar

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:

Firefox 2's URL bar - less awesome than AwesomeBar

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:

Firefox 3's AwesomeBar in action - one keyword

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:

Firefox 3's AwesomeBar in action - two keywords

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

Firefox 3's AwesomeBar in action - three keywords

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:

Most interesting, useful, or innovative add-ons?

July 12th, 2007  |  Published in Browsers, Firefox, Innovation, Web, Work

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.

Quote of the day

May 25th, 2007  |  Published in Innovation

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.

Interesting blog

May 24th, 2007  |  Published in Design & Usability, Essays, General, Innovation

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.

Coolest shopping cart ever

April 28th, 2007  |  Published in Innovation, Web Development

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:

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):

Dragging a 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:

Poof

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