The Information Age has also ushered in an era of exceptional and almost lazy convenience when it comes to buying things you’ve always wanted, all from the comfort of your couch.
Any thing. Any brand.
Yes, we’ve all fallen prey to the pleasures of online shopping, known in corporate circles as e-commerce.
Apart from the big players like Amazon, Alibaba, and more recently, Flipkart, we have millions of online stores selling products we all want at the click of a button. And many of these store look just as beautiful as an actual store of a high end designer brand down the corner. (Apple Stores, anyone?)
Web Design is just as tactful as designing a physical product store. There are trends that catch on to the masses imagination, just like there are trends that are forgotten in an era bygone.
Dwelling on the past aside, I came up with a list a eCommerce Design trends that you’ll most likely come across on any of these millions of e-stores in 2016.
First up on the list is..
Masonry design was first conceived by David DeSandro as a jQuery plug-in called Masonry. It owes its massive popularity over the years to Pinterest, the first major website to adopt this form of page layout.
What Masonry does to your website is it optimizes the use of space within a web page by eliminating unnecessary gaps. It styles its elements in a grid based fashion, first by vertically stacking them up and proceeding to do the same horizontally, as opposed to CSS floats which does the exact opposite.
It’s akin to a mason piling up bricks on top of each other to build a wall, and hence the name.
Masonry also takes into consideration the size of every individual element and dynamically calculates an appropriate arrangement without wasting space.
Masonry is being swiftly adopted by online stores all over the internet, and, well, this is just the start.
The main reason for this, apart from its beautiful aesthetics, being that it’s incredibly eye catching. Which is exactly what you would want as a seller with a large catalogue of products: catch the customer’s eye.
Also, given that there’s no fixed size for a element, you can have images of products of varying size on top of each other right on a single page, saving user the trouble of having to navigate to another page.
Apart from WordPress, which already houses several Masonry themes, eCommerce giants like Magento and Shopify are witnessing an ever increasing number of themes adopt this approach.
Combine this with design schemes like minimalism and you have a webstore with a rich and an appealing feel that attracts sales by the dozen.
Mobile First Approach
That smartphones have taken over our lives is old news, but did you know that by 2018, mcommerce will account combined global revenue of over 630 Billion U.S Dollars?
That’s about the total revenue generated by whole of ecommerce, as seen in 2013.
No wonder most retailers are now opting for a mobile first design strategy for their websites.
Let’s be clear on one thing: Mobile-first does NOT equate to Responsive Design. Sure, the two have a lot of things in common, the ultimate goal being a smooth and snappy mobile experience. But mobile-first is an altogether different web design strategy, of which Responsive Design is a part.
The end result, for a user browsing on his smartphone, is a plain and dull website that contains just about enough content and elements for the website to be functional.
Hardly impressive and completely lackluster.
A mobile first approach takes this strategy and turns it on the flipside: you start with basing your designs for an optimal mobile experience, taking full advantage of your platform, and then add elements to make your website more robust and noteworthy as you work your way up towards the desktop.
What you get with a mobile first approach is a fantastic UX for your prospective buyers, regardless of the platform. It’s called progressive enhancement.
And while we’re dealing with the platform that is Mobile, an ever increasing number of users are opting to browse the internet solely via their mobile phones. In fact, global smartphone penetration will rise up to 34%, which is to say that one in three persons in the world will own a smartphone as early as next year!
To sum it all up, if you’re looking to sell online, it’s either go mobile or go home!
Customer Specific Product Listings
Behavioural targeting has been known to double the effectiveness of advertisements; one can only imagine the same will apply to behavioral marketing.
Collecting data pertaining to the browsing habits of an average visitor to your website, and analyzing it, can be a very effective precursor to increasing conversion rates for your site traffic.
One way to do this is implementing a dynamic product listing on your website, one that targets the needs of an individual visitor.
Imagine viewing a product on an online store and seeing a catalogue side listed that specifically interests you, what are your chances of making a successful purchase?
Pretty high, would be my guess.
Another idea that comes into play when you talk about behavioral marketing is the concept of behavioural cross selling.
Let’s break it down for your with an example. Suppose you were browsing for mobile accessories on this website that your friend said offered great deals, but never went through with the purchase. And now, a couple of weeks later you find yourself in dire need of a new smartphone.
You log onto your favourite e-store, and are just about hit ‘Buy Now’ on the smartphone of your choice, when you suddenly spot this this awesome accessory that you never bought being offered to you with the smartphone as a part of a lucrative deal. It’s the best of both worlds!
This, my friend, is no mere co-incidence, but a very sophisticated form of intelligent cross selling by the website. The website analyzes the your behavioural data and clubs together a relevant side product to go with your purchase and offers it you as bundled package at a discounted price.
Major players in the ecommerce space like Amazon are already reaping the benefits of this strategy, and so should you!
Do you know of this little company called Apple? The one that revolutionized the electronics industry as we know it and all.
Of course you do!
Apart from its outstanding range of products, Apple is also known for its ingenious marketing and advertising skills. Their minimalist approach has been lauded by web designers and marketing professionals alike.
If you’ve keenly paid attention to its advertisements and hoardings over the years, you would have noticed how it sticks to ultra-clean minimalism: a high quality image of its product, lots of white space and closely spaced text in black and grey color scheme. It’s clean and it’s elegant. A perfect reflection of everything Apple stands for.
Their website follows the same approach, and is a prime example of how a minimalist approach can work wonders for your online store, while retaining functionality and design.
The advantages of a minimalist web design are numerous: it’s a marked relief on the eyes when compared to websites over stuffed with loud and brazen design schemes, leads to better conversion rates and of course, let’s you lay more emphasis more than ever on your products!
Take a look at this list of 13 great examples of minimal ecommerce stores and notice how they utilize the scheme to best of their advantage.
Minimal design means you can shift your focus on the functionality of your store.
Out of the many possibilities, as listed eloquently on the the above mentioned list, some that stand out are the use of banners to upsell products, optimizing the process of adding products to cart and checking out, innovative use of icons and of course, instant focus on the product range.
Less is clearly more.
Stand Out Product Landing Pages
Every product has a story of it’s own, and it deserves to be told. Move over dull and drab pages for individual products in the catalogue, 2016 is the year where you’ll see more and more full fashioned landing pages focused on marketing individual products.
While most products have a page dedicated to themselves, it’s mostly just a handful of hi-res images of the product along with the specifications and the selling price. Add to that customer reviews and product ratings and you have every average product page on the web ever.
While these pages do serve the purpose of providing the user with all the relevant information about the product, they hardly do anything about the marketability of it all.
And really suck at converting leads.
There’s nothing worse than portraying an appealing product in an unattractive manner, which is why you ought to focus more on the design and the feel of the page.
Well designed landing pages are equally great at up selling high end products from within your product line up and/or launching new products!
They basically do the same three essential things as the afore-mentioned ‘every product page ever’, but with much more elegance, poise and style.
They don’t sell you the product, they sell the deal.
They don’t sell you the features, they sell you the benefits.
They don’t tell you about customer reviews, they share with you their stories.
See the difference? Not yet?
Take a look at these 8 exceptional product landing pages, and you’ll know what I’m talking about.
With that we round up my list of trending and clever designs you’ll encounter on e-stores this year, but here are a few honorable mentions that will also be spotted while shopping online in 2016.
- Less-bulky, Tiled Navigation : For those who can’t find their way amidst a thousand navigation options on most websites. Basically all of us.
- Full-Width Content Design: Full width background images and parallax scrolling with well spaced content. These are (and will remain) evergreen.
- Material Design: Google has been all about this since the past couple of years. Need I say more?
Did I miss anything major or get any of the above details wrong? I’d love to hear from you! Comment away!