AIAIO: Our Blog

The Ai office was abuzz today with the news of Amazon’s Kindle Fire. The new tablet appears to be the first competitor to steal the wind out of the iPad’s sails (and possibly iPad sales as well).

The overall sentiment around the implications of the product itself was a guarded excitement. Most of that excitement focused on the price, an appetizing $199.

It is only a matter of time before t-commerce reaches the tipping point that sends it into its boom. A sub $200 price tag could be that tipping point. If so, retailers with tablet-optimized UX will be the benefactors. With only a seven-inch screen, the Fire will put an even higher premium on the size of retail sites’ calls-to-action.

While the Amazon redesign may have overlooked many t-commerce UX fundamentals, one site that appears to be perfectly optimized for use on the Fire is the recently launched, MyHabit, Amazon’s partner in competition with Gilt Groupe. With large call-outs and a minimalistic design layout, the site appears to be tailor-made for use with the Fire (even down the the flash product videos, which will render on the Fire’s Silk browser).

After the (positive) sticker shock, the second-most exciting piece of news to come out of today’s Amazon press conference was the the Fire’s native Silk browser. Silk is a truly tablet-optimized browser that will split site rendering processing power between the tablet and Amazon’s cloud computing system. Using Amazon’s cloud as a type of “endless cache,” sites should render significantly quicker than they would using only the Fire’s dual core processor.

This type of “split browsing” (as Amazon is calling it) has huge implications for t-commerce. During this early period of tablet development, processing assistance is vital for optimizing page load times.

Ai has put a premium on designing sites for page load time optimization. Will this innovation make this optimization irrelevant? The answer is almost certainly “no” since even with the demo of the browser show some lag in load times. It could mean though that sites optimized for page load speed have comparable load times on Silk as they would on a laptop.

The one real certainty coming out of this news is that the future of t-commerce is getting closer by the minute.

Tuesday night marked the reemergence of the Ai trivia team, newly named “First Order of Business.”

Competing against 25 other teams, First Order of Business stayed in the running for an outright win all night. After putting up four solid rounds, including a perfect 10/10 round three, the Ai crew was only 4 point (answers) out of the lead.

Sadly the last round proved perplexing for our persistent pixel pushers. With only two correct answers, First Order of Business toppled down the leader board. The bonus question gave the team a chance to make the podium, but the team’s last ditch effort came up incorrect.

Ai finished 11th, in the top half of the pack, but five points behind their one-on-one opponents,”Cliff Clavin’s Mailbag,” who finished fifth.

For a sampling of last night’s action check out the questions below (the Ai team got all five correct).

Name the following US Presidents by their middle names:

1. Simpson

2. Gamaliel

3. David

4. Earl

5. Wilson

Answers Here

Congratulations to ”Cliff Clavin’s Mailbag” and the rest of Tuesday’s winners (and to anyone who knew who Gamaliel was).

When it comes to e-commerce there is no bigger name than Amazon.com. So when the world’s largest online retailer recently began rolling out a redesign to a small segment of its users, there was no doubt it would make waves.

A recent Wall Street Journal report speculated that the new site foreshadows the debut of a new Amazon tablet, citing the new site’s simplified feel and larger buttons. But when it comes down to it, the redesign still falls short on some t-commerce fundamentals.

Navigation

The new homepage has a much cleaner, more modern look. The new silver navigation and heavy use of white space definitely feel more up-to-date, taking cues from the Dieter Rams/Jonathon Ive school of desaturated minimalism.  This change emphasizes elements like promo images and the count of in-cart items, but raises an interesting challenge for the strength of Amazon’s brand as the formerly omnipresent blue and orange color scheme has been relegated to near nonexistence.

The majority of the redesign efforts seem concentrated in the top navigation, which has been simplified and improved with larger buttons. The biggest improvement UX-wise comes in the form of a navigational flyout that swoops out of the “Shop by Department” button. The menu’s bold black text on a white background look great on both monitors and tablets and the grey text blends in enough to not be obtrusive. The drop-down also includes the sexiest feature of the redesign with its new images hanging out of the menu itself over the page behind it.

Another nice touch on the new navigation bar is the shopping cart button that shows products (with images) in customer’s cart upon being clicked.  This is very UX and t-commerce friendly in that it lets users peek at their cart without interrupting the shopping experience.

