Hypefive

Introducing the worlds FIRST profile agnostic social fitness network.

Year

1 month, 2022

Services

UXUI Researcher

Team

Alan Boccadoro, Valery Moore, & I

About

Hypefive, created by Cristina de Leyvais, is the worlds first hybrid app- bringing together what we love most about fitness and social apps.

THE PROBLEM:

The Hypefive MVP is missing their exploration and saves pages. Additionally, it lacks the attachment aspects a user needs in order to form a positive relationship with an app, thus creative a positive consumer retention rate.

THE SOLUTION:

We restructured the apps flow and combined their "Recommendations" feed into their main feed as well as updated the MVP to bring it up to competitive standards.

THE RESEARCH

Understanding the MVP

As we were the first designers to review the MVP, it was vital we did a thorough job to set the app up for success.

That said, we reviewed the MVP and tested it with an initial set of users to get a gage on how the current prototype is performing.

ACCESSIBILITY ❌

Users had trouble viewing content as well as navigating to the "Recommendations" page.

COLLECTIONS PAGE ✅

This page had users excited and mentioning how it would be helpful for workout inspiration.

MONETIZATION ?

While a free app is great, the current MVP did not allow for ways to implement monetization factors like sponsorships/ads which posses a questions as to how the company can sustain itself.

COMPETITIVE ANALYSIS

How can we stand out?

In conducting a C&C analysis with three fitness apps, we can understand what already existed and where there are gaps.We also took a look at a popular social media app and focused on the idea of a "Recommendations" & "Collections" page.

DEFINING THE USER

FROM SEVEN DOWN TO TWO

Hypefive started with seven personas, aiming to represent a diverse set of users.
‍
However, based on our findings from research and interviews, we narrowed it down to two personas to represent each spectrum of the users. This would help our team stay agnostic, be able to visualize the gaps/problems and provide our client with a visual of the story we want to convey.

THE DESIGN PROCESS 1 of 2

How can we design the Recommendations page?

Because users were unsure of the concept of a separate or blended recommendation feed, the initial move was to create a separate page, just like our client originally wanted. The results of this would also bring clarity as to whether or not the icon was intuitive.

It wasn't intuitive..

Users could not figure out how to get to the recommendations page as the icon was not intuitive. Additionally users were confused as to why there were two different feeds.

With this feedback, we designed and tested a new design- blended feeds and to conducted another set of usability testing.

We had a winner!

After conducting a second round of user testing with new users and the combined feeds, results showed as much as 40% decrease in time for task completion.

THE DESIGN PROCESS 2 of 2

How can we design to save?

Being able to personalize makes the user feel special and develope a level of attachment to the app. So, keeping the concept of information overload in mind, and our comparative analysis results, we decided to bring the collections up to competitive standards.

A BONUS:

WCAG standards

Now that we had some mocks and had brought those up to WCAG standards while maintaining Hypefive's branding, we decided to take a look at the remaining pages of the app and provide recommended suggestions.

We chose to do this at the end in order to open up a discussion with the stakeholder and provide before and afters for further visual persuasion.

RETROSPECTIVE

What went well

Usability testing of the initial prototype. This would help me not only understand the product better but also get a gage on what areas need to be improved.

What could have been improved

Mixing design softwares. Prior to this client, no one on our team used AdobeXD so this coupled with the timeline, we had to mix design softwares and while it was a overall smooth process, it was far from ideal.‍

What I learned

Empathy FIRST
‍Straying away from the client's original ask of building out a recommendations page was nerve-wracking. Still, it allowed me to practice being an empathetic designer and offering solutions that would not stray too far from the original UI.