Here is a new list of Shopify stores and this time the selection is based on aesthetic criteria: design, UX & photography. The order of the sites in the list has no indication or preference, we just had to start somewhere :).
Glitty sells quality wooden iCases/Covers. In their design, they are aiming for:
These aspects will become clear to you once you see that they only have few pages: Home, About us, Products, and individual product pages. Support/Terms/Policies are not considered as real content, so they don't count.
The main aspect Glitty excels in is their product presentation - each page has all the required elements presented together in harmony:
- Neatly segregated options and perfect use of space,
- Shipping delays are explained via an eye-catching, motivating message.
- Responsible production (FSC Certified Wood),
- Social proof via Instagram.
- Facebook messenger notifications instead of email.
- Simple photos.
Here are some screenshots:
In Shopify, it is very easy to get new applications integrated into your website and product pages. But chances are very slim that your out-of-the-box Shopify theme can handle all the extra elements without losing points on the UX side of things. So our advice:
- List all the required functionalities for your store and product pages.
- Eliminate the least important, if you have too many.
- Ask an agency to customize a theme (or create a new one) for you with those requirements in mind. Avoid adding things gradually on your own.
We've seen many product pages have turned into a UX nightmare because of the irresponsible use of integrations that intersect with each other and distract users rather than converting them. So be careful, sometimes less is more!
A beautiful e-commerce site that sells creative, artistic candles. In general, the site passes with flying colors in most of UX aspects, but what really caught our attention: PRODUCT PHOTOS:
- They showcase how the product is consumed while in use.
- They are uniquely interactive, you only need to hover over them to trigger a video-like slideshow.
The site sells customisable watches, and overall it offers one of the best user experiences that we've come across in this regard. Everything about this website is neatly thought of and falls into place brilliantly.
For many e-commerce businesses, customisable products are part of their core offers. Whether it is a one-time product purchase or a subscription, either/both should be streamlined and designed in the simplest way possible. Why? because your potential customer has a very short attention span, and according to Google (among others), the user perceives each click to a new page as a task. and people don't like tasks!
If you're trying to offer a similar experience, think of eliminating all unnecessary steps, or minor customizations that could increase your interface's complexity.
Here are few screenshots from the Tinker process:
Still in the customization category, Dodo offers a comprehensive customization experience for all of their products. I find the interface to be a little bit overcharged, nevertheless, it does the job well, and it has all the required elements:
- Progress bar
- Previous / Next buttons.
- Applying customization in real-time without delay.
It is yet another example of what you can do if you have similar requirements for your product(s). If you like Dodo's UX, and you're thinking of following their example then I'd recommend the following:
- Make use of the entire screen, don't concentrate the options in the middle.
- Use a neutral background color.
- Don't repeat elements (price, controls .. ), space is very precious
Here is a quick look at how the customization interface looks like:
Well, this is a 10/10 website. Straight to the point, simple, neat and beautiful. It is a one-page website that sells 2 products, and they do it very well.
If you have a small collection and would like to go for something similar, consider the following recommendations:
- Is SEO is of importance in your long-term strategy? You have to work harder to promote your site and build more good quality backlinks to make up for the lack of content on your site.
- Mind your analytics - data is the most important asset you might have. One-page websites should have a custom Google analytics setup to track clicks, views, and other related business objectives. Otherwise, your entire conversion rate optimization process will be at risk, and instead of deriving your decisions from concrete results and relevant data, you'll have to guess your money away.
"Art should be admired", this is all we have to say.
This site provides a supreme joyful experience, the design, UX, and animations are on point and aligned with the brand:
- Gradient buttons & moving backgrounds,
- Easy to navigate products,
- Cool social proof slider,
- Amazing logo positioning,
- Sublime animations.
You'll never get tired playing around with the website.
Keep in mind these colors and interactions require a specific audience and corresponding products. Furthermore, similar UX is more suitable for small websites. So if you have a classy apparel shop or big collections, we don't recommend a similar arrangement. However, if you're going for a custom design, a good design agency should dig deep and create an experience dictated directly from your brand's spirit. So pick wisely.
Here are few screenshots of Super Team Deluxe:
Bombas sells socks and only socks. Their story of how they started out and then secured their funding is quite impressive. But this is not why they are on this list, the reason why is their conversion optimized UX. Here is what they did:
1. Make use of the useless slider section in the home page header.
Did you know that sliders/carousels are useless on your homepage? We've conducted many experiments with our clients and no matter what, the results are the same, very poor engagement (less than 2% of traffic). If you are not convinced, there is a dedicated website: http://shouldiuseacarousel.com/ that will walk you through it.
The solution Bombas have is very simple, provide the visitor with useful navigational links.
Did you notice the small text in the bottom left corner? It's about their social philanthropy policy and other useful information. From a client's perspective, the priority is to find relevant information, the simpler you make this process the better conversion rates you'll get.
2. Simplifying product options.
They succeeded in reducing the friction throughout the entire user experience to the minimum possible. They have 2 options for their socks; color & size, so here is what they did:
- Since color/design is the main option from the client's perspective, so they put it directly on the product card, everywhere.
- Only on hover does the "Add to cart" appear.
- Again, only when you hover over the "add to cart" you'll see the size options.
This UX a genius UX trick, and is being used more and more in modern interfaces. Why show customers a cumbersome list of options or fields when instead, you can offer them 1 choice to make at a time.
There are many other small details that they got right, try to go to their site and discover some of them.
The secret that got LuxyHair into this list is their intelligently built guide. Their aim to transparently help clients find the product they are looking for, instead of listing everything at once and forcing clients to scroll up and down for choices. Here are the screenshots:
You may ask yourself, why didn't they allow the customers to select products directly from the second step. 2 reasons might be behind that:
- Improve SEO
- Collect more data to understand their customers better
The final example is as sweet as it looks, an easy package builder. Check this GIF:
Hope you enjoyed this list and found some useful ideas that you can use to improve your conversion rates.