Premium Accounts

FLIGHTAWARE

At FlightAware, users who are interested in general flight tracking can create an account to save flights, alerts and airports. Users are able to enhance these features by choosing from 4 premium (paid) subscription plans. However, to many, these offerings often go unnoticed due to an outdated product page and confusing sign-up process.

Working with a fellow designer, we strove to improve these areas while implementing best design thinking practices into our product development cycle.

Role

UX/UI Researcher & Designer

Duration

2 months

Methods & Tools

Interviews, Surveys
Affinity Mapping
Wire-framing
Comparison Testing
Miro, Figma, SurveyMonkey

Context

The Problem

FlightAware’s premium account subscriptions are not widely known, nor easily accessible through our existing web and mobile interfaces. Currently, many of our users have Guest or Basic free accounts but remain unaware of all the additional features that can enhance their flight tracking experience. Despite being one of FlightAware’s oldest products, the Premium Subscriptions have not seen improvements in quite some time.

The Challenge

How can we improve our paid Premium Account offerings to bring value to our Guest and Basic users?

The Solution

Curate our Premium offerings for our different audiences and make the sign up process frictionless

The Process

Discover, Define, Design, and Deliver

To begin, I worked together with the Product Owner and another UX designer to formulate a plan of action. We wanted to use this opportunity to practice human-centered design thinking to really drive our design improvements from user needs. From conducting interviews and surveys, to creating initial wireframes, and finally testing and iterating upon multiple designs, we were able to revamp and deliver high-fidelity prototypes for development in both web and mobile interfaces.

User Research

SME Interviews

At first, we conducted SME (subject-matter-expert) interviews with Customer Service and Sales employees to get a glimpse into common user frustrations for our product.

PO Interviews

In addition, we also interviewed the web product owner to obtain a better understanding of how this product fit into the rest of FlightAware’s web products. From these conversations, we noticed that flight tracking and flying history were repetitive themes. Along with this, it was difficult to differentiate the unique audience for premium subscription product and our other web products, such as Global and FBO Toolbox.

Affinity Mapping done in Miro

Survey

We reached out to over 900 of our existing Premium Subscription customers to gauge their existing sentiments for our product. Out of 67 responses, we learned:

FlightAware users have no clear account or feature awareness.

From our survey, we learned that over half of our existing customers did not know what account type they currently had. Additionally, 90% of our Premium+ users thought they had access to a feature that was only available to the next higher tier.

Working professionals use their account differently from aviation hobbyists.

43% of our respondents use their account for only personal reasons, whereas 20% use their account strictly for professional use. Those who are personal users also indicated they access their account primarily through their mobile device (iPhone/iPad), while professional users use a desktop device.

Users highly value flight history, tail number information, and flight alerts.

Additionally, on average, these 3 features were within the top 5 most important features ranked and top 5 most frequently used by respondents.

Crafting User Personas

I updated our user personas to reflect these insights.

Ethan represents our typical aviation hobbyist, whereas Catchy and Sam represent two different types of "professional users"

User Personas

The nature of our subscriptions

A jumbled product page

When users come across the Premium Subscriptions product page, it is unclear which plan is best suited for them.

The burden is on the users to figure out which plan will serve their flight tracking goals by going through a list of features that are not organized in any particular way. The features themselves are not descriptive enough to inform the user's decision on what they are purchasing.

Additionally, there is not a clear CTA or sign-up available for taking the user the next step in their purchasing journey.

Original Premium Subscriptions Product Page

A confusing sign up process

Once the user figures out what to click on the product page, they are taken down a long and confusing path, involving multiple page changes and no re-navigation to get to their end goal of subscribing.

An frustrating experience that is consistent across all our subscription products, this flow can easily deter any potential customer from actually signing up.

Design Goals

How might we customize our account offerings to cater towards these personal and professional users, while capitalizing on our top features?
How can we make the sign-up process less frustrating and even delightful?

Ideation

Initial wireframes

Together, my fellow UX designer and I created initial wireframes for our web product page and sign-up process. During this ideation, we strove to clearly differentiate each subscription tier, while simplifying the process for signing up. These goals manifested themselves into:

Clear Product Page

• clear card layout with high-level descriptions for each plan
• clean, yet detailed comparison chart to directly compare between plans
• obvious CTA buttons for when the user is ready to make a decision

Simplified Sign-Up Process

• no more web page redirects
• seamlessly embedding account creation and billing information within the sign up process
• clear progress bar throughout the entire process

Initial Wireframes

Introducing Premium Subscriptions in our mobile app

Given many of our personal users access their features on a mobile device, we decided to introduce this product in our iOS app. As the lead mobile designer, I created initial wireframes to map out completely new product page and sign up processes within the app. This included introducing a new My Account section within the app and incorporating Sign in with Apple use cases.

Proposed User Flow

Testing out different options

Since these were completely new features within the app, I wanted to make sure these designs would be understandable and easily discovered by our mobile users.  I designed and tested 3 possible versions of the mobile product page.

Version A: Classic Vertical Card Layout
Version B: Common Horizontal Swipe for Tiers
Version C: More Detailed

From this usability testing, we were able to make an informed, data-driven decision on which product page design would suit our users the best.

I created one combined product page design that incorporated the best elements from each of the 3 wireframes. I also honed out the workflow to incorporate the user expectations we learned. These designs are currently being used as the framework for all of our future product offerings within the iOS app, such as Ad Removal, Premium Subscriptions, and Aviator (case study coming soon~)

Designs Used for Comparison Testing

From this usability testing, we were able to make an informed, data-driven decision on which product page design would suit our users the best.

Test Plan & Session Notes
Summarized Findings Presented to Stakeholders

Iteration + Refinement

Combining the best of all three mobile designs

I created one combined product page design that incorporated the best elements from each of the 3 wireframes. I also honed out the workflow to incorporate the user expectations we learned. These designs are currently being used as the framework for all of our future product offerings within the iOS app, such as Ad Removal, Premium Subscriptions, and Aviator.

Finalized User Flow
Improved Mobile Product Page Design

Concluding Thoughts

A cross-platform collaboration

As a complex product design project involved both mobile and web design work, this opportunity taught me valuable collaboration and communication skills amongst stakeholders. Not only did I need to consistently sync-up with my fellow UX designer, I also needed to communicate our user research and design progress to PMs, POs and web/mobile developers in a cohesive manner.  While doing so, I was able to gain a lot more exposure to the many web and mobile nuances, especially in terms of responsiveness across designs.

Growing our UX maturity

In addition to this, the project was a great opportunity to implement the design thinking process and build company confidence in user research and testing best practices. Given the time frame and resources, the design team was able to work with the product owner and PM earlier on in defining the business requirements and project scope. As a result, we could carefully identify the questions we had, craft out ways to seek answers, and design with clear intentions.

View Implemented Web Design
👋🏻 Thanks for reading!
@ Isabel Jiang 2023