New year. New look. New design trends. If you’re searching for a new, refreshing look for 2017, we’ve compiled this list of 11 cutting-edge eCommerce designs that show you what to expect in the next dozen months.

We chose only sites indicative of modern eCommerce trends. This isn’t a list to help you make an everyday, run-of-the-mill eCommerce site; this is a list to show you the great eCommerce designs of tomorrow.

Most of the sites are winners of Awwwards, showing it’s not just us who appreciates them. There are a few that we added on our own because they showcased the values of avant-garde eCommerce design anyway.

1. A-dam Underwear

A-dam Underwear Home
Source: A-dam Underwear

One of the most cutting edge trends of 2017 is that eCommerce sites no longer look like eCommerce sites. They’re abandoning the typical templates and adopting design choices from more experimental sites like agency portfolios. We’ll start with one of the most obvious examples: A-dam Underwear.

A-dam Underwear Loading Page

Source: A-dam Underwear

As an underwear vendor, A-dam does not shy away from the embarrassing parts of their industry. Instead they embrace them, even make jokes about them (like the “got balls?” loading screen above or the fig leaf logo). This type of humor might make sites with traditional eCommerce designs squeamish, but it constitutes a large part of the A-dam’s personality… and appeals to their target shoppers.

A-dam Underwear Product Grid

Source: A-dam Underwear

Notice the fluid, asymmetrical “grid” for displaying product pictures. This is quickly becoming a new design trend for eCommerce, as younger shoppers tend to appreciate the breaking from the norm. Despite all its flamboyant design choices, A-dam still maintains the essentials: menu navigation, bag in the upper-right corner, and even a live chat option for customer support. They add to both functionality and delight with animated microinteractions peppered throughout the site.

2. Shun Cutlery

Shun Cutlery Home

Source: Shun Cutlery

Beyond its fashionable modernity, Shun Cutlery still holds on to shades of a traditional eCommerce store. The best example is the Home page. A full-screen photo carousel partnered with a minimalist navigation menu over a pure white background gives the site a futuristic appearance, but the individual elements (photo carousel, horizontal navigation menu) are classic eCommerce.

Shun Cutlery is a good example of doing old eCommerce patterns in a new way. After all, eCommerce patterns are used over and over because they work. If you can manage to package them in a new and unique way, you set yourself apart from the competition without losing the familiar functionality.

Shun Cutlery Product Grid

Source: Shun Cutlery

Just look at the product grid above. Again, the structure of a rowed grid is a typical eCommerce design pattern, but the absence of borders and the blending of the picture backgrounds into the site backgrounds gives it a look that’s unlike the grids on any other eCommerce sites.

3. Paul Valentine

Paul Valentine Landing Screen

Source: Paul Valentine

Paul Valentine takes a few risks, but still pulls out ahead. For starters, they open on a text-less hero image showcasing two of their most popular watches. Without any navigation or even instructions, they’re hoping that the shopper will figure out they need to scroll… which is a pretty safe assumption for 2017.

Paul Valentine Home

Source: Paul Valentine

Another risk is the vertical navigation menu, with the bag icon at the bottom left rather than the top right. Again, though, this is a mitigated risk: the site has only a few pages, so they can afford to oversimplify the navigation.

Paul Valentine Product Page

Source: Paul Valentine

All and all, the design decisions are made to enhance the visuals of the product to show off the quality — a smart choice for a stylish, high-end fashion brand. Their eCommerce design takes attention away from the design elements and places it on the product, where it belongs.

4. The Cool Club.

The Cool Club. Home

Source: The Cool Club.

You can expect creativity and ingenuity from an eCommerce store for art and wall decorations like The Cool Club. Even from the start, the home landing page is the brand’s characteristic illustration styles, but with slight animations to draw the shopper in. The option to scroll between famous celebrities adds a little gamification at the beginning of the shopping experience, a relatively unused technique in eCommerce designs.

The Cool Club. Product Page

Source: The Cool Club.

