Improving User Experience to Boost Conversion Rates

Project: CAA Saskatchewan

Improving User Experience to Boost Conversion Rates

UX Redesign & Accessibility Audit of the Membership Registration and Renewal Workflows

Role: UX & UI Designer / Information Architect / Frontend Developer / Accessibility Engineer
Team: Anders - Director of UX  / Patrick & Mito - Software Architects / Brayden - Project Manager

CAA Saskatchewan - Logo

About CAA Saskatchewan

CAA Saskatchewan is a member-based organization offering a wide range of services designed to meet the needs of drivers and travellers. Its core services include 24/7 roadside assistance, towing, battery boosting, flat tire changes, and lockout assistance. In addition to roadside support, CAA provides various insurance products, including auto, home, and travel insurance, often with exclusive discounts for members. 

Project Results

  • Decreased user abandonment rate
  • Reduced registration and renewal flow complexity
  • Improved accessibility
  • Improved page load speed and interaction responsiveness
About CAA SK - Join Page

Project Highlights

Usability / Performance Testing
Usability / Performance Testing
Workflow Diagrams
Workflow Diagrams
UX / Accessibility Audit
UX / Accessibility Audit
Figma Prototypes
Figma Prototypes
Software Development
Software Development
Remote video URL

Registration and Payment Flow Challenges Hindering Conversions

The client experienced low conversion rates due to a series of user experience issues in their membership registration and renewal flows. Some of the key issues identified:

Slow Site Performance

Slow Site Performance

With delays of up to 15 seconds in form navigation and product selection.

Visual disturbances

Visual disturbances

Frustrating visual and technical bugs, sometimes impeding progress, at overall contributing to user confusion.

Overly Complex

Overly Complex

High registration complexity - users explicitly expressed frustration, stating the process was time consuming and often confusing.

Awkward Modal Use

Awkward Modal Use

Membership plans were difficult to compare, and the overuse of modals, especially on mobile, made navigation cumbersome.

Disruptive Payment Process

Disruptive Payment Process

The payment process was disrupted by an embedded iframe from a third-party processor.

Separate Login System

Separate Login System

The separate login system caused confusion by taking users out of the registration flow.

Streamlining the User Journey

The client had already established customer journeys and identified key pain points through their own research, so our first task was to develop new user flows that fit the users' mental models.

Membership Renewal

Account-based renewal and the express renewal process followed the same flow and required the same information. These were merged into a single journey (save for their entry points) to ensure consistency and familiarity, while also improving code efficiency and maintainability.

Membership Registration

The registration process was complex, supporting multiple scenarios: self-registration, third-party registration for gift memberships via anonymous purchasing, and third-party registration through account-based purchasing.

What About That Performance?

In addition to the user flow redesign, we identified and addressed several software issues through a technical discovery, so as to improve site performance. Close collaboration with the software team was crucial to determine the optimal solution within budgetary and time constraints.

CAA SK - User Flows
CAASK - Design System

Simplicity and consistency with a design system.

To maintain consistency and ensure efficient design to dev handover, I developed a design system that aligned with the client's existing brand and design language, then modernized and redesigned key elements based on reusable components. High fidelity prototypes were then created to validate the structure and user flows of the site.

Reducing Complexity, Improving UI, Eliminating Frustration.

Maintaining user engagement and focus, while maintaining ease of use is crucial as their customers fill out forms that require sensitive information.

I streamlined the multi-step form by grouping related fields, removing elements like the 'promo code' and placing them in the order summary, similar to a more traditional online shopping cart.

User confidence was enhanced by providing clear feedback, displaying previously entered information, and allowing users to easily edit any information that may have been entered incorrectly.
 

Remote video URL

Results

While the client is still collecting more metrics and reviewing the results, they were happy with the significant performance improvements, and refined user flows for their new membership renewal and registration processes.

Impact:

  • Significant reduction in complexity.
  • Major performance boost, and increase in site responsiveness.
  • Increased customer engagement, and confidence.
  • Decrease in abandonment rates.

Questions or Comments?

Excellent, fire away.