Lessons from the Amazon Redesign
Amazon has redesigned its website — improving aesthetics, usability, and merchandising. Changes in Amazon’s graphic design and how it displays navigation menus offer a few basic lessons about site-presentation trends that may help small and mid-sized online merchants with their own site designs.
Arguably, the Amazon website was long overdue for a redesign. The site looked dated. Specifically, the use of color-reflected design originated a few years ago. Its glossy buttons were also reflective of common style choices from the early part of the decade.
By contrast, the new Amazon site, which began showing up to Google Chrome and Apple Safari users last week, demonstrates several current trends in ecommerce site design.
Lesson No. 1: Clean Is Better than Cluttered
The new Amazon site compartmentalizes navigation; uses light, subtle colors; and features long, unbroken lines to appear less cluttered than it was before the redesign.
Examples of this clean versus clutter appearance can be found in the page header. Previously this section of the site had a heavy blue line, glossy orange header, and significantly more text, including the navigation.
On the new Amazon site, the header is less intrusive, but not less informative.
Lesson No. 2: Highlight Search
Search is, perhaps, the most important navigation feature on a retail website. In my opinion, the new Amazon site does a better job of highlighting the site search feature. Interestingly this improved emphasis was not the result of changing the search field’s position on site, but rather comes from its size, shape, and color.
In the previous Amazon site design, the search field was inside of the header’s blue stripe. It was a rectangle, and it was split into two parts.
The new search field is slightly taller and narrower, which makes it appear to be larger. It is also rounded with a subtle shadow that provides some depth. Finally, without a change in functionality, it has greater visual unity.
Lesson No. 3: Include a Content Slider
A content slider allows a retailer to show shoppers products, specials, or information in a visually appealing way. The new Amazon site employs two stacked content sliders. The sliders require user interaction and have tool tips associated with the labels.
Lesson No. 4: Details Make a Difference
Perhaps one of most visually impactful changes to the Amazon site is the inclusion of small, subtle design details like shadows. For example, the flyout navigation menu seems to float over the reset of the page, giving the site the appearance of greater depth.
Lesson No. 5: Merchandise
Onsite merchandising can be a key to increasing the number of items a shopper purchases. The new Amazon site uses its improved navigation and content sliders to show shoppers more products and more options.
Notice, as an example, the excellent and visually pleasing jean merchandising found on the “Clothing, Shoes & Jewelry” flyout.
Amazon, one of the largest online retailers, has redesigned its site to be more visually appealing, to better highlight search, to include two content sliders, and to provide better merchandising opportunities. Other online retailers can take lessons from Amazon’s design choices, and improve their own sites.