Once the customer leaves the home page, though, they encounter the familiar conventions of eCommerce that make shopping easy. Just look at their product page above; the format is pretty standard, with product image covering most of the left side of the screen, and description on the right. The description is even formatted conventionally, with a title, rating, and an eye-catching call-to-action on the bottom.

5. Bouguessa

Bouguessa Home

Source: Bouguessa

Bouguessa is another site that turns eCommerce conventions on their head without abandoning them completely. They put their own spin on their home landing page by shrinking the horizontal navigation menu down to only the right half of the screen, to free up room for a more expansive hero background featuring one of their best-sellers.

Bouguessa Search

Source: Bouguessa

They also offer a unique search function by co-opting the “mad lib” UI pattern that originated with form fields. The customer can select their preferred category from a drop-down, but with the context of the mad lib phrase surrounding it. This is a nice cue to shoppers who don’t want to figure out how to navigate the site on their own.

Bouguessa Product Page

Source: Bouguessa

But once the shopper lands on the product page, they’re back on familiar ground. Like the other sites on this list, Bouguessa is smart enough to take risks where they can, but play it safe where it counts.

6. Someone

Someone Home

Source: Someone

The shoe and travel accessories retailer Someone may have the most “normal” eCommerce design on our list, but as you can see it’s still distinctively their own. Looking at the home page above, their site may not seem all that special, but they set themselves apart with small adjustments — using landscape photography instead of product photos (they’re a travel brand) for one thing, or the unconventional page titles like “Concept” and “Be Someone.”

Someone Product Grid

Source: Someone

To show another example, the main shopping page is laid out in a typical grid format like most eCommerce sites. But the hover animation when you select an item is different, though still recognizable. Their use of a block around the title and price, while fading the picture, is unique. The brand Someone has their cake and eats it too by putting slight tweaks on standard eCommerce patterns.

7. Fotonaut

Fotonaut Home Source: Fotonaut

Creating an eCommerce site for a new and unheard-of product has its own array of obstacles on top of the regular ones. That’s why we commend Fotonaut for rising to the challenge. Their product is a more efficient photo booth for parties, marketed towards owning your own is cheaper than continually renting one. Their clever site design takes their marketing to the next level.

Related posts:  Bones 2, our new base eCommerce theme for developers

Fotonaut Use Page
Source: Fotonaut

First, the bright yellow color scheme give it a hip and modern appearance. Going deeper, the astronaut imagery, the copy centered around outer space, and the product’s name itself all work together to create an association between the product and futurism. These design choices do wonders for the marketing strategy of presenting the product as advanced and progressive.

Fotonaut Product Page
Source: Fotonaut

The product page maintains the same bright yellow accents, but adheres to a minimalist simplicity that keeps pace with the futuristic facade. The technical details are available, but listed on a separate “Specification” page to save room on the product page.

8. Glitty

Glitty HomeSource: Glitty

Like Fotonaut, Glitty also needs to stand out from typical eCommerce designs because of their atypical products. They sell real wooden cases for Macbooks, iPhones, and iPads. Their products naturally target youthful and modern consumers, so their site design needs to reflect this attitude. One of the most immediate diversions from the norm is the vertical navigation menu — like Paul Valentine’s — with the bag icon in the bottom right rather than the top left.

The landing screen features an auto-playing hero video background, which draws the shopper in immediately and visually showcases their product in “hip” environments to set a context. Young free-spirit types, with beards and bracelets, perform trendy activities like skateboarding, hiking, and paddleboating before pulling out their Apple products, encased in wood. The HD video is shot well with cinematic techniques and dazzling visuals, so it’s actually a pleasure to watch.

Glitty Product Page

Source: Glitty

Visuals play a big part of the site design on the whole, as the nature of the product feeds off of how good it looks. That explains the unorthodox product page, where enormous, cascading hero background product photos replace the smaller and more controlled options. Using larger hero product photos emphasizes the look of the product, its main selling point.

9. Fay

Fay Home

Source: Fay

The fashion site Fay opens with a full-page hero photo carousel to highlight the look and style of their clothing. Breaking form from normal eCommerce designs, Fay leaves the landing screen minimal so the shopper can focus on the photos. Visitors are free to scroll down for more information, with a textual cue/instructions at the bottom of the page.

