Erik Gibb
Interaction Design

Musicbank required the user to validate her CDs using a Windows application called Bank-It. If the CD was valid, it would be added to the library where the user could view and play music on the web. I documented the different states of valid/blocked/unrecognized CDs and Tracks with rationale behind the choices, basic graphic explorations, and recommendations for placement.

(This is a pdf)

Continue reading “Musicbank: Library Status Icons” »

Musicbank needed to provide hooks in the user experience to bring people to the point of purchase. The service enabled a free trial which moved to a stream-time-based structure. This document describes where and how user’s would be prompted so signup, along with describing fun edge cases like “What happens if your clock runs out in the middle of a track?”

(This is a pdf)

Continue reading “Musicbank: Subscription Upsell Entrypoints” »

Musicbank was in a highly limited alpha, but we would have to charge for the service once we went public. We were given one week to design and implement an interface that allowed the user to choose from a variety of service plans, enter payment information, preview their order, process the order, and provide a receipt for the interaction.

(This is a pdf)

Continue reading “Musicbank: Subscription Payment Model” »

Musicbank’s first iteration was a very simple interface that sorted albums by album name. We obviously needed different ways to navigate the system. The first feature upgrade allowed the user to sort the entire collection based on either artist or genre, with various display bells and whistles.

(This is a pdf)

Continue reading “Musicbank: Library Sorting” »

Musicbank allowed user’s access to streamed tracks after they scanned their CDs using a simple Windows application. When the user inserted a CD the application would identify the CD by comparing it;s table of contents to cddb.com. At this early stage of online music access there severa issues we needed to address:
The legal quagmire surrounding internet media distribution meant that none, some, or possibly all the tracks on any given CD could be “blocked” by the publisher.
A CD may or may not be recognizable
A CD might be recognized, but we didn’t have the CD encoded yet.
Etc…

When we figured out those issues, I made a recommendation on error messaging that would help set expectations for the user.

(This is a pdf)

Continue reading “Musicbank: Scanning CDs” »

Netscape migrated from Meeting Maker to it’s own Calendar product. Before I joined, the team was asked to build a training module that served new users, but was particularly friendly for migrating users.

The Calendar Zone training module featured a Twilight Zone spoof theme with a training host named Rodzilla, a cleverly disguised Mozilla sporting a Rod Sterling Pompadour. (Mozilla was Netscape’s dragon mascot. Once a beloved character on the netscape.com website, he retired from public life in ‘98.)

I was responsible for upkeep of the module as new features were added to the product. I also added some javascript whizbang to the navigation that

• Kept the nav in sync with the content
• Cued the user where she was in the training (via the iTunes-like dots. Perhaps Apple was inspired by my work?)
• Allowed random access to content.

Continue reading “Netscape: The Calendar Zone Training Module” »

BuyerX was the e-commerce internal procurement system built on Netscape’s Application Server. It was a complex application used by almost everyone in the company. We were asked to build a training module to serve casual and dedicated users.

Calling on our team’s past successes, I concepted and prototyped “Buyer X Files: The truth is in here” featuring

• An arch theme, comfortably fitting into our popular suite of similarly spoof-based training
• Training hosts—”Agents Skoldy and Molder” were icebreaker characters asking both “dumb” and advanced/related questions which provided the human voice
• One of my more imaginative visual designs (Not my forté)
• Navigation that guided casual users needing a quick answer, as well as dedicated users requiring deep knowledge of the full product.
• “Advanced” (for the time) implementation featuring user cues like rollover buttons, javascripted menus and navigation, and a fully liquid layout.
• Common sense help content organized by functional application roles

Continue reading “Netscape: BuyerX Files Training Module” »

Our team was responsible for the creation, care, and feeding of all mission critical intranet sites, like the company address lookup, department sites, and IT applications. We traditionally maintained the primary portal page allowing access to the dozens of sites in our group along with the hundreds of other unofficial sites hosted around the company.

We were asked to concept and build an intranet portal that showcased features of the newly released Netscape 4. We treated this as an agency project, breaking into 3 teams to pitch different concepts. IT management helped narrow down the field to the MozHome Intranet Remote Control concept. I provided assisted with information architecture, lead interaction and visual design efforts, and prototyped some of the simpler functionality (Using an image mapped transparent layer above the non-square shaped buttons to create unique rollover effects and switching the search tabs.)

Key features of the remote included:

• A tear-off search bar thanks to a signed jar file which floated on the user’s desktop like a real application
• Dropdown menus providing deep links to information that was commonly requested, organized in ways that our testing indicated intranet user’s would find most comfortable
• A promotional area of triangular buttons
• A scrolling news pane
• A training mode providing rollover help for the entire panel

Continue reading “Netscape: MozHome Intranet Navigator” »

In Musicbank’s quest for cash, our executives asked us to demonstrate a shopping cart to potential investors. “Chimay” was an internal tool used by our developers to search the music library and add item’s to a test account. I did a quick and dirty recommendation for redesigning the tool to integrate it in the existing application flow and make it appear more consumer friendly for the demo.

(This is a pdf)

Continue reading “Musicbank: Music Shopping Cart” »