Individuals are increasingly conscious of their health and fitness, however many find it challenging to consistently choose meals that align with their specific fitness goals. Additionally, tracking calorie intake manually can be tedious and inaccurate. There is a need for a solution that simplifies this process, making it easier for users to stay on track with their health and fitness goals.
The design of the app was rooted in a user-centered approach with particular focus given to initial user research to make sure we had a good understanding of user needs, pain points and goals in relation to health and fitness. This research informed the creation of user personas, and customer journey maps to help bring to life the user experience. Following from this we were able to create initial wireframes that aimed to meet the users needs and subsequently refine them into high-fidelity prototypes.
To begin getting an understanding of the potential Body Kitchen user base we conducted a comprehensive survey recruiting respondents aged 20-40 from a local gym and office space to gain insights into their preferences and habits related to fitness and meal kit services. The survey was very helpful in shaping our design strategy as it provided us with valuable data-driven insights. One significant finding was that 41% of respondents identified the cost of the service as the most crucial factor influencing their decision to use a meal kit app. This insight highlighted the need for a pricing model that is competitive and transparent to users.
Based on our survey data and user interviews we were able to form two distinct user personas that embodied the characteristics of the two most common user groups. These personas, 'Jane' a health-conscious professional with a busy lifestyle, and 'Patrick' a fitness/physique focused individual seeking dietary optimisation, served as guiding references throughout our design process, ensuring that the app addresses the specific needs and motivations of our target user base.
To help zoom out and get some better perspective of our target users and how we could convert and retain them as actual users we created a customer journey map that breaks the process down from the initial awareness stage to the final subscription and delivery of the meal kit. This allowed us to see the different points at which the user would interact with the service and identify potential pain points, drop off points and opportunities for enhancing the user experience. We also tried to empathise with what thoughts and emotions they may be feeling at different stages of the process so we could make informed design decisions to streamline the user experience and keep users engaged.
With an understanding of the user in mind we set about coming up with some initial ideas of how the app would work and refined these into a site map that detailed the main screens of the app and the different interactions the user could take on each screen. This process helped us structure and organise the apps content in a logical way with the view to provide the user with an intuitive and efficient user experience. In particular we were able to reduce the number of screens we initially anticipated by combining them into one screen where it made sense to do so.
Based on the structure we laid out in the site map we then created a basic wireframe of the app. This allowed us to visualise the apps interface in a simplified form and gave us the opportunity to tweak the functionality and interactions without getting distracted with visual design concerns. It helped facilitate collaborative discussions amongst the team, enabling us to identify potential design flaws and usability issues early on and iterate. Once we were happy the finalised wireframe served as a blueprint for the prototype version of the app.
The visual design of the app was crafted to be modern and minimalistic with the use of bold strong accent colours to highlight different elements. Various visual conventions were used through out the app to help communicate the functionality of different elements and to guide the user to various interactions. For example buttons that allowed the user to add content were styled with a green outline while buttons that linked to different screens were styled in a solid green. The visual design aimed to strike a balance between aesthetic appeal and usability, ensuring that the app not only looked modern and relevant to our target users but also provided an intuitive and uncluttered interface for the user.
The home screen of the app provides a concise overview of the information that the user would be engaging with the most so for this reason we displayed the calorie balance graphic first as users will be able to quickly check in on their calorie balance through out the day. We also included a 'Todays meal' and a 'Goals' recap section so that users can quickly find this information without having to go further into the app. We also included a 'To Do' section to so that users don't lose track of what they have tracked! This is also serves nicely as a prompt for new users to get started using the app.
The meal screen is where the user can find the recipe for their meal as well as view the meal plan for the current week. They can also adjust their meal plan selection from this screen if required.
On this screen users can track all of their meals and exercise through out the day. Users can search a library of common meals and food items to automatically add the calorie data from their meals or they input it manually if needed. Exercise can be tracked with calorie expenditure estimated by distance or number of reps. There is also the option for the user to upload a progress photo so they can see the results of their effort over time.
On the progress screen users can get more detailed information on both their daily and longer term progress. The first visualisation is a more in depth calorie balance graphic that breaks down how the balance is calculated and displays how many calories are remaining for the user to reach their target. The next visual shows the users calorie burn rate through out the week so they can make sure they are burning or maintaining a calories depending on their goal. There is also a visual of the users weight over time so they can keep track of that too.
The main problem this App was trying to solve was to make it easier for people to stick to a healthy meal plan and track their calories. The solution we developed effectively addresses this challenge by significantly reducing the cognitive load normally placed on users for meal planning and tracking. The app serves as a structured framework through which users can monitor their health and fitness goals, with the only requirement on their part being the accurate reporting of their exercise and eating habits. Moving forward we are keen to explore opportunities for integration with wearable technology, such as smartwatches and other fitness tracking devices, to further simplify the user's activity tracking experience.