Flog: The Official Fluid Blog

The Get Elastic blog had an interesting post last week on American Eagle’s (http://www.ae.com) incorporation of product merchandising elements within the drop down layer of its product catalog navigation (http://www.getelastic.com/merchandising-in-navigation). As the Elastic Path folks point out, it’s an effective technique for surfacing more product content without a click or a separate page view. It also obscures a lot of content and can impair overall site usability.

The technique inspired a lot of discussion at Fluid. Our typically crotchety CTO had this to say:

“I find it mildly interesting, but more of a distraction than a benefit. When I use navigation, I typically know where I want to go or quickly want to scan the options. It’s like going into a Macy’s and seeing a big ad for something random on the floor index when I’m looking for shoes. Really? Do you really need to distract me there as well? Maybe I’ll forget about buying the shoes altogether…”

While our Director of Information Design countered with his own take on balancing the needs of the retailer with those of the audience:

“I think that American Eagle’s implementation could be improved, and I agree that the size of the banner distracts, but I also think there is great value in merchandising like this. It’s definitely possible to do something less obtrusive and more integrated - a more natural extension of the navigation rather than an additional banner tacked on. There is a definite business potential here for popular online retailers who can get manufacturers to pay for placement like this, with the benefit of getting their product and brand recommendations in front of more eyes. Taking it one step further the retailers, in turn, could use this incremental revenue to keep shipping costs low or free.”

And finally, from a member of the design team:

“I agree that this is really interesting from a merchandising point of view but the UI is super busy and visually just taxing. It would be interesting to know if people are actually clicking through on any of these and how it’s effecting their overall site conversion rate.”

Personally, I agree - the UI is busy and ultimately distracting. But I am also not the target consumer. That would be teenage boys and girls, for whom I suspect visual clutter and informational density is a plus. Not to mention the “Hey, I wasn’t expecting that! Cool!” factor.

Apple has rolled out a wonderfully innovative and deceptively simple approach to search on apple.com. As you begin to enter your search term a dropdown window appears below the search box with recommended matching results. As you continue typing, the results list dynamically updates with a refined list of results that most closely matches what you are typing.

There are never more than eight results, and each is accompanied by a clear title, brief descriptive text and either a product image or recognizable icon (a green plus sign in a white circle for support topics, for example). It’s instantly scannable and completely non-intrusive. Most importantly, the performance of the search is impressive. Over a DSL connection it updates in nearly realtime, just a split second behind what you are typing. There is a rarely a lag, and good thing because the experience would fall part if there was.

If you hit enter at any time, you get dropped into a typical search results page, but that was hardly necessary. For 90% of the search terms I tried I was able to find what I needed without ever leaving the homepage. Combine that efficiency with a compelling, quality visual presentation and you have incredibly satisfying customer site interaction experience.

Quite possibly one of the best site search innovations since parametric filtering.

At the recent Shop.org conference we got a look at an interesting new outfit builder put together by, Oli a retail fashion site in the UK:

http://www.oli.co.uk/

They have really done a nice job with interaction design here. The Look Book bar is anchored to the bottom of your browser window and stays with you as you navigate the site. Every item in the catalog has an “add to look book” link, making the process for adding items fairly smooth, although a visual confirmation an item has been added to your Look Book would be a plus.

Upon opening the Look Book you enter a full screen environment that is intuitive and easy to use. Just drag-and-drop items from the Look Book strip into a work area and you are ready to go. Of particular note is the ability to scale individual product images so you can actually build a visual representation of an outfit with the correct proportions. The ability to add an entire outfit or collection to your cart at one time is another nice feature. Importantly, price and product detail information moves with the product and is available at any time.
The one thing that doesn’t work is adding individual items to your cart. The “buy” link is hidden behind an “i’ information button - not obvious enough. It would also be better if you could browse and add items to the Look Book while in workspace mode as opposed to having to go back to more traditional catalog browsing.

Overall, nice job.

– KD