The following is the story of a project with one of my past clients. I think it’s useful to share this story here, because it’s a good example of what can happen when a project is planned carefully, with the right professionals.
This e-learning business went from $10,000 of profit each month to earning over $150,000 in one single week, to be honest is even better, most profit happened in 4 days.
Using WooCommerce, this business sells a video course for a specific niche.
The starting point
Let’s begin with some background. The business was already doing well when they hired me for this project. The team had a high-quality product and a good social media following, but the website presented several UI/UX issues.
The WooCommerce theme on this website was a well-known premium theme, used by tens of thousands of online stores. Opting for this default look was part of the problem. The visuals weren’t unique to the brand, and the navigation wasn’t tailored to their customers’ needs.
The client was planning to run a promotion on an important weekend in their business vertical. These promotions had achieved decent results in the past, but they knew it was time to refresh the main landing page to attract more customers.
For this project I took care of the redesign of the landing page in Figma, and then developed the necessary custom template parts and blocks on the WordPress website.
There was one catch: I only had nine days to design, develop, and publish the new landing page. Nine days can be a long time when I need to build a landing page completely alone, but here I needed to plan for the project together with the client and their copywriter.
I usually wouldn’t accept this type of work. It’s never a good idea to rush a project, and doing so can often lead to poor results and a bad experience on both sides. I made an exception because I already agreed on a precise design style with the client. I’d also worked with this client before, which made it easier to manage expectations.
With such a tight turnaround, I could’ve started the design process straight away, but I decided to do something different. Since this was a unique type of project, a ‘standard’ approach seemed too risky.
The Process
Before drawing a single line of the wireframe, I had an initial meeting with the client to discuss the structure of the previous landing page. From there, we created a shared Google Document, where we detailed the pros and cons of the design they were already using.
We outlined some new sections for the website to better describe their product. During this phase we decided on some key improvements, including:
- More answers in the F.A.Q. section to cover some of the common questions about the course.
- A new introduction with a highly relevant and impactful testimonial.
- A more precise description of the course content, with three summarized points and a small additional list.
- A new section to describe who this course would be ideal for, which is crucial in identifying the right customers.
After creating the Google document and listening to the client and their copywriter feedback, I knew exactly what I was going to design for this website.
In two days, I created a high-fidelity mockup with Figma, which was quickly approved by the client. Three days later, I’d finished developing, testing, and optimizing the page load speed of the landing page in WordPress.
Overall, we maintained the same premium theme for the rest of the website to speed up development, but I created a child theme with custom code for the new landing page, including a custom header and footer.
The result was a new ready-to-go landing page, optimized for their target market, both visually and structurally.
The Result
The initial goal was to sell 600 copies of the course during the entire weekend. We went online with the new landing page on a Thursday night, and within the first two days, we reached our goal. In fact, we went well beyond it and got more than 500 sales in a single day, and 800 sales in total by Saturday.
The great quality of the course and a few key factors contributed to this outcome:
- I didn’t start the design without first asking the client specific questions about the project objectives, which resulted in a detailed plan with input from both sides. Reasoning and strategizing with the client was essential in this project. We focused on the why behind every single section: “Why is this section necessary?” – “Why are the sections on this page in this order?” etc. I did my best to motivate every design choice.
- The client was flexible and took the time to share relevant information with me throughout the project, despite the short timeframe.
- The client didn’t waste time on marginal design details. We both did our best to be objective about the design choices, and we agreed to follow a specific design style before starting.
- The course was a high-quality product. The copywriter and the client did honest marketing, they were transparent and didn’t promise to their customers something impossible to deliver.
We could have sold to more customers with more time to work on this landing page. Because of the tight timings, we had to compromise on the menu structure and other smaller details. We didn’t have time to do proper UX research before the launch.
By redesigning this landing page alone, even the website itself saw several benefits:
- The new header and footer improved the website’s navigation across every page. This helped lower support requests, and the amount of users who quit the website without purchasing anything.
- The optimized design helped the client maximize their conversion rate and get the most out of their campaign for this specific product.
- Users were able to get a better sense of the product before investing their money into the course, which helped to manage expectations (and kept refund requests low).
- The UX improved on desktop screens, and even more on mobile. This helped to increase sales of other products from this same business as well.
If you’re looking to convert more users into customers through your website and you’re curious to know how we could improve your website, get in touch with me using this link. I’d love to help!