Dose Tracker

Dose Tracker

Enabling users to easily track usage of over the counter medicine

The Challenge

Design and build a novel interactive physical user interface prototype that addresses a concrete problem

The Outcome

A working prototype of a device that makes it easier to track consumption of over the counter medicine
Screens from an InVision prototype that was used to share the design with remote clients

Overview

The Brief

This project was an individual assessment for my Physical Computing and Prototyping Module. The brief was to design and build a novel interactive physical user interface prototype that addressed a concrete problem. At minimum, the prototype had to include a micro-controller platform, sensing, actuation, and a digital fabrication technique. The project was completed in one and a half months.

The Problem

When people fall ill they may find it hard to keep track of the over the counter (OTC) medicines they are taking to treat their symptoms. Not knowing whether it is safe to take medicine can be problematic as taking doses too often could lead to accidental overdose over time. Current advice for managing medication doses include recording doses in a notebook, journal, or calendar. However, if someone is ill or drowsy, these options may be difficult to manage.

The Objective

The goal was to decrease accidental overdose of OTC medicine by creating a device that simplifies the way people keep track of the doses they take.

Grey logos include gold bars, sun, and a local sign
A selection of early logos
Logos in bright red-orange and a yellow-orange
Finalists with added color
Logo with simple orange sun rays above company name
Final Logo Design
Original thumbnail design on the Properties for Sale page

Design Process

Ideation

Inspiration came when I fell ill. For weeks I was sick in bed with the flu and other symptoms. In this state, I struggled to remember when I had last taken each medicine and wondered if I had waited enough time to take another dose. As I lay in bed and looked at the bottles of medicine on my nightstand I wished there was an easy solution for my problem. After some preliminary research, I discovered that others were having this problem as well.

Once, the basic idea had been established, I used sketching to visualize potential designs for the device. I continued to sketch through the design process as I explored new components and functionality.

Step 1

Customize Design

Recreate a customized version of the official Rotaract logo in black and white using Illustrator
Before and After logo design

Step 2

Color Options

Extract colors from beach photos and the Rotary logo to create four logo color schemes
Four Color Schemes for logo

Step 3

Collect Feedback

Present top two options to the club president and apply chosen scheme (rotary colors) to logo
Logo with top two color options

Step 1

Low Fidelity Wireframes

Sketches and digital wireframes were presented to lead broker
wireframe of property thumbnails

Step 2

High Fidelity Mockup

Realistic mockup created based on feedback from the broker

Step 3

Design Implementation

Specifications were sent to the website’s developer to launch redesign
Key Findings
Preliminary Sketches
A selection of sketches that helped develop the look and functionality of the device

User Flow

Originally, the interaction flow included redundant steps and an unnecessary status. At first, in order to record a dose if medicine a user would have to scan the item, say that they were taking the dose, read the status (safe to take or wait longer), and then decide if they still wanted to take the dose based on this information. After showing an interaction flow diagram of this process to users, the redundancy became clear and the first step was removed. In addition, an unnecessary status (you have not taken this medicine yet) was combined with the “safe to take” status to simplify the interaction.

Another issue with the original interaction flow, which relied on text input from the serial monitor, was the potential for typos or incorrect text input. If “yes” or “no” were not typed exactly right, the program would not continue. This was solved by replacing the text input with red and green buttons.

User Flow Diagram
An interaction flow diagram shows the process of tracking a medicine dose. The third status, marked with an X, was removed.

Programming & Components

The Arduino prototype was developed in phases. In the first phase, a way to read and record dose time for each medicine was programmed using the Arduino IDE. Medicines were identified using RFID and variables for each medicine (RFID tag ID, medicine name, recommended wait time between doses, last dose time, and wait time remaining) were stored using a struct.

In the first iteration, the Arduino IDE serial monitor was used to display messages and receive input. After that, the following components were added one by one: LED display, neopixel ring , buttons (yes/no), RFID tag stickers, and a passive buzzer.

Breadboard Circuit Diagram
A breadboard view of a circuit created with Fritzing showing the components and wiring used in the prototype

Form Factor

When the components and program were complete, I moved on to the form-factor. First, I selected one design from my sketches. Second, I created a full-scale paper prototype to visualize how the components would fit into the machine. Third, I adjusted the measurements as needed and created a 3D CAD model for the revised design using Autodesk Fusion 360.

