case study - 2021

The Bright App

How we gave a total UI refresh of an outdated marketing website to drive in more traffic
The Bright App is a mobile app made to alleviate pain points of scheduling remote work out sessions between trainers and their clients. I was asked to redesign the current marketing website to clear confusion on the app's value to these two different types of users and to drive more app downloads.
My Role
User Research, Strategy, Information Architecture, Wireframes, UX Copy, Visual Design
Team
James Zhang, Product Manager
Matt Pine, Software Developer
Tools
Figma, Trello
Timeline
4 weeks

The Problem

Defining the Challenge

The biggest challenge was understanding what the product's MVP and separate features were to trainers and clients, and then translating that information to be easily digestible on a website.
Usability
Confusing copy, repetitive information, excludes important content
Visuals
Blurry images, jarring colors, uneven spacing, unaligned sections
Original mobile website

Our Design Goal

Users
Understands the app’s features & benefits
Intuitive navigation
Visual rebrand
Website
Drives more app downloads
Business

The Solution

The Solution

Key Features

1. Homepage (for clients)
2. Jobs (for trainers)
3. Fitness Intake Survey
After a potential client is interested after learning about the app on the homepage or is directed there from the sales team, they are directed to take a survey to connect with a personalized trainer

Key Features

Design Process

Understanding the Problem

To narrow down the most relevant issues, I interviewed subject matter experts and target users on the current marketing website to understand the product.

"This just needs to be better in general...it's an easy website to use, but the wording confused me. It's unclear how it's for clients."

- Stephanie, personal trainer

User Personas
I realized that there was no clear disparity between the two target users, so I created user personas to help lead the rest of my process based on real clients and trainers.
Client
Trainer
Current User Flow
To meet the business goal of driving more downloads, I needed to know how users were arriving to the website. For example, if they are driven by targeted SEO ads, then the call-to-action download button should be above the fold.of a div block.

Ideating a Solution

Site Map
Through user research and auditing, I realized that the original site map missed a lot of the important features of the app that the client wanted to showcase, aka confusion from users.
Wireframes
I did two iterations of wireframes through stakeholder approval and team collaboration, focusing on copy and site layout.
Success
Opportunity

Visual Design

I wanted to make sure that the marketing website was visually correlated with the app, so I decided on a color palette of complementary shades of blue and removed the jarring orange to keep the content neutral and professional.

Next Steps

I packaged the final designs to be handed off to the software developer, and we successfully shipped the website. The client was great to work with, as they emphasized close collaboration and trusted my design decisions.
Success Metrics
Within one month of the launch, the onboarding survey had a 40% completion on the survey with 19% of visitors on the website clicking to take the survey. It helped break leads in finding a product market fit, led to more internal hires, and data towards a better CRM and sales process.
User Testing
There wasn't enough budget and time to accommodate full user testing for both research and validation, so I relied heavily on subject-matter experts and a few users provided by the client.
Next Project //

Meridian