Smart Health: A health Monitor Dashboard

Smart Health: A health Monitor Dashboard

Week 3 task of UI/UX Team 3

Task Overview

"What is Smart Health?"

Smart Health is an application that enables users to monitor and track their health. It consists of a wearable wireless device like a bracelet with sensors that are paired with an application for the user to access information such as daily steps, water intake, heart rate, sleep, exercise, and many more.

The Task

Design an analytics dashboard for web or app analytics, a health monitor, or e-commerce analytics. Consider filters, chart types, and the core features and statistics the user would need most.

Our Role

UI/UX Design

Duration 4 days

Tool Figma

The Process

Understand the task.

The team was tasked with understanding what we were supposed to do and whether to pick an e-commerce dashboard or health monitor for either a web or mobile app. Finally, we picked a health monitoring mobile app.

Defining the Problem

There are a lot of health monitoring applications in existence. So the Google Play Store has so many applications to choose from, and even Apple has one that comes with their phones. What would make people still decide to use ours?

Solution

We decided to narrow down the project's success to meeting three central targets:

  1. Generating ideas for a user-friendly app.
  2. Designed a user interface that was interactive and easy to use.
  3. Designing the app with core features such as: setting daily goals, creating new daily goals, and monitoring each goal daily.

Ideation

The team had to brainstorm on a lot of ideas, both good and the worst ideas possible, till we were able to come up with the best ideas where ideas were understood and the basic element of thought was visualized.

User Persona

We created a user persona to serve as a guide through our design process.

Design

Mid Fidelity Wireframes

We designed the Mid-Fidelity wireframes to set a foundation for the high-fidelity designs.

High Fidelity Design

A closer look at the design.

5401589.jpg

Onboarding

We designed an onboarding flow to give users an insight into what Smart Health had to offer.

54004791.jpg

Sign up/Sign in Pages

We designed an easy process for our users to either login into the app if they already had an account or to create a new account if they were new users.

10.jpg

Dashboard Screens

The main task was to create a dashboard for a health-monitoring app, so we created 2 main states for the dashboard.

  1. Empty state: for a new user who just created an account on the app

  2. The main dashboard: This gives the user the ability to see how the app has monitored each of the goals set daily. They can also switch to seeing the dashboard for the previous day or the whole week. They can also see the statistics table for each goal.

54004792.jpg

Other Screens

We went a step further than just designing the dashboard. We also designed screens for each goal for users to see the details of each goal and also give the options to create a new daily goal.

Frame 2211 (1).png

Frame 2211 (2).png

Frame 2211 (3).png

Frame 2211 (4).png

Prototype

The Team

Hephzibah Oyetunde LinkedIn

Adewola Muiz LinkedIn

Tomilayo Abimbola LinkedIn

Hamza Olayinka Abdullateef LinkedIn

David Goodness Deborah LinkedIn

Enekwechi Uchenna LinkedIn

Ifeanyi Asonye LinkedIn

Habeeb Ibrahim LinkedIn

Conclusion

It was a lot of work in a short period. After the entire process, we felt we did a good job of achieving our goal of designing a health monitor dashboard with our users constantly in mind. We look forward to iterating on many aspects of this application in the future. However, as for the present, this is how we will leave you with Smart Health.

Thank you for reading!