User Research and UX/UI Design Case Study
The goal of the research was to understand user experience and the pain points for MyFitnessPal and explore the design opportunities. This was achieved through running an online survey and conducting interviews with 5 participants (age 35+) who are new to diet/exercise managing app was conducted. Then the usability testing was conducted on MyFitnessPal app. To analyze the user feedback obtained during the research process, I used affinity mapping to categorize user feedback (pain points) from my research in order to find out where the problem exists:
To further understand the problem, I created the persona based on the insights I gained through my user research:
Next, I created user journey mapping to gain insight into how the user interacts with the app. I also laid out user pain points collected during the user research. This helps to narrow down the problems.
- User don't want to see the text-heavy content
- User wants to search and add food/exercise quickly
- User wants to get a quick feedback after entering data
"make user feels less overwhelming when he sees the content?"
"create simple and easy way for user to search and edit food/exercise data?"
"provide user a proper feedback after entering data ?"
- Use less text in the content; more icons and charts.
- Add other options to search food/exercise data; voice commands and scan (photo/barcode).
- Notify user when he/she submits data.
Home screen now displays weight, calorie intake, and steps (iOS only) data in daily, weekly, monthly, and yearly views. User can select what they want to see on the page in "Settings". I also created "NEWS" category and moved the feed in there.
One of the pain points is adding food in the app. Unlike workout, we eat different food every day.
So in order to make the search and add process easier, I added voice command as an option.
Image search is another way to search data easily.
In addition to voice search, I added the food scanning feature so users can search food data by image or barcode.
When a user enters exercise data, "Diary" screen shows up. Communicating the achievement engages user to the app.
Data is well presented when it is displayed in graphics. By adding chart to the interface, the app looks more engaging for the users.
- Conduct user testing with the updated UI
- Iterate and refine the design based on the test result