Fay Navigation Source: Fay

Our favorite part of Fay’s design is the navigation. It’s simple and to-the-point, devoid of excess. Each page is divided into the three umbrella categories: Women, Men, and Fay Life, plus a boutique finder and all-purpose search function tucked into the upper-right corner. Clicking on one of the main three options brings up a full-page mega menu with a faded video background.

Fay Product Page

Source: Fay

The product page is equally out-of-the-ordinary. For a handful of their main, best-selling items, like the coat above, the landing screen of the product page is actually interactive. Moving the cursor left or right rotates the coat by varying degrees, though not up and down. This gives the shopper a 180° of the product that they can control themselves, helping to inform their decision about whether it’s right for them.

10. Frederique Constant – Horological Smartwatch

Frederique Constant Horological Smartwatch Landing Screen

Source: Frederique Constant – Horological Smartwatch

Next is a specialty secondary site from Frederique Constant to showcase only one of their product lines, the Horological Smartwatch. Here is another site that needs to sharply explain their previously unknown product, and Frederique Constant does this admirably.

Frederique Constant Horological Smartwatch Home

Source: Frederique Constant – Horological Smartwatch

The percentage completeness meter on the vertical side monitors how much of the page the shopper has already scrolled through. This is a great incentive to entice the customer to scroll further, and reassures them that the page isn’t too long. The deeper the shopper scrolls, the more of its features are showcased with creative visuals, not to mention each screen has its own call-to-action button. The page holds the visitor’s attention with subtle animated microinteractions, such as images sliding into place.

Frederique Constant Horological Smartwatch Product Page

Source: Frederique Constant – Horological Smartwatch

The product page flexes its creative muscle without sacrificing any of the essentials. The whole page is orchestrated around the product photos in the center. The price and “Buy…” call-to-action buttons are at the bottom, along with cues for the product specs, customization options, and social sharing options. We really like the vertical list of features on the left side, with icons succinctly representing all the advanced features, in case you missed something on the main page.

11. Zulu & Zephyr

Zulu & Zephyr Home Source: Zulu & Zephyr

Zulu & Zephyr may appear as a by-the-book eCommerce site on first glance, but it’s the subtle and at-times ingenious design choices that impress us, which is why we chose them for the closing slot in our list. The fashion brand reinvents the way eCommerce designs can use photographs, not by doing anything too outlandish, but simply by enhancing site photography’s natural purposes.

Zulu & Zephyr Product GridSource: Zulu & Zephyr

Take the product grid: at its heart, its the same, typical three-column row format as plenty of other eCommerce designs. But with a few smart design choices, Zulu & Zephyr separates itself from, and even improves upon, the standard conventions.

First, the model’s eyes are cut off to put the focus on the clothes — not that uncommon, but far from average. This also gives the photos more artistic appeal (especially with the sexy lips of the model still prominent), and artful choices are always appreciated in fashion eCommerce.

The pictures themselves are elongated; where most eCommerce designs use squares, this site has extremely rectangular photos to show off how the clothes fit on the whole body. Larger photos in general put more emphasis on the products.

Last, a clever and unique microinteraction brings up a size selector and add-to-cart option upon hovering. That means a regular or confident shopper can add the item in their size directly to their cart on the main product grid page. This system makes the extra step of visiting the product page completely optional.

Zulu & Zephyr Product Page

Source: Zulu & Zephyr

The product page itself teases nonconformity without expressly breaking the mold. The title, description, bulleted features, and “Add to Bag” call-to-action are all standard, and the announcement about their Afterpay program is nothing special. Their photos, though, are again what stands out — colossal product photos that don’t even fit on the entire screen without having to scroll.

The biggest takeaway from Zulu & Zephyr is that smart, cutting-edge eCommerce design simply augments the traditions of the past with new ideas.

Conclusion

What’s your favorite new eCommerce design? Which modern trends excite you most? Which ones do you hope will fade soon? Share your opinions in the comments now.