The Blue Button is a way for patients to download their medical information, spearheaded by the VA. As it expands, its original, text-based implementation is a bit long in the tooth. The White House has called on designers to re-imagine the downloadable, printable, consumer-facing health record. It's intended to be a single-file download, like the healthcare equivalent of your bank statement, for print and screen.

1. Rebootingthe
BLUE BUTTONM. Jackson Wilkinson @mjacksonw

2. xperiment
TODAy’S
BLUE BUTTON
HAS BEEN AN IMPORTANT
E

3. TODAy’S
BLUE BUTTON
DOCTOR READABLE
PATIENT READABLE
MACHINE READABLE

4. TODAy’S
BLUE BUTTON
DOCTOR READABLE
PATIENT READABLE
MACHINE READABLE
mostly
kinda
sorta

5. MUCH BETTER
we can do

6. any new
BLUE BUTTON
should be...

7. &TO THE POINT
with a quick history
THOROUGH
as an accurate and
complete record

8. &HUMAN-FRIENDLY SYSTEM-FRIENDLY
with relevant codes
& technical details
well-designed on
screen & in print

9. &CATERED TO DOCTORS
with the details they need
HELPFUL TO PATIENTS
to remember & understand
their medical history

10. &MODERN ACCESSIBLE
with a format
everyone can use
leveraging today’s
formats & standards

11. ELECTRONIC HEALTH RECORDS
UNIVERSAL
INTEROPERABILITY
reaching the potential of
requires

12. CCD? CCR? HL7?
FAT CHANCE
There are plenty of options:

13. CONSUMERS
EMPOWERED
Things will start moving when
are
to handle their own records.

14. GREAT FORMAT,
COOL THINGS CAN HAPPEN
with a
DOCTOR HOSPITAL
MERGED
INTEGRATION WITH
THIRD-PARTY SERVICES
PATIENT EMPOWERMENT
INFORMED PHYSICIANS

15. WEB
STANDARDS
MANY TECHNOLOGIES
HTML markup & file
wrapper format
JSON data
format
Javascript & jQuerybasic
interactions
d3.js chart
creation SVG chart
images
CSS3screen
styles CSS3print
styles
IN A SINGLE FILE

16. BLUE BUTTON RECORD
introducing the new

17. ## ##
A COMPOSITION IN
THREE
MOVEMENTS

18. ## ##
The
BIOGRAPHY
Includes the patient information,
demographics, and emergency
contact information.

19. ## ##
AT A
GLANCE
Aggregates all available
information to give the reader
a brief but broad overview of
the patient’s medical history.

20. ## ##
ENCOUNTER
HISTORY
Collapses all information, grouped
by encounter (date), starting with
the most recent.
Icons represent the type of
information contained within each
encounter.

21. ## ##
ENCOUNTER
HISTORY–EXPANDED
When expanded, each encounter
contains everything recorded on
that date: Vitals, labs & results,
procedures, problem list additions,
and updates to the plan of care.

22. ## ##
ENCOUNTER
HISTORY–Print
When printed, each encounter
would be expanded and broken
off onto its own page for easier
record location.

23. ##
The
BIOGRAPHY
Includes the patient information, photo if
available, demographics, & emergency contact
info. The header timestamps the record and
gives easy access to a primary care provider.

24. ##
AT A
GLANCE
Aggregates all available information to give the
reader a brief but comprehensive overview of
the patient’s medical history. Clicking on
anything will take you to its Encounter entry.

25. Advance Directives, such as Do Not Resuscitate orders, if available,
are prominently displayed to ensure they are not missed.

26. The Problem List shows a lifetime of medical issues succinctly. The
space behind the problem list acts as a timeline to show when and
how often each listed problem occurred. If end dates aren’t known,
minimum-sized bars can be used to show occurrence.

27. Vitals are shown when available, and simple sparkline-style charts
are drawn for BMI and BP to show how the patient has been
trending recently. Ideally, the last BP reading measured by the
patient’s primary care physician is used to establish a baseline.

