Practical Ecommerce

6 Ecommerce Design Trends for 2015

In 2015, responsive, mobile-friendly ecommerce websites will stop being a competitive advantage and start to become a necessity for doing business online. This change will also impact how online retail and business-to-business sites are designed.

Dr. Anil Gupta, an author and business consultant, describes a competitive advantage as being something that a company is faster, better, or more efficient at — cheaper, if you like — than its competitors. For the past few years, having a mobile optimized website was something of a competitive advantage for online sellers, but in 2015 mobile-ready design is no longer a way to get ahead of the competition. It is a requirement.

Mobile design, then, is becoming so prominent and important that it is likely to influence ecommerce design in general. What follows are six web design trends that could impact how ecommerce sites are built or redesigned in 2015.

1. Hidden Menus

Mobile site design has required that some common and necessary site elements are hidden until they needed. As an example, global navigation or even product navigation is vital for an ecommerce site, but it can also be in the way on a small screen when a shopper is doing something other than navigating.

Thus, hidden menus (sometimes called hamburger menus because of the icon most often used to represent them) have risen in popularity. For example, one can find hidden menus on nearly all Google sites, and on the responsive site for Suitsupply, a men’s apparel company.

Suitsupply uses a hidden menu on its responsive site.

Suitsupply uses a hidden menu on its responsive site.

In 2015, some shoppers may find that online sellers use hidden menus even when a site is viewed on a desktop or laptop with a relatively larger screen. Trendy design firms are already starting to do this. As an example, London-based branding agency Pollen displays a hidden menu on its home page even when the site is viewed at 1,920-by-1,080 pixels.

Pollen uses a hidden menu even when its site is displayed on a relatively large screen.

Pollen uses a hidden menu even when its site is displayed on a relatively large screen.

In the ecommerce world, however, there may be one subtle change to hidden menus. There is evidence that some, if not many, people don’t yet understand what the hamburger menu icon means. So don’t be surprised if many retailers use the icon and the word “menu” in tandem.

2. Responsive Design for Large Screens

As previously mentioned, responsive design for mobile devices has nearly become a requirement for success in ecommerce, but there are some compelling reasons to design for large screens too.

For example, many smart televisions or game consoles, like the Xbox One, transform the television into an Internet-enabled device. One retailer in the Northwest reported that nearly 10 percent of its site traffic currently comes from devices with a screen resolution of 1,920 pixels wide or wider, indicating relatively large desktop monitors or televisions.

Other sites, particularly in the business-to-business space, may also have visitors using relatively large screens. Chris Lake, Econsultancy’s director of product development, wrote in April 2014 that 20 percent of his company’s site traffic came from visitors using devices with a screen resolution of at least 1,920 pixels wide, while about 18 percent came from mobile devices.

Lake also suggested looking at online seller Firebox as an example of a company that had done a good job of using responsive design to fill even a large screen.

The Firebox website's responsive design is not just great for mobile devices, rather it also fills up larger screens.

The Firebox website’s responsive design is not just good for mobile devices; it also fills up larger screens.

3. Flexible and Large Typography

Many in the web design industry believe that 2015 could be a notable year for typography, particularly flexible and large typography that works well in the context of a responsive design.

In an article about the trends that top designers are watching, Richard Rutter of Clearleft, a design firm, said that “web typography has come on in leaps and bounds over the past five years, as designers have been able to use more fonts and learn how to use them better. However homogeneity and conservatism in use of type is rife. This needs to change in order for websites and brands to stand out. Be bolder with your type choices — still be legible — but be different.”

These bolder designs will also need to be managed within the context of responsive design so that the text flows well whether it is displayed on a relatively small mobile screen or on a large desktop monitor.

Pelican Books is an example of a site that is using large, flexible typography.

Pelican Books is an example of a site that is using large, flexible typography.

4. Large Photography

Site speed is extremely important, and many website designers have, in recent years, done away with large images, in part, to make sites load faster on mobile devices. But with improved responsive design techniques and adaptive images, it is possible to serve relatively fast-loading but large images.

These large images can help ecommerce businesses sell more. Expect to see these much larger images in a couple of places.

First, home pages will include very large images. The Tommy Bahama site, as an example, has a history of using large, attractive images on its home page.

The Tommy Bahama website uses large images on its home page.

The Tommy Bahama website uses large images on its home page.

Second, don’t be surprised if product detail page photographs begin to grow too, some reaching dimensions of more than 1,000 pixels wide.

Greats, on online shoe store, uses large images on its product detail pages, and one can even rotate those images 360 degrees.

Greats uses large product images on its product detail pages.

Greats uses large product images on its product detail pages.

5. Video Content and Backgrounds

For years, marketing and ecommerce experts have been touting the benefits of video, including videos that help to sell products and content marketing videos that help to attract customers.

In 2015, look for more ecommerce businesses to use video on product detail pages, in blogs, on YouTube, and even as background images for home pages.

Toys R Us uses video to help demonstrate products.

Toys”R”Us uses video to help demonstrate products.

