Erialsoft
Summary:
A team of designers, developers, product managers, and business analyssts embarked on a redesign journey for a fitness app. We were brought in to completely redesign the original, "unsuccessful" app from the ground up. Initial research uncovered many user frustrations, prompting us to take action on this knowledge, and employing techniques such as User Personas to keep the user at the center of the process. Drawing inspiration from ideation sessions and competitor analysis, we discovered and integrated innovative features into the redesign that were missing in the original version. Wireframing and user flows provided clarity in design direction, while low-fi prototypes evolved iteratively based on user feedback, with a focus on accessibility and simplicity. Usability testing further refined the mockup, resulting in a user-centric final design that all stakeholders were thrilled by.
Chapter 1: The Process (To Affinity, and Beyond!)
Our journey began with a kick-off meeting with the fitness-savvy stakeholders: Dan, Sarah, and Cyndi -- very different members of the same family. Communication was key, laying the groundwork for trust and direction. Despite differing visions, we found common ground: the need for a major overhaul, focusing on social integration.
Key Takeaways:
- Effective communication builds trust and direction. The earlier this is incorporated, the more money will be saved throughout the development lifecycle.
- Finding common ground among stakeholders is crucial, and facilitating this through effective methods is priceless.
- In this instance, what all three owners agreed that they wanted a modern-looking app that allowed for tracking progress and visualized the data in a clear, concise way.
Chapter 2: Survey Says!
Seeking insights from the first generation app's users, we sent out approximately 200 surveys, ultimately receiving feedback from 41 respondents. This data validated initial assumptions (such as user unhappiness with the layout, navigation, diversity of exercise, and perceived value) but prompted deeper qualitative research.
Understanding the User's Path
We requested interviews from the 41 survey responders. We successfully set up 6. These interviews further highlighted and confirmed user frustrations, especially in locating basic app features like exercises, underlining the great need for improvement in user experience. Users tended to stress a lack of intuitiveness in the location of things like exercises, support, and ways to keep track of progress.
Defining the User Persona
Field research at gyms were also conducted, which informed the creation of diverse user personas, which highlighted the importance of time management and ease of use.
.png)
Key Takeaways:
- Surveys provided quantitative insights, such as users unhappiness in the realm of navigation; this was important to validate assumptions.
- Qualitative research highlighted user frustrations and areas of improvement, such where to find important locations within the app.
- Users personas derived from field research emphasized time management and ease of use.
- In fitness apps, we learned that there is a hunger for social integration, which we prioritized for the app redesign.
Chapter 3: Sizing up the Competition
Competitor analysis revealed opportunities to differentiate our app, particularly in catering to beginners and enhancing search functionality. There were multiple examples of competitors failing to utilize search functionality to prioritize user's time. Additionally, none had a focus on enriching the user through interesting education.
Brainstorming Solutions
We used several methods to brainstorm, such as Crazy 8's; through this, we generated design ideas, focusing on features like simplified navigation and instructional videos to guide the user to educate users visually, and help ensure proper form and rep/set amounts.
.png)
Key Takeaways:
- Competitor analysis identified opportunities to differentiate the app, such as through quality education and effective search functionality. Due to the diverse and vast amount of information in fitness, utilizing an auto-complete search function would help users not only find what they want, but introduce them to more concepts and knowledge.
- Brainstorming sessions generated several unique design ideas, with us repeatedly discovering the significance of simplified navigation and instructional videos to differentiate and add value to our app.
Chapter 4: Wireframes, Where Squiggly Lines Become the Blueprint for User Happiness
Making Sense of Madness
Collaborating with stakeholders and other members of the team, we gathered and neatly compiled all the research (as well as important details that were hammered down through our brainstorming sessions). We began piecing the puzzle together, creating a picture to guide wireframe development, all whilst emphasizing user-centric design (which our User Personas earlier in the process helped guide).
Mapping User Flows
Initial user flows were drafted to ensure a streamlined experience, particularly for new users selecting their fitness level and focus. We kept things simple, and ran it by the stakeholders.
Key Takeaways:
- We compiled all data and research up to this point to ensure we were solving the right problem with our design.
- User flows were drafted to ensure a streamlined experience, particularly for new users to lower the barrier of entry for newcomers. By making the registration process as simple and user friendly as possible, new users simple and user-friendly, it would ultimately aid in retaining users since the simplicity compelled users to create accounts and provide the company with contact details, such as their email.
Chapter 5: Low-Fi Prototypes
Building from Feedback
We had many meetings with interdisciplinary team members and stakeholders regarding the wireframes with the intention of progressing and strengthening them. We wanted to ascertain what was possible to be developed, what priority to develop them, and the quickest way to get to our goals. We also had the opportunity to showcase the wireframes to selected users (as well as family members of staff, which was very humrous at times!) to get feedback. Through this process and through eventual user testing of wireframe prototypes, these wireframes evolved into becoming low-fidelity mockups, emphasizing accessibility and workout form guidance. We also partook in A/B testing to see what worked best from a navigational standpoint (and visual design standpoint).
Key Takeaways:
- Our wireframes led to low-fidelity prototypes, which evolved based on user testing and feedback.
- We prioritized accessibility and workout form guidance.
- We partook in A/B testing with locations of pages/features, as well as for visaul design in order to ensure we were giving ourselves the best chance as our product evolved.
Chapter 6: Mocking Reality
We embarked on the end stages of our journey through the oceans of fidelities into the sweet land of a polished mockup, our ship steered by the invaluable insights gathered from continued usability testing, collaborations/brainstorms, and new surveys. We created user-centric enhancements, such as the introduction of an "Advanced" difficulty level and a customizable "Focus" section, revolutionizing the fitness app's user flow. The focus section allowed users to select an area of training they wanted to prioritize, such as gaining muscle. Through iterative design and user feedback, we witnessed the transformation of the app's interface, including the streamlining of navigation and the enhancement of personalized experiences.
Key Takeaways:
- Ongoing usability testing and new surveys informed changes, including the addition of new difficulty levels such as Advanced, and areas of training to focus on, such as Muscle or Cardio workouts.
Chapter 7: The MVP
We crafted a product everyone was truly proud of. The stakeholders Sarah, Dan, and Cyndi, once holding wildly diverse visions for a product, had come together finally. All three were satisfied -- elated, even -- and appeared closer than ever. Armed with a newfound unity, the MVP was released, and continued being refined and growing over time. It evolved over the next six months, primarily in regards to its social features and focus.
Final Results:
- 28% improvement in user satisfaction with layout / look / "feel"
- 27% improved ability to navigate effectively
- 19% improved happiness with exercise options according to users
- 16% improved signup rate
- 15% improved retention rate over the course of the next 150 days.
* Erialsoft was eventually purchased and absorbed into a competitor, which the stakeholders viewed as the ultimate win.
