Case Study: Aerial yoga studio’s website

Role: UX Design, UX Research, Usability Testing, Prototyping

The Problem

The website for this aerial yoga studio faced a dual challenge that significantly impacted its performance. First, the existing design and user interface hindered the site’s overall usability, causing potential customers to encounter difficulties in navigating and accessing essential information. Second, the website’s inefficiencies were contributing to a limited customer base, failing to attract and retain users interested in aerial yoga classes.

The Goals

The project's overarching goal was to elevate the performance of the aerial yoga studio's website by addressing usability issues and strategically redesigning key pages to increase customer engagement. The scope was to redesign 2 pages. The specific objectives were:

  • Enhance Usability: The primary aim was to streamline the user experience by addressing identified usability issues. The redesign focused on simplifying navigation and improving information architecture.

  • Increase Customer Base: To attract and retain a wider audience, user research was performed. Also, the redesigned pages aimed to effectively showcase the classes in a clear and concise manner.

  • Improve Conversion Rates: By creating a more user-friendly and persuasive design, the project sought to increase conversion rates, turning website visitors into active customers. Clear calls-to-action, improved sign-up processes, and accessible scheduling information were prioritized to facilitate the conversion journey.

The solution involved a targeted redesign of two critical pages based on user-centric design principles, incorporating feedback from the heuristic evaluation. The project sought to create a website that resolved issues, attracted new customers, and grew this aerial yoga business.

The Process

Heuristic Evaluation

The evaluation of the studio’s website before making design decisions involved a heuristic evaluation using Jakob Nielsen’s 10 recognized usability heuristics. The methodology included inspecting various pages such as the homepage, About, Classes, Plans & Pricing, and Distance Learning, and rating each finding based on severity using Nielsen’s scale.

The results highlighted both strengths and weaknesses across Nielsen’s heuristic categories. Positives included good visibility of system status and standard navigation conventions. However, significant issues were identified, including unclear course purchasing processes, limitations on user control and consistency, cluttered layouts, accessibility concerns, and incomplete distance learning content. These findings aim to guide targeted improvements in the website’s usability.

  • After choosing a plan to purchase on the ‘Plans & Pricing’ page, the user is taken immediately to the checkout page. Here the ‘Shopping bag’ icon does not reflect the choice, still showing ‘0’. When the cart button is pressed, the cart shows up as empty. This means the user cannot add the plan to their cart and continue browsing the site while choosing to check out later. The cart only works for the “Distance Learning” courses, which could create confusion and inconvenience for the user.

  • The current schedule page illustrates the schedule in 4 images. These images are very busy and low-contrast, making them tricky to read for people with vision impairments. When looking at the Plans & Pricing page, there is no clear order for how the page is organized. A newcomer might expect to find trial classes or drop-in classes listed first. However, the first item is ‘open studio time,’ which is for experienced performers. As the user scrolls down, they will find no organization. For example, singing classes are next to aerial lessons.

  • The current schedule page illustrates the schedule in 4 images. These images are very busy and low-contrast, making them tricky to read for people with vision impairments.

User Research

The user research phase was conducted to understand user preferences and expectations regarding fitness studio websites. Seven individuals aged 18-34, with diverse fitness interests and backgrounds, were interviewed. The process gathered demographic information and detailed insights into participants' fitness habits, website usage patterns, online purchasing experiences, and their likes and dislikes regarding fitness studio websites.

Key findings include:

  1. User-Friendly Design: A unanimous preference for easy navigation and clear organization on websites was noted, emphasizing the importance of an intuitive design.

  2. Crucial Information: Easy access to class schedules, details about studio offerings, and a preference for modern, sleek website designs were highlighted as essential.

  3. Negative Influences: Difficulties in navigation, unclear signup instructions, and unprofessional appearances were major deterrents for users.

  4. Preferred Research Methods: Participants primarily used Google reviews, other review sites, and the studio's own website to research and select a fitness studio.

Personas

Based on the user interviews, I created 3 Personas that represent possible customers.

erin persona.png
jake persona.png
lisa persona.png

User Stories

To align the website with the needs and goals of different user personas, user stories and acceptance criteria were developed, emphasizing key tasks and motivations from the users' perspectives. For instance, a user story for a budget-conscious student persona highlighted the desire for affordable fitness options, leading to acceptance criteria that demand clear pricing and detailed course descriptions. With 11 user stories for three personas and over 20 acceptance criteria, this approach ensured the website’s redesign would cater effectively to target users, embodying a user-centered design process critical for meeting both user needs and business objectives.

Usability Testing

