Legacy Redesign
All Star offers non-traditional students the ability to connect with different schools. Their legacy request for information (RFI) experience had not been updated in over a decade which focused more on the desktop experience despite the target audience’s growing mobile presence over the years. Data has shown that conversion had begun to drop prompting a need for a redesign.
Tasks
- Competitive analysis
- Update the mobile experience
- A/B test
- Iterate
Evaluation
The Legacy Design
Students select schools they want to contact through All Star’s system. Their information is sent to the school and the school reaches back out. The original experience was created for desktop and the mobile experience just shrunk down that desktop version to a smaller screen. Besides typical UX best practices that could improve the mobile experience, some other opportunities included
- Lowering cognitive overload – Drop-off occurred at this stage (inferred from Hotjar recordings) with users scrolling the length of the screen then exiting the task
- Optimizing for mobile – It’s hard to read and it’s hard to tap on inputs/buttons
- Hierarchy – There’s redundancies and a lot of small content which could make it difficult for customers to focus on the task
Competitive Review
Evaluating the Flow
Compared to the experience of All Star’s top performing competitors, the flows were also very different. While All Star utilized a single form for each chosen and suggested school, the competition relied on a streamlined experience that gathered the necessary information to send to all chosen schools at once.
All Star Original Flow
Single RFIs for every school in the experience.
Competitor Flow
All information is gathered first.
A New Streamlined Wizard Flow
When it came to updating the flow, I opted to follow a similar streamlined pattern utilizing a wizard flow that focused on individual questions to help guide the user through the entire end-to-end process.
Updated Wireframes
Mobile Optimization
Here’s a look at the updated wireframes using the new wizard flow and optimized for mobile.
Putting It All Together
UI and Interaction
The new experience is built to move the user through and make it easier for them to accomplish their task. Here’s some of the changes that were implemented:
- Touch friendly inputs and buttons
- Larger text with clear conversational prompts
- Progress bar
- Forward progress transition to the next screen
An A/B Test Win
Confidence for New Initiatives and Continued Iteration
We did an A/B test on this new wizard style experience in comparison to the original. Past attempts at updating this experience failed when it came to A/B testing, but this new experience was able to increase conversion by 7%. This success gave leadership confidence in our team’s ability to deliver and we were able to move forward with other planned initiatives to update the rest of the experience including updates to the pre-filter and school listings page.