Project Overview

Lash Up Pro is a prominent e-commerce store specializing in beauty products, particularly lashes and accessories. A significant aspect of the website is its Learning Management System (LMS), offering users the ability to purchase and engage in courses covering everything from applying lash solutions to running their own beauty studios. The project aimed to revamp the user experience and modernize the design, focusing on making the purchasing process and learning platform more intuitive and accessible for users.

Objectives and Challenges

Initial Problem:

Lash Up Pro’s previous website was outdated, with a poor user experience that often left customers confused about how to navigate the site, particularly within the LMS. The design was not user-friendly, leading to frequent customer inquiries and a drop in conversion rates. Additionally, the process for managing in-person course attendees was cumbersome for administrators, particularly when handling deposits and tracking participant information.

Project Goals:

• Enhance User Experience (UX): Simplify navigation and interaction, especially within the LMS.
• Modernize Design: Implement a clean, modern design that guides users through the purchasing and learning processes.
• Improve Administrator Workflow: Develop custom solutions to streamline the management of in-person courses.
• Increase Conversion Rates: Leverage the design overhaul to boost sales, particularly during high-traffic periods like Black Friday.
• Implement Advanced Product Filtering: Introduce a custom product filtering system to enhance user navigation in the shop.
• Streamline Checkout Process: Integrate a dynamic cart feature to enable quicker checkouts and improve conversion rates.

Key Challenges:

• Understanding and addressing the pain points experienced by customers during their interaction with the site.
• Designing and implementing a seamless user journey that reduces friction and increases satisfaction.
• Creating custom solutions to simplify backend management for in-person course registrations and payments.
• Integrating advanced product filtering and dynamic cart functionalities without disrupting the existing WordPress ecosystem.

Process and Approach

Research and Planning:

Given my prior experience with the client, I had a solid understanding of the existing issues. However, to gain deeper insights, I collaborated with the UX/UI designer to conduct surveys and UX sessions with potential customers. This research was critical in identifying the key pain points from a user perspective, not just an engineering standpoint.

Design and Development:

The project was approached with a user-first mentality. We developed a new design that was simple, clean, and modern, ensuring that users were intuitively guided through each step of the purchasing and learning processes. The LMS was given particular attention, with user flows designed to minimize confusion and enhance the learning experience.

To further improve user navigation within the shop, I implemented a custom product filtering system using React.js. This system seamlessly integrated with the WordPress ecosystem, allowing users to easily find the products they were looking for without unnecessary clicks. Additionally, I integrated a dynamic cart feature that allowed users to proceed directly to checkout from any page, significantly reducing the steps required to complete a purchase and boosting conversion rates.

To address the challenges administrators faced with in-person courses, I created a custom solution that centralized attendee management. This solution included a specialized view that aggregated all relevant attendee information, such as payment status and course registration, which was particularly useful for tracking deposits.

Project Management:

With a team of just two, communication and collaboration were key. The designer and I worked closely to ensure the design met both aesthetic and functional goals. Regular feedback sessions with the client allowed us to stay aligned with their vision and make necessary adjustments in real time.

Solutions and Execution

Technical Solutions:

• WooCommerce and LearnDash Integration: Leveraged WooCommerce for e-commerce functionality and LearnDash for LMS features, integrating them to create a seamless experience for users.
• Custom Product Filtering: Developed a React.js-based filtering system, allowing users to easily navigate the shop and find products quickly.
• Dynamic Cart Integration: Implemented a dynamic cart feature that allowed users to check out directly from any page, reducing friction and improving conversion rates.
• Custom Administrator Tools: Developed a custom view for managing in-person course attendees, significantly improving the efficiency of tracking and managing registrations and payments.
• UX Overhaul: Implemented a user-friendly design that drastically improved navigation and reduced user confusion, particularly within the LMS.

Design Decisions:

The decision to focus on a minimalistic design with clear, guided user journeys was pivotal. By reducing visual clutter and emphasizing key actions, we made it easier for users to navigate the site, whether they were shopping for products or enrolling in courses. The integration of the product filtering system and dynamic cart further streamlined the user experience, making the purchasing process as seamless as possible.

Innovations:

• Custom Product Filtering: This feature was a game changer for the user experience, allowing users to find exactly what they needed quickly and efficiently.
• Dynamic Cart: By enabling immediate checkout from any page, we removed unnecessary steps in the purchasing process, significantly boosting conversion rates.
• Administrator Tools for Course Management: This custom solution enhanced backend efficiency, making it easier for administrators to manage in-person course attendees.

Tools and Technologies:

• WordPress: Core CMS
• WooCommerce: E-commerce functionality
• LearnDash: LMS platform
• React.js: For custom product filtering and dynamic cart features
• Custom PHP/JavaScript: For developing the administrator tools and enhancing user experience

Results and Impact

Quantitative Results:

• Increased Conversion Rates: The revamped website launched in November and led to the highest Black Friday revenue ever for Lash Up Pro, demonstrating the effectiveness of the design overhaul and new features.
• Reduced Customer Support Inquiries: The simplification of the user experience, particularly in the LMS and shop navigation, led to a significant decrease in customer inquiries related to site navigation and usage.

Qualitative Results:

• Enhanced User Satisfaction: Users reported a smoother, more intuitive experience, which was reflected in positive feedback and increased engagement.
• Streamlined Administrative Processes: The custom solution for managing in-person course attendees significantly reduced the time and effort required by administrators to track and manage registrations and payments.