The usability test was designed to evaluate the aerial yoga studio's website for three specific user personas: Budget-Conscious Student Jake, New to Fitness Erin, and Busy Professional Lisa. Each persona had a scenario crafted to simulate how potential customers might use the site to find class offerings and complete purchases, aiming to uncover usability issues that could hinder new customer acquisitions. The test's objectives focused on navigation ease, visual appeal, and the simplicity of the purchasing process.

Five participants, reflecting the early 20s to mid-30s age group with an interest in exercise, were recruited to ensure a variety of perspectives aligned with the user personas. The test was conducted remotely using Lookback software for data recording, encompassing tasks such as looking up class schedules, exploring virtual class offerings, and initiating the purchase process for selected classes.

As well as designing the test I was also test moderator. My responsibilities as test moderator included conducting the test, facilitating recruitment, analyzing results, and guiding participants through tasks. The procedure involved pre-test surveys, scheduling, consent form signing, the actual testing, post-test surveys, and closing remarks to gather comprehensive feedback and insights to enhance the website's usability and conversion rates.

Testing results:

During the usability testing involving 5 participants and 6 tasks, several significant usability issues were identified, leading to a success rate of 63.3%. Key findings revealed both major blockers and issues that affected the completion of tasks and user satisfaction.

Blockers included the difficulty in finding where to purchase online classes, as these were not listed on the Pricing page alongside other offerings, preventing users from completing online purchase tasks. Similarly, information on each in-person class was hard to locate, acting as another significant obstacle.

Major issues involved confusion between the “Book Online” and “Pricing” pages, with users struggling to understand the distinction between booking appointments and purchasing class packages or memberships. The overall page organization led to unintuitive site navigation, with users often not realizing they had reached the correct page due to confusing menus and flows.

To remedy these problems, the following solutions were proposed:

  • The “Book Online” page should just offer booking and should no longer sell single classes on this page.

  • All classes should be purchasable on the "Pricing" page, including single-class packages and virtual classes. After purchasing the class, the person can then book.

  • Provide short class descriptions on the Booking page so users can learn about each class offering.

  • All classes on the "Booking" page should briefly describe the course.

  • All classes on the “Pricing” page should be organized into groups for easier navigation.

Implementing these targeted changes will significantly improve major pain points and obstacles identified by real users during evaluation. Improving findability, clarity, and simplifying flows will make the site far more usable for diverse visitors.

Drafts and Prototypes

The scope of this project did not permit me to do a full site redesign; instead, I focused on 2 pages that I found had significant issues.

Low Fidelity Prototypes

  • New “Pricing page”, reorganized for easier navigation. Includes the option to purchase virtual classes which was on a separate page in the original site.

  • I created a new Schedule page for classes that are currently offered. This page will replace the low-resolution images on the site that currently show the schedule. To incentivize customer purchases, I also added the option to buy courses from this view.

  • New navigation bar without Book Online option. Booking will be found exclusively under Classes -> Schedule. This will avoid confusion and facilitate a simple course purchasing process.

High Fidelity Prototypes

Given the timeline and resources for this school project, the high-fidelity prototypes did not achieve the level of refinement I aim for in my UX work. However, they served their purpose in validating design direction and capturing core flows. For a production launch, further iteration on interactivity, transitions, and visual polish would be undertaken to meet my standards of quality.

Lessons Learned & Next Steps

Overall, this project to redesign key pages on the aerial yoga studio's website was a valuable learning experience. Conducting the heuristic evaluation provided critical insights into usability issues to address. The user research and persona development also helped guide the redesign priorities. Creating low-fidelity drafts enabled quick iterations to test ideas before diving into higher-fidelity prototyping. Using Figma to generate clickable prototypes was invaluable for simulating flows.

However, the usability testing process provided the steepest learning curve. As my first time moderating tests using Lookback, I underestimated the level of preparation required. Recruiting representative participants and crafting scenarios that effectively evaluated the designs were more difficult than anticipated. If repeating these tests, I would allot more time to recruit participants and refine test protocols.

Additionally, while the project focused on key pages, expanding the redesign and usability testing to cover more site sections could have revealed further usability problems and more complete insights. However, as this project was a class assignment, I was limited in time and resources. Moving forward, I aim to improve my user research and testing methodologies to gather higher-quality data. As I take on more complex projects, adopting tools to streamline recruitment, testing, and analysis will maximize efficiency.

In conclusion, I found some issues on the website that made it difficult for users to make purchases and book classes. Therefore, I focused on developing solutions that simplify navigation and make the information more accessible to users. As a result, I have significantly improved the website's usability and enhanced the overall user experience by addressing these concerns.

The changes I made to the "Book Online" and "Pricing" pages and the addition of class descriptions should help users find what they are looking for more easily. I also reorganized the classes on the Pricing page to make it simpler for users to find and purchase the courses they want. Overall, these solutions have made the website more user-friendly and should improve user experience.

Next

Project Two