6. Material Design

Google's Material Design may catch on in 2015.

Google’s Material Design may catch on in 2015.

Material design is a “visual language” that Google developed to marry classic design principles with innovative technologies. It is a way of unifying user experience across platforms so that there are similar looks, conventions, and interactions regardless of what sort of Internet enabled device someone is using.

This is a somewhat cerebral approach to web and application design. Google used material design on the most recent updates to Android, and it is at least possible that some ecommerce operations will adopt material design in 2015.

Armando Roggio
Armando Roggio
Bio  |  RSS Feed


Get the Practical Ecommerce RSS feed

Comments ( 12 )

  1. Elizabeth Ball December 23, 2014 Reply

    Great points, Armando! Regarding number 3, large typography is not only essential for readability on mobile screens, but also for not inadvertently losing online sales to those who are aged 40+. Baby Boomers and older Gen Xers cannot bear websites with tiny type and resent having to zoom them up to 150% so they can read them clearly. It is one area I will be addressing on my next website.

  2. Carlos Rivera December 29, 2014 Reply

    Thank you for sharing about Google’s Material Design. I remember hearing about it when Google’s Lollipop update came out. It is great knowing that Google took the time to develop a language to describe the way page elements should be displayed on a page, rather than a hodgepodge of varying design styles.

    If anyone is interested, Google’s own documentation on Material Design can be found here:
    http://www.google.com/design/spec/material-design/introduction.html

  3. Peter December 30, 2014 Reply

    It made me quite sad and frustrated to read these predictions for design trends in 2015 since it seems that usability is completely neglected in these new trends.

    I do not visit a webshop just to see very big pictures and very big text. Ok, I want to see good pictures of the products I am considering buying, but they don’t have to take up the whole screen, and besides that the picture is not everything, I also want to be able to read about the product specifications, these are often forgotten or hidden away in these new designs with big pictures and text.

    It also seems that designers in their focus on mobile friendly websites tend to now develop websites for mobiles in the first place and then just scale this up on desktop screens, for instance your example with the hamburger menu. Again this is not very user friendly.

    Seems like usability has been completely forgotten by the designers.

  4. David Off December 31, 2014 Reply

    Very nice article! Smartphones and tablets have changed the approach toward design and user experience. Before the proliferation of mobile devices with advanced web-browsing capability , web designers had only one primary challenge to deal with – keeping the same look and feel of their websites in various desktop computer browsers. Therefore, Responsive Design still be a great trend in next time. You may get more reasons why responsive design still be good trend by check out this article http://www.proweb365.com/why-a-responsive-web-design-will-be-the-next-big-thing-for-your-business/

    Regards,
    David Off

  5. Alexis March 27, 2015 Reply

    Very useful content. That little hamburger menu doesn’t seem great for usability though. I wonder if that is a trend that needs to be skipped.

  6. sean April 20, 2015 Reply

    I like the idea of hidden menus, particularly for e-commerce sites. In designing these over the past few years, I have always felt that I would be more successful if I could focus in on the product more. Menus and navigation bars distract from that, and while they can be nice additions to a design, on an e-commerce site, you want it to be all about the product.

    http://www.clevermask.com/design

  7. Gerrard April 21, 2015 Reply

    Very well written and informative, Armando. Well done! Really glad people realized the value of large, beautiful imagery :) This article has inspired me to write my own piece on e-commerce “trends”, however, I decided to focus more on the sort of business structure and functionality within an e-commerce business, read it here and please feel free to comment :) http://oneclickhere.co.za/10-ecommerce-design-trends/

  8. Kelly M April 21, 2015 Reply

    I personally think using hidden menu’s on desktop sites is poor user experience. Why put an extra step between the user and their destination? Obviously this is a necessity on mobile, but doing it on a desktop? It just seems lazy in my opinion.

    Responsive design means optimizing the site for the screen it is being displayed on, not just meeting the lowest common denominator. There’s plenty of room on the screen to display the full navigation, and no reason not to show it.

    • Armando Roggio April 21, 2015 Reply

      Kelly, I included the Pollen example here because I thought it was unusual to see a hidden menu on a large screen.

      But don’t you think that in terms of functionalty, hidden menus are really similar to flyout menus?

      To get to your order history on Amazon, you have to click twice. Once on “Your Account” and once on “Your Orders.”

      On store.Google.com, you also have to click twice to get to your order history. Once on the hidden menu and once on order history.

  9. Jacqueline May 10, 2015 Reply

    Thanks for the great article Armando. I like the use of hidden menus, I think that it is a really efficient use of space and can always be accessed when needed. http://www.marketingsweet.com.au

  10. طراحی سایت July 26, 2015 Reply

    Very useful content. I have referred to it in your site.

  11. انجام پروژه های دانشجویی January 7, 2016 Reply

    Thanks for such informative information . We need this kind of information thanks .

Email Newsletter Signup

Sign up to receive EcommerceNotes, our acclaimed email newsletter.
And receive a free copy of our ebook
50 Great Ecommerce Ideas