CASE STUDY
Health Tracker App
![Health tracker mockup](https://static.wixstatic.com/media/baa4be_a252aa27c407451ba21d9bfb361bce47~mv2.png/v1/fill/w_409,h_270,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Health%20tracker%20mock.png)
About the product
This tracker app was made taking into account the disadvantages of using sheets to fill up a daily tracker and the dieticians to manually send reminders to 100s of clients on daily basis, this tracker app has automated reminders for supplements, daily tracker filling, water . intake, exercise reminder and much more. The client will easily be able to fill up his tracker with pre-recorded responses with options to choose from. This app also highlights the other services the company provides.
Made in collaboration with fellow designer: ADHISH SHRIVASTAVA.
User Persona & Empathy mapping
The following user persona was created from the data collected from 115 user tests. Based on this data the user needs, pain points, and user behaviour, complied into ONE singular user. Captured data on how the user behaves, user’s attitude towards the pain points, understanding the true problems. What the user: says, thinks, does and feels about the current process.
![User Persona- health tracker app](https://static.wixstatic.com/media/baa4be_fcdbfc018487457598838ba9d696cc67~mv2.png/v1/fill/w_481,h_343,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/User%20Persona-%20health%20tracker.png)
Card Sorting
The Ideation step in the Design Process begins here with card sorting, users were asked to sort the cards based on the apps product & service as per their thinking process. This process was done in 3 different steps.
![Card sorting](https://static.wixstatic.com/media/baa4be_b3d91aab902348a78ec7f4670c524acb~mv2.png/v1/fill/w_302,h_374,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/image%2014.png)
![Card sorting](https://static.wixstatic.com/media/baa4be_30621be64bf9472ca51f6b0eed842357~mv2.png/v1/fill/w_302,h_374,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/image%2015.png)
![Card sorting](https://static.wixstatic.com/media/baa4be_1c6767231411492f9e1d68383b53321e~mv2.png/v1/fill/w_302,h_361,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/image%2016.png)
Information Architecture
Based on the card sorting done in 3 groups, an information architecture was built, includes a navigation diagram, which shows the flow of information within the app, starting from the first step to ending a task. A user flow was also created with the same information, which shows how the user will complete a particular task in the least number of steps. Here a task of renting a medical bed was focussed on.
![Navigation Diagram- MedApp](https://static.wixstatic.com/media/baa4be_a2ecb3bd45c04a318da0e195f63fec3e~mv2.png/v1/fill/w_548,h_371,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Navigation%20Diagram-%20MedApp.png)
![User flow equipment- MedApp](https://static.wixstatic.com/media/baa4be_c1ef002513cd428291a2ff0bdaa75178~mv2.png/v1/crop/x_0,y_23,w_1185,h_1184/fill/w_409,h_409,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/User%20flow%20equipmentno%20bg-%20MedApp%201.png)
High Fidelity Screens
With the above information, the user research, information architecture and many iterations in the screen’s paper sketch, user testing the screens to make sure the process is easy to understand the high fidelity visual design for the app was designed. Take a look at few of the screens designed below. To view the complete prototype, flow and interactions designed for the app, click on “View Prototype”.
![Tracker app mockup](https://static.wixstatic.com/media/baa4be_4a7dcca8019c4836b346e34cfa1ededa~mv2.png/v1/crop/x_0,y_0,w_2150,h_684/fill/w_1220,h_388,al_c,q_90,usm_0.66_1.00_0.01,enc_avif,quality_auto/Tracker%20app.png)