Health Everyware<br />Making Mobile Beautiful<br />HIMSS Celltop Design Workgroup<br />Janey Barnes<br />Scott Lind<br />E...
We need a simple set of design best practices that <br />… takes a system approach to design<br />…. accelerates good soft...
MOBILE DESIGN TENETS<br />Let data scream<br />Only handle information once<br />Grid it<br />Type less + less type<br />C...
MOBILE DESIGN TENETS<br />Let data scream<br />Only handle information once<br />Grid it<br />Type less + less type<br />C...
Let data scream<br />
Envisioning Information, E. Tufte<br />
and the Problem is…<br />Increasingly complex systems<br />Tool and Methodology gap<br />Decision makers are swamped with ...
How do I (as a patient, nurse, doctor, proxy)make quicker, more accurate decisions?<br />
Ink and lines scream<br />Data disappears<br />Violates all 5 Tufte principles<br />5 principles produce substantial chang...
Unreadable<br />Grid >> Data<br />Data as Interface… NOT<br />
38%<br />
Priorities, hierarchy<br />Filtering<br />Navigating<br />…<br />…<br />…<br />Patient data<br />1<br />2<br />last<br />
25%<br />20%<br />
70%<br />
80%<br />
80%<br />of the screen space should be for data, the actual workspace<br />
Let data scream<br />The data is THE story<br />Less ink, more bang<br />80% rule<br />
healtheveryware.com<br />
Upcoming SlideShare
Loading in …5
×

Health Everyware: Let Data Scream

2,291 views

Published on

Published in: Technology
1 Comment
6 Likes
Statistics
Notes
  • Congratulations for your work ! Thank you for sharing....Good weekend..Best regards from France. Bernard - For information, your presentation has been referenced in my following groups:

    'SOUND AND MUSIC,the best' : http://www.slideshare.net/group/sound-and-music-the-best-slideshows

    'YOUTUBE,SLIDECAST AND VIDEOS' :http://www.slideshare.net/group/you-tube-slidecast
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total views
2,291
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
16
Comments
1
Likes
6
Embeds 0
No embeds

No notes for slide
  • Create a LIGHTWEIGHT celltop health services design pattern library, UI guidelines documentHarmonize the behavior, aesthetics, layout, interaction, and feel across health apps
  • Now find the patient.Straight-forward to find.Data screams.
  • What’s more important? The UI or the Stroke or Glascow Coma scale results?The Paint vs Data.Image from Stroke Scale app
  • This table is from Wikipedia… and it’s more readable than an app designed just to display this information.And Wikipedia isn’t exactly known for their design… but they are known for their Design.
  • What’s more important? The UI or the Stroke or Glascow Coma scale results?The Paint vs Data.
  • In contrast to the previous example, the user interface takes a backseat… while the data is front and center.
  • Grid lines, labels, UI elements are secondary… they fade into the background because they’re designed to (with smaller, lighter text compared to the data + grid lines are there to help the eye and are light grey, etc).The data pops… as well as the micro trend graph.
  • ARDMS Ultrasound Exam app.
  • Unreadable labels/global optionsRandomly placed buttonsGrid and labels are same visual priority as dataNo practice exam data… how about an action that allows me to take one, add one, import one. SOMETHING other than that.The data should be part of the manipulation game. Why have 4 options listed and I need to swing down another part of the UI to select one of those options? Make the options selectable.
  • Slide credit: Brian Staats
  • Slide credit: Brian Staats
  • Slide credit: Brian Staats
  • App = Tempted by Frog Design (shown here at Pop!Tech 2009)
  • Health Everyware: Let Data Scream

    1. 1. Health Everyware<br />Making Mobile Beautiful<br />HIMSS Celltop Design Workgroup<br />Janey Barnes<br />Scott Lind<br />Eric Miller<br />Bruce Sklar<br />Juhan Sonin, juhan@mit.edu<br />HIMSS Coordinators<br />Edna Boone<br />Juanita Threat<br />22.Jun.10<br />Content in this presentation (unless otherwise noted) is licensed under a Creative Commons Attribution 3.0 License<br />
    2. 2. We need a simple set of design best practices that <br />… takes a system approach to design<br />…. accelerates good software behavior and interface design pattern adoption<br />Guidelines will cover: <br />interaction and behavior models,<br />graphic design (including layout, grid, color palette, type and naming conventions),<br />information architecture,<br />technical implementation<br />
    3. 3. MOBILE DESIGN TENETS<br />Let data scream<br />Only handle information once<br />Grid it<br />Type less + less type<br />Color carefully<br />Date your users<br />Speak my sign<br />What interface?<br />Repeat customers ROCK<br />Get physical<br />Lust to dust<br />
    4. 4. MOBILE DESIGN TENETS<br />Let data scream<br />Only handle information once<br />Grid it<br />Type less + less type<br />Color carefully<br />Date your users<br />Speak my sign<br />What interface?<br />Repeat customers ROCK<br />Get physical<br />Lust to dust<br />
    5. 5. Let data scream<br />
    6. 6. Envisioning Information, E. Tufte<br />
    7. 7.
    8. 8.
    9. 9.
    10. 10. and the Problem is…<br />Increasingly complex systems<br />Tool and Methodology gap<br />Decision makers are swamped with conflicting data<br />Our work is increasingly multi-dimensional (not a flat-decision space)<br />Artifacts driving decisions need to be coordinated, presented<br />Minimal transparency into key health metrics<br />
    11. 11. How do I (as a patient, nurse, doctor, proxy)make quicker, more accurate decisions?<br />
    12. 12.
    13. 13.
    14. 14.
    15. 15.
    16. 16.
    17. 17.
    18. 18. Ink and lines scream<br />Data disappears<br />Violates all 5 Tufte principles<br />5 principles produce substantial changes in graphical design:<br />Above all else, show the data.<br />Maximize the data-ink ratio (i.e., the % of ink that shows data)<br />Erase non-data ink.<br />Erase redundant data-ink.<br />Review and edit.<br />
    19. 19.
    20. 20.
    21. 21.
    22. 22. Unreadable<br />Grid >> Data<br />Data as Interface… NOT<br />
    23. 23.
    24. 24.
    25. 25.
    26. 26. 38%<br />
    27. 27. Priorities, hierarchy<br />Filtering<br />Navigating<br />…<br />…<br />…<br />Patient data<br />1<br />2<br />last<br />
    28. 28. 25%<br />20%<br />
    29. 29. 70%<br />
    30. 30. 80%<br />
    31. 31. 80%<br />of the screen space should be for data, the actual workspace<br />
    32. 32. Let data scream<br />The data is THE story<br />Less ink, more bang<br />80% rule<br />
    33. 33. healtheveryware.com<br />

    ×