Philip Langley's profile

Responsive ecommerce site for Takealot

Takealot is South Africa's largest ecommerce site. They needed a responsive site with a brand new layout and look and feel.

I designed the site from homepage to help page, desktop to mobile.

We started by doing usability testing on the existing checkout process to discover user needs and their pain points. We then made a clickable prototype and tested it with users. The main challenge was integrating the various payment methods that Takealot offers. Simplifying the various flows became our primary objective.

I then started on the product display page (PDP). My main goal here was to let the product take centre stage without becoming bogged down with interface elements. Of course, I needed to cater for all the various types of products and their options.

At this point, I began the process of creating the design system for the site. I wanted it to be clean and simple, with emphasis on the products. Ecommerce needs to be as visual as shopping in the physical space.

My other goal was to create a system that would be modular enough to work across all screen sizes so I spent many days designing a grid system that would work. I settled on cards as a way to show products. I designed various sizes and types of card for different scenarios - products, categories, brands, sales, daily deals.

The final screen to design (after about 15 different screens) was the homepage. I always leave these pages till last because it contains the most amount of content. The tricky thing here was creating a usable promotional area (carousels have terrible ux) that would be usable on desktop and mobile. I came up with the concept of dividing it into slices, with different ubercategories of home, tech and media.

I'm proud of the work that I did, and I still think it's the best work I've ever done. Unfortunately Takealot didn't use the design because their business was purchased and they didn't have capacity to build it. At least in the last few months I've seen them start to implement parts of my design.


The homepage was a mix of categories and products.
  
A slightly older design showing the homepage on 10", 7", and 5" screens. Note the change in the promotional area at the top and how the tabbed best sellers becomes an accordion.
 The product page had to accommodate the various product controls.
The cart was based on clickable wireframes tested with users and needed to show the various states of products
Responsive ecommerce site for Takealot
Published:

Responsive ecommerce site for Takealot

Responsive site for Takealot, South Africa's biggest ecommerce site.

Published:

Creative Fields