After the CAD model was built, I showed it to users for feedback. Based on this feedback I built a model of a second design. Additional feedback and reflection on potential usability issues led to a third and final CAD model.

To see if the components would fit properly into the final design, I made a fully-operational foam-core model based on the CAD model. Since the CAD model didn’t take into account the space taken by wires, the foam core model was slightly too small. To fix this, the width and height of the model were expanded.

Screens showing the countdown process I mocked up in Adobe XD to communicate my ideas for the interface to team members
Early Paper Prototype
3D CAD Models
Foam Core Prototype
Final Acrylic Prototype

Outcome

User Testing

For convenience reasons, the prototype was tested with students using sample medicines. Testing consisted of short informal observations of users interacting with the device in a university-run makerspace. Users were observed interacting with the device and were asked questions based on their interactions.

Feedback

Overall, users were able to interact with the device with little guidance. Multiple users expressed joy when interacting with the device. However, there were a few problems. For example, often users pressed buttons too early as they didn’t realize messages spanned multiple screens. This caused two problems: (1) The device appeared unresponsive since buttons didn’t work until the entire message was displayed and (2) Information, such as wait time remaining before the next dose, was missed. To fix this, I decreased the delay time.

Presentation

After making slight alterations based on user feedback, the final prototype was presented to professors and students at the Physical Computing and Prototyping module showcase. For the showcase, a poster and video accompanied a live demonstration.

Lists of elements found on Rotaract Sites
Lists of elements found on Rotaract Sites
A poster with sketches
A poster containing visual notes from the presentation created by an artist at the event
Wearable prototype worn on an armScreenshot of calendar interface
A buzzing and flashing wearable prototype presented by two developers on the team
A functioning web-based parent calendar was presented by a front-end developer
Notes from research into sites of California Rotaract Clubs
Sketches of Home Page Design
Sketch of Events Page
Notes and low fidelity wireframes of the new PB Rotaract website
A selection of screenshots from the PB Rotaract website when it went live in January 2017

Conclusion

Learnings

For this project, I grew an idea into a functional prototype using the design process. Along the way I learned basic programming (C/C++), electronic prototyping (Arduino), 3D modeling (Fusion 360), and digital fabrication techniques (laser cutter). In addition, I learned to remove and/or change functionalities when faced with time, money, and technical constraints.

Implications

Dose Tracker could help reduce accidental overdoses by alerting people when they are taking more medication than is recommended. Informal observations with university students indicate the design is easy to use. Further testing with users of different ages and tech literacy, perhaps in a home setting, could uncover whether the device’s tangible design is intuitive for a variety of users.

Additional Projects

Oro Financial

Oro Financial

Refreshing a financial company’s online presence with responsive design
View Project
TMG Website

TMG Website

Reducing questions about property availability and saving callers’ time
View Project
Dose Tracker

Dose Tracker

Enabling users to easily track usage of over the counter medicine
View Project
PB Rotaract

PB Rotaract

Growing a new club from 4 to 20 members in less than a year
View Project
Oro Financial

Oro Financial

Refreshing a financial company’s online presence with responsive design
View Project
TMG Website

TMG Website

Reducing questions about property availability and saving callers’ time
View Project
CNS App

CNS App

Creating a new way for therapists to treat chronic pain patients
View Project
Context

Context

Helping autistic children move from one activity to the next
View Project
TMG Website

TMG Website

Reducing questions about property availability and saving callers’ time
View Project
Dose Tracker

Dose Tracker

Enabling users to easily track usage of over the counter medicine
View Project
Context

Context

Helping autistic children move from one activity to the next
View Project
TMG Website

TMG Website

Reducing questions about property availability and saving callers’ time
View Project
TMG Website

TMG Website

Reducing questions about property availability and saving callers’ time
View Project
Oro Financial

Oro Financial

Refreshing a financial company’s online presence with responsive design
View Project
Context

Context

Helping autistic children move from one activity to the next
View Project
PB Rotaract

PB Rotaract

Growing a new club from 4 to 20 members in less than a year
View Project
CNS App

CNS App

Creating a new way for therapists to treat chronic pain patients
View Project
Dose Tracker

Dose Tracker

Enabling users to easily track usage of over the counter medicine
View Project