Site Search

One of the biggest UX changes for the site as a whole is the new search bar, which takes center stage as the focal point of the improved top navigation. For a retailer with products as varied as Amazon, making the search the primary focus is in many ways ideal for a t-commerce interface. The first thing users will notice is the new drop-down that appears when clicked/tapped, displaying daily deals with accompanying images. This is a great use of an “Easter egg” to save space on the page below.

The search functionality has room for improvement in its predictive suggestions. The selectable terms on the type ahead search drop-down are still quite small, making this feature is among the least tablet friendly aspects of the new site. Not only are the search terms too small to tap (especially if you have big fingers), but there are too many of them. On an iPad the type ahead drop-down falls underneath the on-screen keyboard. A more user-friendly solution would be to give fewer options with larger clickable areas., not unlike the daily deals drop-down.

Hero Images

The redesign’s most drastic changes are immediately below the top navigation. With the former category navigation buttons on the left consolidated to the top navigation’s drop-down menu, the page takes on a two-column layout that is very thumb-friendly for tablet users.  Everything seems clearly and intuitively divided into buttons that can be easily pressed with thumb or the other.

The main hero image has been completely changed with the new look. The old Amazon has one hero image touting the latest Kindles. The new hero area has two stacked promos with slider navigations that allow for 13 total options. While one hero may not have been enough for Amazon’s merchandisers, 13 is a bit much to digest,  resulting is a sleek and navigable but unrefined hero scheme.

T-Commerce Shortcomings

When put into portrait orientation on a tablet, the new site is just as unusable as the old design. Throughout the site a vertical format yields pages too wide to be read or navigated without zooming in, resulting in minuscule pricing values, unreadable reviews, and effectively invisible calls to action. An ideal solution would be dynamically flexing this layout to pare down some of the horizontal elements when in a portrait orientation (e.g. dropping a row of five suggested products to three).

Another t-commerce question mark hanging over the new Amazon is speed. In Ai’s testing, page load time was significantly slower on the new site. This could be a real barrier to entry for some tablet users. The new promo images are undoubtedly pretty, but taking longer to load could end up hurting the bottom line.

To be truly tablet friendly, Amazon will also need improved product pages. Seemingly untouched by the redesign, the current product pages force tablet users to squint and swipe as they poke around for buttons taking them to some of their most desired links. A product page redesign (which could be just over the horizon) could solve this by corralling cluttered text into concise links and collapsing unnecessary information out of sight.

Improving T-Commerce UX

While the new design is definitely a welcome update, it definitely not a huge improvement in terms of optimizing the site for t-commerce. The minimalistic design makes for stronger visual cues in important areas of the site, but if users need to zoom in on areas they can’t see those cues can quickly end up out of view.

For true t-commerce optimization Amazon should revisit the site’s user-interface on a tablet device. Making sure that tappable areas can accommodate larger fingers by limiting the amount of options displayed.

Using CSS3 media queries to adjust the layout of the site’s product pages and increase the tappable area within faceted navigation or mega drop-downs would also vastly improve the user experience.

Complex pages also could be reworked by moving elements around the page to match Amazon’s business and merchandising requirements by, for example, move product reviews above the fold on a tablet to emphasize user-generated content.

Truly committing to tablet UX also includes a commitment to gesture-based navigation where applicable, like giving users the ability to swipe and drag hero images to cycle through them.

The new Amazon.com is slightly more tablet friendly, but it is far from an optimal solution. The redesign is definitely a move in the right direction for t-commerce, but only a half-step.

For more on Ai’s approach to t-commerce, read Alex Schmelkin’s article “Make Way for T-Commerce”  in E-Commerce Times.

Written with contributors Ed Samour and Seth Whitton

Ai President Alex Schmelkin is featured in a recent Folio article on the importance of optimizing e-commerce sites for tablet interfaces.  Alex is quoted heavily as the article highlights some of his top strategies to keep in mind when designing for “t-commerce.”

Some of the solutions he discusses include working with “the fold,” responsive layouts, minimizing hover states, and insights into future success through t-commerce.   The full story can be found here.

For more on Alex’s strategies on t-commerce, check out the article he wrote for E-Commerce Times entitled “Make Way for T-Commerce.”