Transform fitness mobile app
A fitness and nutrition mobile app based on program developed by TV personal trainer Chris Powell
A fitness and nutrition mobile app based on program developed by TV personal trainer Chris Powell
Worked closely with stakeholders to understand program and organize ideas into an interactive mobile design, from concepts to prototypes, to testing and refinement.
Chris and Heidi Powell are personal trainers, widely known for hosting the reality TV series Extreme Weightloss on ABC. Chris Powell has authored several books in which he has developed a workout and nutrition program. The goal of the mobile app was to offer the program in a guided interactive format for their fans to "transform" their body. Either by losing weight, getting into better shape, or body building.
My work began with initial research, reading through Chris's latest book, and meeting with him regularly to discuss the book and better understand his training approach. This lead to figuring out the app's structure and putting together notes, rough sketches, and a mind map that turned into the overall structure and user navigation.
Since the business model was based on a monthly subscription, it was important to offer a lot of options for what users could do. Not only did we translate a full health and nutrition program into a simple, guided plan, but the meal and workout features became extensive enough that they could each be their own standalone apps!
During research, coaching also surfaced as an important aspect that set the app apart from others and allowed for showcasing Chris’s brand. And, it offered content as another option for keeping users engaged, primarily in the form of semi-daily videos.
Wireframes were initially made as rough sketches of key screens and eventually turned into black and white mock-ups using standard design patterns. Then, high fidelity designs that incorporated branding and novel interaction models.
Research work that was fleshed out would also allow for setting up meals and workouts databases. The meals entailed breaking down individual ingredients to use for categorization, recipe instructions, and a shopping list that was generated for the user based on their chosen meals. And workouts required individual workout movements, grouped into sets, with a predefined duration of time for each set, and organized into a weekly workout schedule.
As more black and white wireframes were being produced, I decided it would be helpful to put them together in an interactive prototype as a way to show how a user would go from screen to screen. Tapping on regions on each screen would link to other screens as if using the app, and it was accessible via a URL the team could pull up on their iPhones and turn into a mock app with the "Add to homescreen" feature. This allowed for stakeholders to invite other personal trainers and test users to gather feedback.
We would end up using this prototype throughout the duration of the design stage, with updates pushed to it regularly as we would continue to brainstorm and discuss ideas. We went through several iterations of the black and white wireframes, getting into key secondary screens before turning to branded designs. From around ten starting screens linked together, to over 100, as we refined design elements and figured out interaction details that we would provide to the dev team.
This level of hands on iteration allowed for developing an on-boarding process that included a free preview of the app, which lead to a strong conversion rate at launch. And because of the level of customization options around a user's needs that we were able to design, there was also a good retention rate of users continuing to use the app over time.