28. Like the problem list, Medications & Procedures are charted out
historically and succinctly, giving a temporal perspective of the
patient’s medical history. Again, if end dates are not available, each
prescribed instance can be represented by a single bar.

29. Allergies are shown and badged according to severity.
Throughout, I’m avoiding using color as a primary indicator. 15% of
folks are color-blind, and more than that use black & white printers.
note!

30. The Plan of Care, listing upcoming medical appointments, is listed
chronologically, and clicking on any item will take the viewer to the
encounter during which it was scheduled.

31. Finally, the patient’s Immunizations are shown here in brief, listed
reverse-chronologically to show the most relevant first. Instead of
showing all dates, just the most recent is shown, along with the
number of doses this patient has received.

32. ##
ENCOUNTER
HISTORY
Displays all known medical encounters in
reverse-chronological order, with basic
information as well as icons representing
information collected for each encounter.

33. On the web, Encounters are collapsed by default, to better see an
overview of the patient’s history. In print, each is expanded and
consumes its own page. Icons represent immunizations, labs/
results, medication prescriptions, and procedures contained within.

34. Each encounter displays the patient’s Vitals, including height,
weight, BMI, and BP. Again, BMI and BP are charted in the context of
the surrounding five-year period, and metric conversions are
present for the convenience of physicians.

35. For Results of Tests with quantitative values, we show the result
as well as chart it in the context of its expected range. It also
charts results of the same lab from before & after this encounter.

36. When a user Expands Normal Results in a web browser, she will
see each of the components of the lab or test just like the
abnormal results. In print, normal results are always expanded.

37. For Results of Tests which don’t have quantitative results, but
instead use text to describe an abnormal result, it shows that text
along with the normal/abnormal status of the last five results.

38. If there were any medications prescribed during an encounter,
they are listed here, denoting the drug, its brand name if
applicable, its form, and the instructions for use.

39. Information about new Problems, Procedures, Immunizations,
changes to the Plan of Care, and the Provider are contained in
one-third-width containers below the vitals, results, & medications.

40. so aboutthe
PRINT VERSION

41. ## ##
THREE MAIN
CHANGES
INCREASE CONTRAST
EXPAND ALL CONTENT
PAGE-BREAK ENCOUNTERS
To fend against printer inconsistencies.
and remove unnecessary web-oriented UI.
Each on its own page for clearer navigation.

42. At a GLANCE
in print

43. ENCOUNTERS
in print

44. if only there were time...
ADDITIONAL IDEAS

45. For the print version, use the
final page to create a wallet-size
folding emergency reference card.
Bio & allergies on the front, problem
list on the back, medications inside.
CUT & FOLD
REFERENCE CARD
Michelle Blumfeld
AllergiesSex: Female
Age: 32 years
Weight: 175 lb
Contact

46. In the print version, display each
encounter and its page number,
and label each printed page
accordingly.
TABLE of
CONTENTS ## ##
##
##
##
##
##
##
##

47. Allow patients to privately,
securely, and locally merge
multiple files by simply dropping
one into the other in the browser.
Do the merge using JS and offer to
save the new, combined file.
DRAG & DROP
FILE MERGING ## ##

48. Allow the patient to set an
encryption key affecting only the
JSON data contained. Perhaps med
professionals would have a
“master” universal key, like postal
workers do for mailboxes.
ENCRYPTED
HEALTH DATA ## ##

49. Available Data
FINAL NOTES
All of this assumes, of course, that the
included data is available. In looking through
CCD & HL7 documents, it appeared to be.
Technical Issues
To the best of my knowledge, everything
here can be implemented in modern
browsers, and could degrade in ancient
browsers with reasonable levels of grace.
Medical Notes
Ideally, the actual physician’s notes would
be available, in which case they would be
included/collapsed for each encounter.
You are Amazing
If you’re actually reading this, you obviously
care a lot about improving the way we do
these kinds of things. If so, thanks. You’re
pretty swell in my book.

50. FIN
healthrecord.mjacksonw.com
@mjacksonw