Timbuk2 bag builder breadcrumb & navgation
I’m in the market for a new laptop bag. On this Timbuk2 build your own bag page I found a very well done bit of UI.
It’s a breadcrumb, checkout process overview, a “you are here” marker, and navigation. The danger with combining all of 3 of these functions in one element is getting the link states right. Unfortunately Timbuk2 doesn’t get it quite right, albiet they’re very close, and I was pleasantly surprised with the functionality and informative nature of the design.
The only problem I noticed was the hover state still shows a hand, even if it’s not possible to click it and advance. This is the case specifically on the “Choose a bag” step. The other steps allow forward clicks to expedite the process.
Not sure I’ll get a Timbuk2 bag, but there a few compelling UI elements throughout their site that will surely bring me back for a second or third look before I decide.