Medical Reminder — UI/UX case study

Tim Pleiko-Izik
Muzli - Design Inspiration
6 min readNov 8, 2018

--

Medical Reminder — an app to keep track of medications taken, to remind you about taking the pills and the notification system about taking the medicines by your loved ones ❤️

  • A lot of people are taking medicines or supplements daily. They need to track it.
  • Children can have ailment and parent want to make sure that children take medications on time.
  • Sometimes people suffering from chronic diseases are forced to take medication at certain times of the year. It is easy to forget about taking medications when a person has not taken them for many months
  • Many people are engaged in fitness and they take sport supplements to improve their results. They take them not only before, during and after training but also between workouts and during rest days.
  • Some women take birth control pills. A frequency of their use is very important.
  • Tracking your diet and nutrition is becoming more popular and in demand. Many people take pills containing vitamins, minerals, etc.
  • People also want to keep track of the amount of vitamins they take to make sure they get enough nutrients and don’t exceed the norm.

Pain points

  • People forget to take medicines on time, and because of that the results of their intake are reduced or go to zero.
  • Sometimes parents want to make sure that their children take vitamins or medicines on time and to be able to remind them about taking pills on time.
  • People involved in fitness want to track their intake of sports supplements and to get notifications when they should take it.
  1. The United States is a leader of antidepressant use around the world.
    Source
  2. 11% of Americans over the age of 12 take an antidepressant.
    Source

In a survey, 62 percent of U.S. women ages 15 to 44 reported using contraception from 2011 to 2013. The pill was the most popular form of birth control.
Source

The global protein supplements market size was valued at USD 12.4 billion in 2016 and is expected to rise at a CAGR of 6.3% from 2017 to 2025.
Source

According to an analysis of data that the National Health and Nutrition Examination Survey (NHANES), 33% of the U.S. population aged one year and older took a multivitamin/mineral in a given month.
Source

Meet business needs with client’s needs

Competitor analysis

A competitive analysis is one of the better ways to collect and compare data about products (and companies) in the marketplace. We can highlight strengths and weaknesses of products in order to make more informed decisions about your product strategy.

Solution

Create an application that will respond to the needs of users.
The app should include a list of taken medications, detailed alert system and the ability to track other users added to the favorites column.

Information architecture

Sketches/Wireframes

Prototyping and user testing

One of the great advantages of wireframing is that it provides an early visual that can be used to review with the client. Users can also review it as an early feedback mechanism for prototype usability tests. Wireframes are used early in a project to get user and client approval on the layout of key pages and the navigation. It provides confidence in moving forward. Wireframes also save considerable time and money in the testing and amends phase later in the project.

Moodboard

Unlike wireframes and prototypes, moodboards don’t show the detailed picture of a future project. But they transfer the right mood and bring the emotions expected from a product. Moodboards are a good way to experiment with a color palette, fonts, and style as well as plan visual hierarchy of a project.

Color palette

The central principle of visual design in this app is the cleanness of user interface and the emphasis on the main elements of the content. Based on that was built look and feel of the app. For this purpose have been chosen bright colors which can attract attention to an element even if it takes a small part on the screen. Since this application is directly related to medicine, I have chosen colors that are widely used in this industry, so that they create an emotional connection and inspire the trust of users.

Hi-fidelity design

Final designs

Development

Once we have a design, now it’s time to hand it off to developers. Usually, in my work, I use InVision to upload all the screens. Also, developers get files with description and comments of all the animations inside the app. To make developers better understand all the details of the app, I make a short meeting where I present the app. For each of my projects, I prepare a UI Kit that contains detailed information about typography, color palette, and elements that can change their state (buttons, inputs, etc.). I always keep in touch with the developers at the development stage to make sure that they have not missed anything, answer their questions and track the results of their work at different stages.

Testing/Quality Assurance

Once the design is developed, now it is time design to be tested on the actual device. Now it is QA’s job to test it and break the product as best as they can finding some bugs so developers can fix them before the product will be shipped. Because we don’t want to have a product that we spent so much time on that will be released to be buggy and broken.

Product launch/Summary

When everyone is happy with an outcome, a product is finally ready to be launched, and we can celebrate 🎉. But it is not over. We should continually test and refine the product as time goes on. Continuously make improvements and adjustments of the product, continue to optimize the design, add new functionality as new needs arrive. The process never stops…

Let’s keep in touch

Follow me on Dribbble, LinkedIn or Instagram to get notified when I publish something new ⚡️

--

--