user interface design for the web

Dealio

Dealio comparison shopping toolbar

Dealio is an online shopping comparison toolbar. Once installed into a buyer's web browser, it stays out of the way until the buyer lands on a page showing a product and a price. An alert appears if the Dealio database finds a better price, either at another online retailer or on eBay. Buyers can also search the database directly from the toolbar.

Challenges

  • Toolbar real estate is limited, so we had to pack a lot of features in a small space.
  • We had to keep Dealio useful enough to users who weren't shopping at the time to be worth its footprint.
  • We needed to make the alerts highly noticeable without being annoying or interrupting a user who was still reading the product page.
  • We wanted a distinctive branded appearance that still looked like it belonged in the browser chrome.

Solutions

  • We used a toolbar tall enough to accommodate two lines of text for the Best Price alerts and the Deals of the Day features.
  • I designed a sliding panel to keep the Deals of the Day feature in view when the toolbar was idle, which slid aside to make room for a search box affording one-click access to Dealio, Google, and eBay searches.
  • Early versions of Dealio had a "flashing toolbar" alert which I modified based on usability testing to be peripherally visible but not obnoxious. The current version includes an alert which slides up from the lower right corner of the screen, allowing more room for information and a photo of the product.
  • I used a subtle, pearly gradient which blends well with the IE7 chrome and matches the current Dealio.com website aesthetic.