1. Project details
A project management system made at a
healthcare startup in conjunction with the
Oncology Nursing Society and a prominent
hospital. Patients are given a responsive
web application to report medication
adherence and side effects. Nurses are
given a dashboard tool to create
instructions and receive reports. This
project made it to pilot testing stage. For
this example, I will focus on one aspect:
creating and receiving personalized
medication schedules.
What I did
• Extensive research, shadowing and interviewing of patients and
nurses
• Created all initial sketches, wireframes and prototypes
• Worked with in-house and outsourced developers by delivering
specs
• Performed extensive QA
• Worked with graphic designer to add aesthetic layer
Tools used
• Omnigraffle
• Axure
• Photoshop
• Plan IO
Lars Lindahl, UX Designer, Workflow Example
(c) Lars Lindahl 2015
do not distribute without Lars Lindahl’s permission
2. The Challenge
For example, a patient with advanced breast cancer may
receive treatment with tablets of lapatinib and capecitabine.
She needs to take the lapatinib once a day, 1 hour before a
meal or 1 hour after a meal, while the capecitabine should be
taken twice daily, with food or within 30 minutes after
eating.
1) Medication schedules for patients can be very complex especially in regards to meal
times.
2) Nurses use paper to explain to patients how to take their medications. This is
inefficient.
3. Identifying the Pain Points
• Urgency of fasting restrictions is not emphasized
• Too much reliance on patients to adhere
• Patient lifestyles now revolve around medications
• Nurses always need to look up these protocols
• Dosage changes are difficult to communicate
Discovered through research, shadowing, interviewing
4. Sketching Initial User Interactions
Patient Alerted
Initial Interactivity
Dosage Changed
Medication Added
Medication Removed
Full Schedule
Updated
Read Only
Materials Updated
Usage History
Stored
Make Your Own To-Do
List
Interactive
Data Stored
Patient Created
Medication &
Dosage Selected
Patient Interface
Created
registration…?
Initial Set Up
Welcome Screen
Interactions Expanded
Adherence
Responses
Data Stored
alerts?
daily reports
Side Effect
Reported
Data Stored
alerts?
Question
Asked
Data Stored
alerts?
Dosage Changed
App Updated
alerts?
Materials
Sent
App Updated
alerts?
Adherence
Adjustments
Data Stored
alerts?
Staff Patient
Lars
Lindahl
5. Approved Solution, part 1
Fasting protocols for each medication are digitally stored in centralized system maintained
by the hospital
Specify fasting
requirements
Create a
medication type
Create a dosage type
Specify frequency of
usage
Specify times of
usage
Specify strengths of
usage
Store dosage types
Create additional
dosage types
1
3
2
4 5 6
7Lars
Lindahl
6. Approved Solution, part 2
For each patient, nurses will retrieve and input traditional meal times. Appropriate
medication times will then be generated from this data.
Attach medication
type with patient
entity
Attach stored dosage
type with patient
entity
Unique usage times are computed & recommended
Select usage times
13
14
15
16
Confirm start date
17
Lars
Lindahl
7. Approved Solution, part 3
Patients can view their daily schedules with both meal times and medication times clearly
indicated.
Select usage times
Recipient receives customized scheduling
Select new usage
times
Recipient receives customized scheduling
Recipient receives alerts revolving
around this schedule
Recipient receives alerts revolving
around this schedule
16
18
19
21
22
20
Confirm start date
17
if changing schedule
Lars
Lindahl
8. Comparative Analysis Example - MangoHealth
Mango initially provides food instructions but they are buried within larger education
material
There is no mention of food when patient is pinged to take medication
9. Authoring Dosing Protocols (Structure)
Indicate whether [Bundle] should be taken with or without food
With Without With or Without
The patient should take [Bundle] at least:
1 hour before eating
or and
hour after eating
2 hours before eating hours after eating
How to TakeFasting Instructions
List the dosage types below:
Name this typeStandard Dosage or
Indicate the number of doses per day for Standard Dosage:
twoone three four
Indicate the dosage strength for Standard Dosage
800 mg
Indicate the time each dose should be taken for Standard Dosage:
First Dose:
Second Dose:
when you wake up
sometime in the morning
sometime in the afternoon
sometime in the evening
before you go to bed
6am - 12pm
12pm - 6pm
7pm - 12am
Indicate the Time On / Time Off schedule for Standard Dosage:
none
Days On Days Off0 0
Add This Dosage Type
The following prototype was used
to get feedback from nurses —>
Lars
Lindahl
10. Selecting Patient Lifestyle Times & Medications
First Name Last Name
Date of Birth
MM/DD/YYYY
EHR ID
###
General Patient Info
Patient Lifestyle Info
Breakfast
Lunch
Dinner
Wakes Up
Goes to Sleep
5am
6am
7am
8am
other
9pm
10pm
11pm
other
5am
6am
7am
8am
9am
other
11am
12pm
1pm
other
5pm
6pm
7pm
8pm
other
Select Medication
Select one or more medications
Medication Medication Medication Medication
Medication Medication Medication Medication
Medication Medication Medication Medication
Medication Medication Medication Medication
Select Times
most common:
browse all
Lars
Lindahl
11. Applying Appropriate Medication Times
select Zytiga times:
select Prednisone dose 1 time:
10 am 11 am
With Zytiga, the patient can not eat at
least 2 hours before a meal and 1
hour after a meal. The patient should
take 1 time some time in the morning
With Prednisone, the patient must
take with food 2 times sometime
in the AM & sometime in the PM
select Prednisone dose 3 time:
With Prednisone, the patient must
take with food 2 times sometime
in the AM & sometime in the PM
Dose Timeline
Breakfast
Lunch
Dinner
7
1
7
Zytiga
Prednisone 1
Prednisone 2
9 am
7 am
7 pm
new time
new time
new time
1 pm
2 pm
3 pm
4 pm
5 pm
6 pm
8 pm
9 pm
10 pm
11 pm
12 am
recommended:
recommended:
recommended:
The Start Date for Votrient has not
been set
But you can start preparing now:
Set a Time to Take the Drug
Read About How to Take This Drug
Votrient must be taken on an empty
stomach . It must be taken either one
hour before eating or two hours after
eating
You will take this drug every day at
Set a Time
Time Unkown
Important
When do you normally eat breakfast?
8
When do you normally eat lunch?
1
When do you normally eat dinner?
7
Next
B
L
D
select a time to take Votrient
7am 10am
12pm 3pm
4pm 5pm
6pm 9pm
10pm 11pm
V
Confirm
If “Anytime” is Selected by Care Team
B
L
D
select a time to take Votrient
7am 10am
V
Confirm
If “Sometime in the AM” is Selected by Care Team
B
L
D
Did you take Votrient?
Y N
Today’s
Schedule
menu menu
Change Default Times
Change Only Today’s Times
When doe you eat breakfast today?
8
When doe you eat lunch today?
1
When doe you eat dinner today?
9
Next
B
L
D
select a time to take Votrient
7am 10am
12pm 3pm
4pm 5pm
6pm 7pm
8pm 11pm
V
Confirm
change
/record as an exception
Lars
Lindahl
12. Applying Appropriate Medication Times - Iterations
Drug 1
Drug 2
Schedule
Profile
Add Plan
Bundle2
Concifrm Changes
[Bundle1]
[start date]
First Dose: Sometime in the morning
no time selected
Second Dose: Sometime in the evening
no time selected
[Bundle2]
[start date]
First Dose: Sometime in the morning
another time
[Bundle1]
[start date]
First Dose: Sometime in the morning
no time selected
no time selected
7:00 AM
8:00 AM
9:00 AM
10:00 AM
11:00 AM
another time
another time 12:00 PM
12:00 PM
1:00 PM
2:00 PM
3:00 PM
4:00 PM
5:00 PM
6:00 PM
7:00 PM
8:00 PM
9:00 PM
10:00 PM
[Bundle1]
[start date]
First Dose: Sometime in the morning
12:00 PM
does not exceed
past sleep time
(10pm)
does not include
recommended
times
8 am
wakes up
1 pm
11 pm
eats breakfast
eats lunch
eats dinner
goes to bed
11 am
Zytiga Dose
6 pm
Prednisone Dose #2
9 am
Prednisone Dose #1
Zytiga Dose
Must be taken without food. Do not eat 2 hours before taking and 1 hour after taking
Recommended times for this patient:
11 am 12 pm 8 pm 9 pm
Prednisone Dose #1
Must be taken with food
9 am 1 pm 6 pm
Prednisone Dose #2
Must be taken with food
9am 1 pm 6 pm
select different time
select different time
select different time
10 pm 11 pm
Recommended times for this patient:
Recommended times for this patient:
John’s Day Schedule
Lars
Lindahl
13. Patient Portal Interface (Initial Sketches)
8 pm
7 pm
6 pm
5 pm
4 pm
3 pm
2 pm
1 pm
12 pm
11 am
10 am
8 am
9 am
7 am Good morning
Take drug 1
Take drug 2
Do not eat
Do not eat
Do not eat
Lunch time
Breakfast time
Dinner time
Take drug 1
[Day]
[Month] [Day #]
Drug 1 Drug 2
STATUS Home Instructions Side Effects EducationCalendar
view full calendar
7:00 AM - 10:00 AM
Do not eat for three hours
Did you take this yet?
I did Remind Me No I can’t
9:00 AM - Heads up! Take 2 medications at this time
Ok to eat
10:00 AM
Zytiga
take 4 tablet
Lars
Lindahl
14. Patient Portal Interface (Iterations)
medications tracking
report
symptoms
appointments more
STATUS
home
8:33 AM
7:00 AM
Do Not Eat For the Next 2 Hours
8:00 AM
Do Not Eat For the Next Hour
Take 4 Tablets of Zytiga
9:00 AM
TIME RIGHT NOW
8:33 AM
3:30 PM
Symptom Review with Nurse Taylor
Your Schedule for Today
6:30 PM
Take 2 Tablets of Prednisone
show instructions
show instructions
medications tracking
report
symptoms
appointments more
STATUS
home
Today
8:33 AM
10:00 AM
8:00 AM
7:00 AM
Your Schedule for Today
Do Not Eat For Next 2 Hours
Do Not Eat For Next 1 Hour
Do Not Eat For Next 1 Hour
MAY 1, 2014
How To Take These Medications
Time Right Now
5:00 PM
Take 2 Tablets of Prednisone
How To Take These Medications
Take 4 Tablets of Zytiga
Take 2 Tablets of Prednisone
9:00 AM
Lars
Lindahl
15. iOS provider info / time /
battery indicator returns
in this screen
Up next event follows
same logic as previous
wireframe design
timer counting down
time between event time
and internal iOS time.
Appears as hh:mm:ss
Only show this message
if up next Medication is
Zytiga. See Plan IO
spreadsheet for eating
instructions for each
medication (eat.xslx)
Tapping this button
opens menu as shown in
final page of this
document
Swipe Medication name
to the left to reveal full
instructions (see next
page of this document)
Example if only one event is up next
In this case, it is 11:00 AM Zytiga. also could include: 7:00 PM Prednisone & 11:00 PM MS Contin
Tap this link to open flow
seen in page 3 of this
document
Static text for
single medication
Annotations Examples - Patient Portal
medications tracking
report
symptoms
appointments morehome
Great Job So Far Today!
September 22, 2014
Your Schedule for Today
What’s Next
[Time]
[Action]
Full Schedule
[status]
What’s Next
10:30 PM
Take 1Tablet of
Prednisone
Full Schedule
7:00 AM
Do Not Eat
For the Next 2 Hours
Take 4 Tablets
of Zytiga
9:00 AM 9:0
Your Schedule for Today
Great work!
Don’t take this dose yet
8:00 AM
Do Not Eat
For the Next Hour
Take 1 Tablet
of MS Contin
10:30 AM
Take 1 Tablet
of MS Contin
12:30 PM
medications tracking appointments morehome
report
symptomsGreat Job So Far Today!
Home Screen on Landing Home Screen in Action (Example)
1 - The home screen (seen when first opening app & also accessible
from first icon in the footer) lists the schedule for the day
2 - Each card represents an action for the patient. See Google app’s
card structure for similar layout here . Action names / times /
statuses / icons / types are all listed in the spreadsheet for both
Patient A & B.
3 - The “Your Schedule for Today” display shrinks and sticks to header
when the user slides down to see full list. It returns to larger display
when sliding back up to the top.
4 - The event that shows up in the “What’s Next” section is
determined by the upcoming event based off of the internal clock in
the phone. If the internal clock is past the events listed, include
statement “All done for the day :)” instead of a card like such:
Great work!
Great work!
10:30 PM
What’s Next
All done for the day :)
Full Schedule
5 - If multiple events occur at the same time, show event marked
PRIMARY in spreadsheet first and show glimpse that there is another
card to its right. Swiping to the left reveals that card and swiping back
right reveals the original primary card.
6 - Actions marked “Additional Instructions” in the Type column of the
spreadsheet should be more condensed cards. They should be half
the height of a normal action card.
7 - Actions have different statuses & color icons depending on if they
have occurred after or before the internal clock time.
Take 1 tablet
of MS Contin
11:00 AM
You missed this dose. Please only
take your normal dose tomorrow
x
Take 1 Tablet
of MS Contin
12:30 PM
Don’t Take This Dose Yet
Take 1 Tablet
of MS Contin
12:30 PM
Great work!
Example of Rows 6 & 14 of Spreadsheet
if action is BEFORE the internal clock
Example of Row 6 of Spreadsheet
if action is AFTER the internal clock
Example of Row 14 of Spreadsheet
if action is AFTER the internal clock
shrinking header sticks to top
slidetoscroll
1
2
3
4
5
6
11:30 AM 11:30 AM
Lars
Lindahl
