UX/UI | March 2022
Boosting business value through web re-design
Mischief Makers is a facilitation agency with lots of focus on bringing energy and enjoyment to working, meetings and learning. They also offer trainings in facilitation for individuals and businesses.
This project is about discovering the usability issues in the current website, understanding the problem behind high bounce rates and create a new solution for this problem with a website redesign.
Help reduce bounce rates and increase conversions
Mischief Makers website was experiencing high bounce rates. It appears that most visitors get lost pretty quickly and can’t seem to find the information they are looking for to make decisions on the website, especially with users attemting to find info about their flagship course and register for it. This often leads to users leaving the website without fulfilling their purpose of visit.
The course detail page is one of the focus of the project because that's where most of the conversions are expected to happen.
User and business goals
The goal of the project is to reduce the bounce rates occurring on the website, especially the course pages. Therefore, we need to find the issues with the website and answer questions about what were the reasons users leave the website before actually getting anything done.
The solution should offer simplicity, straightforward and be aligned with the mischievous brand.
By solving this problem, users can spend more time on the website, understand the content and achieve their goals for visiting the website. This will also help boost conversion rates and help grow the mischief makers brand.
Defining the problem
I did some research to understand what was wrong with the current website. To wrap my head around facilitation as a business and how other facilitation agencies have presented their services, I looked into companies such as Abracademy and Limelights.
I analysed the current situation of the website and what can be potentially improved based on common web design practices.
I color coded the severity of issues found,
- Red is high severity
- Orange is mild
- Green for idea’s i’d like to iterate on, and maybe implement in the new website.
Google Analytics Data
I also looked into the Google analytics data from the website to see where most visitors are dropping off, how much time they are spending and the bounce rates for each page.
To understand what the potential users needs to understand about the facilitation courses, the important information they seek to help them decide if a course is for them or not, I interviewed 5 people that fits the persona that had been created by Mischief Makers.
With all the data gathered, I mapped out a customer journey to help me visualise what was really wrong and also to get stake holders to understand the research I’ve done. This made it easy to define the problems that needed to be solved, and shaped the direction my design would take.
The problems discovered
After measuring potential effort and impact, I chose to focus on these 3 problems to solve.
It began clear that visitors can’t find the information they need to sign up. Since this project is mainly focused on reducing bounce rates and increasing conversions, my primary focus was on the ‘course details page’ where courses are sold.
- No hierarchy on information on the page: Visitors want to find the right information they need on time, without guessing what they’re looking at. Users are bouncing because finding information is not user friendly and tedious.
- Current website has usability issues, including poor information architecture. It violates usability heuristics - Consistency & standards and multiple UX laws, including hicks law. There are often too many CTAs in view at same time, which leads to confusion.
- Not much trust and credibility offered: Users need to see testimonial and case studies to feel secured in making purchases. Adding an FAQ section to training pages will make it easier for visitors to find answers they need in order to sign up for a course.
Ideation & prototyping
Userflow and site map
I began by mapping out a user flow for the ‘course details page’ to highlight important user touchpoint. I rough sketched several flows user might take to reach their goals. I also created a site map from this flow, then color coded each sections based on answers most users want answered. The colors made it easy to see where different kind of information is located across the site and how to navigate there. Also made it easy to explain my progress to stakeholders.
The Solution #1
I restructured the pages to display information according to relevance and importance. The page structure guides users to where they need to be, including new navigation designed to help users find what they're looking for quicker.
The Solution #3
Homepage Hero Section
Hero section is the best opportunity to engage users. The current content on the homepage is aligned with the brand, the hero section can be used to communicate the company’s “what?”, faster.
The Solution #4
Boosting trust and credibility
To gain trust and credibility, I redesigned the case study section to feature several case studies with a navigation feature and filter options that helps users quickly find which case study they find most interesting.