Les Savons En Gros (SEG) is a company who produces and sells custom soaps to customers. They decided to re-design their website in order to increase their number of clients and sell more products online. This project was done in collaboration with the stakeholder and a developer. In this project, I worked mainly on the elements of the user experience and in all tasks related to the front-end development (HTML, CSS and Drupal theming). 

The challenge 

The challenge of this project was to create an easy-to-use e-commerce website which promoted the products sold by Savons en Gros. The website had to be in line with the companies brand. The stakeholder insisted using technical terms into the copy of the website to explain to his audience precisely the components of their custom made soaps. It was challenging to confront the stakeholder and find a balance regarding this matter. In the end I succeeded in convincing them that the text should be clear and comprehensible for there customers.

All of the customers are not familiar with this advanced terminology.

What I did 

Research & analysis

I started the project by analysing the style of the current website, to re-designing and interviewing a group of five users to ascertain how they use and interact with the website. It was vital to understand their needs and troubles. This analysis showed me several problems such as the branding, information architecture and the lack of clarity and engagement on certain critical pages.

From the users I have been interviewing, were not able to correctly understand the value proposition and the purpose of the website.  They also had issues to purchase a product as the product page and the checkout process where confusing. In parallel, I analysed some data on Google Analytics to gain more data about this fact. I did notice a high bounce rate on the homepage and on the product page.  In order to solve the main problem, I have decided to design a user-centred interfaces which convert and optimise the checkout and purchase experience to increase conversion, engagement and customer satisfaction.

Strategy & goals

In order to correctly solve the main problem and establish a positive user experience, it was important to distinguish the goals involved in this project from the business and the users:

Here are the goals I noted and that I had to keep in mind during the re-design:

    Business goals
  • Increase online sales/generate more revenue;
  • Communicate a consistent brand and message across the website and the physical products.
    User goals
  • Buy soap(s) online.

During these steps, I also made sure to answer the questions below to keep everything
tracked and under the scope of the re-design. This also facilitated communication and collaboration with stakeholders and all persons involved in the project.

  • Why are we re-designing the website?
  • For whom are we building this for?
  • What are the business and user goals?
  • What are we building exactly?

Information Architecture

After the strategy phase, I spent time re-organizing the structure and the information of the website. I ended up defining the main user flow and sitemap.

Sketches and wireframing

Moreover, I swiftly created a prototype in HTML of the retained concept in order to test it with the users. (Before the HTML version, I started the prototype with pen and paper, then increased the reliability to wireframes in keynote and then to an interactive and high-fidelity HTML prototype).

Visual design

I created a style scape in order to present a quick graphic representation of the visual design choices to the client (colours, imagery, and typography).

User testing

I conducted a quick test with the five previous users in order to see how they were interacting with the prototype. By obtaining and analysing their feedback, I was able to iterate the prototype over time and got sign-off by the client. At this stage, we knew that our new concepts worked for the users and we found a working solution to solve the problem.

Development/Front-end - Drupal 8 Integration

A skilled developer assisted me in installing and configuring the CMS Drupal 8 using commerce. On my side, I have been creating the relevant styles and implementing all the pages within the CMS using my front-end/theming skills (HTML5, CSS3, SASS, Twig).

Impact & results

This is the first e-commerce website I have been involved with and leading the design process since inception. I managed to re-brand the website and create a better user experience and workflow.

The stakeholder was happy with the work we did for him. He really appreciated to be part of the process from inception. I don’t have any statistics yet, as the website is not live, but our clear process and the final result of the website made us confident that we solved the initial problem and improved the overall user experience.

Les Savons En gros website visuals Les Savons En gros mobile version
Back

ABOUT ME

Hi! I am a Designer specialised in creating digital products. My passion is to solve design problems and deliver solutions that address business and user's goals. In addition to that, I have good skills working with SASS, CSS3, JQuery, and HTML5. I also have experience working with the CMS Drupal 8. During my free time, I love developing my skills, reading books. For any enquiries, feel free to email me at contact@jerome-kalumbu.com. Thanks!