Scalable eCommerce Design

The eCommerce space is an ever-changing landscape. Constantly evolving with the introduction of cheap subscription-based solutions like Shopify and Big Commerce, software platforms like Magento must adapt to these smaller functionality offerings that cater to small customers.

The Role
As the eCommerce designer at Retail Express, I realised that our technological requirement to use Magento had a problem which needed to be overcome: How do you make an enterprise level product suitable for smaller customers while being scalable for 400+ clients. 

Like most Content Management Systems, Magento uses a theme structure for all design elements which can be customised with varying levels of complexity. The base Magento 1.7 has all the default functionality available but still had the original design from 2008.

The eCommerce team had some previous success with using 3rd party themes but clients complained of difficulty maintaining content and lack of sales due to unintuitive buying processes. Due to limited metrics and time constraints, I felt I had enough information to get started on an initial offering then reevaluate once we had more concrete validation.

User Types
Since we were designing solutions for a wide variety of different retailers (fashion, sports, furniture, technology, music) I used some research from the Nielson Norman Group on what types of users were commonly found buying online.

Source: Designing for 5 Types of E-Commerce Shoppers

The wireframes needed to cater for these different scenarios while also being broad enough to work for all retailers product lines. Certain elements like shipping costs needed to be visible throughout the whole site but even more so when customers were viewing products. Accepted payment methods, return policies, and store contact details had to be easy to find to build trust for new customers.


This first theme designed focused on a quick and easy to understand grid system for both desktop and mobile devices that could expand and contract for different sized businesses.

If the client had a larger product line (5000+ SKUs), we could suggest a more product-focused home page so customers could get a better understanding of what was being offered. 
If they had a small product line (up to 500 SKUs) we could reduce the number of content areas and focus on large lifestyle images to inspire customers.

The grid system worked extremely well, simplifying the design process from 15-20 hours, down to less than 10 hours per client from the initial design briefing all the way to handing design assets over to the development team.

This theme was also the most popular with our clients and was used for over 200 different websites.

With the success of the first theme we received some great client and customer feedback and a solid grid framework to expand from. We produced 4 more themes to offer more flexibility and choice for our new clients and continued to iterate on the original theme by adding new design features and functionality requested by existing clients.

Still conscious of our limited development resources and budget, we reused elements from each theme to reduce design time and speed up development. Clients were happy with the reduced costs and being able to choose from multiple options for their new websites with proven results.

Without much historical data and due to the constraints the best strategy was to work in an agile process without any initial guidance on was and wasn’t producing results. Wire-framing proposed layouts and working with our clients from day 1 allowed us to experiment and adapt according to their requirements.

The outcome of these experiments varied between retailers size and marketing strategies, but the improvements to the buying experience helped clients average over $15,000 a month in online sales, and a select few reaching over $1 million in online sales annually.