Making Information Usable: The Art & Science of Information Design

1,027 views

Published on

Presented by Nate Denton and Jeff Hirner at the 2011 Hubbard One Innovation Forum.

Published in: Technology, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,027
On SlideShare
0
From Embeds
0
Number of Embeds
19
Actions
Shares
0
Downloads
27
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • The biggest value is achieved when you deliver the most valuable, actionable and trusted informationto the right audience in a format that supports the decision making processValuable information: (Related to information value chain)Data is an object and information is a relationship between data, and knowledge is the application of information.:“Data” - Data is essentially an object. Standalone it's useless. Take the name of the hotel for example - “Half Moon Bay” is data which doesn’t tell you much.“Information” – however, when you associate “Half Moon Bay” with “Innovation Forum” or link it to your LinkedIn profile, it turns into information. You create relationships between different types of data “Knowledge” – apply the information to a scenario. Greatest value is in how uniquely you can apply it to create competitive advantage
  • The biggest value is achieved when you deliver the most valuable, actionable and trusted informationto the right audience in a format that supports the decision making processActionable information: (Related to presentation)The information needs to be relevant to the audience as to facilitate and enable decision makingThe sign on the left will probably make you stop in the highway or keep going without knowing where you need to go.Signs on most airports on the other hand are set up in a way that allows passengers to make decisions about the direction they want to take without having to stop
  • The biggest value is achieved when you deliver the most valuable, actionable and trustedinformationto the right audience in a format that supports the decision making processTrusted Information has the properties of:Authority:  it is up-to-date and recognized as the reference copy of the relevant information.Authenticity:  it is what it says it is and can be linked back to its source.Reliability:  it can be trusted as a full and accurate representation of the relevant facts, transaction or business process.Integrity:  it is complete, unaltered and preserves context and chain of custody.
  • So what happens when there is data overload?Cleaning/harmonizing data is a large effort at firms today. Currently firms are overcoming by applying manual efforts:Firms are currently tackling the issue of data acquisition, manipulation and concordance in a very manual way. That has to change… We’re seeing a new trend toward automating the data concordance.
  • Link to actual site that allows for dynamic explanation: www.bit.ly/cVMWJ4This visualization tool presents vast amount of information including population, life expentancy, Income, continent, trends over time, etc. for most of the worlds countries in a simple and intuitive way.As you run the time movie, you can observe the effect of things like World War II on European countries (orange), the fast increase in income of China in the 90s, the decline of life expectancy of African countries on the 90s, The sharp decline in life expectancy during the Russian revolution 1917 - 1920, etc.All this without having to analyze the vast amount of data that supports this visualization
  • Link to actual site that allows for dynamic explanation: www.bit.ly/cVMWJ4This visualization tool presents vast amount of information including population, life expentancy, Income, continent, trends over time, etc. for most of the worlds countries in a simple and intuitive way.As you run the time movie, you can observe the effect of things like World War II on European countries (orange), the fast increase in income of China in the 90s, the decline of life expectancy of African countries on the 90s, The sharp decline in life expectancy during the Russian revolution 1917 - 1920, etc.All this without having to analyze the vast amount of data that supports this visualization
  • - Consider the audience – a lot of people are gathering their information on the go
  • - Recently emerging discipline of responsive architecture
  • - Total polled 1385
  • Making Information Usable: The Art & Science of Information Design

    1. 1. Making Information Usable: The Art & Science of Information Design<br />Nathan Denton & Jeff Hirner<br />
    2. 2. Innovation as a Convergence Point Opportunity<br />Innovation opportunityaroundservices marketing, business develop & practice management<br />
    3. 3. “Visualizing information is a form of knowledge compression. It's a way of squeezing an enormous amount of information into a small space.”<br />- David McCandless<br />“The biggest value is achieved when you deliver the most valuable, actionable and trusted information to the right audience in a format that supports the decision making process”<br />- Angel Garcia<br />
    4. 4. Delivery of Valuable Information<br />The best “information value chain” adds the best value at the lowest cost along each “link”<br />that ultimately is applied to inform decisions.<br />Data is entered or collected…<br />then cleaned, classified, related to other data…<br />to create, organize, integrate, and deliver information…<br />
    5. 5. Delivery of Actionable Information<br />
    6. 6. Delivery of Trusted Information<br />
    7. 7. Data Overload<br />
    8. 8. “Art, in itself, is an attempt to bring order out of chaos.”<br />- Stephen Sondheim<br />
    9. 9. What is a good presentation?<br />Finding the right presentation to uncover patterns, connections, relations that allow us to focus on the information that matters most so we can act on it.<br />3 Key Rules in delivering data<br />1) Keep the visuals clear<br />2) Keep the visuals consistent<br />3) Make the visuals meaningful; space is a precious commodity<br />
    10. 10.
    11. 11.
    12. 12.
    13. 13.
    14. 14.
    15. 15.
    16. 16.
    17. 17.
    18. 18. The Design Trends<br />
    19. 19.
    20. 20. Iconography<br />
    21. 21. Iconography<br />Icons are a great way to quickly identify and group content in a way that adds visual interest to the page. It can also bridge the language gap.<br />5 Principles of Effective Icon Design<br />1. Approach icon design holistically<br />2. Consider your audience<br />3. Design for the size the icon will be used at<br />4. Keep icons simple<br />5. Create consistent icon set styles<br />
    22. 22.
    23. 23.
    24. 24.
    25. 25. Color<br />
    26. 26. Colors<br />Ways that colors can help enhance content<br /><ul><li>Grouping content and ideas
    27. 27. Reinforcing interactivity
    28. 28. Drawing attention
    29. 29. Supporting brand
    30. 30. Affect feeling and emotion</li></li></ul><li>
    31. 31.
    32. 32.
    33. 33.
    34. 34.
    35. 35.
    36. 36.
    37. 37. Info Graphics<br />
    38. 38. Information Graphics<br />Presenting complex data quickly, cleanly, and efficiently.<br />Information graphics can help visually communicate:<br /><ul><li>Data
    39. 39. Relationships
    40. 40. Processes
    41. 41. Events</li></li></ul><li>“Don’t just show the notes, play the music!”<br />- Hans Rosling<br />
    42. 42. Source: Gapminder.com<br />
    43. 43. “The commonality between science and art is in trying to see profoundly - to develop strategies of seeing and showing.”<br />- Edward Tufte<br />
    44. 44.
    45. 45. “Visualizing information is a form of knowledge compression. It's a way of squeezing an enormous amount of information into a small space.”<br />- David McCandless<br />
    46. 46.
    47. 47.
    48. 48.
    49. 49.
    50. 50.
    51. 51.
    52. 52.
    53. 53.
    54. 54.
    55. 55.
    56. 56. Streamlining<br />Content<br />
    57. 57.
    58. 58. Streamlining Content<br />Show what is most important<br />Reinforce importance with visual hierarchy<br />Reinforce interactivity intuitively<br />Consider the audience<br />
    59. 59.
    60. 60.
    61. 61.
    62. 62.
    63. 63.
    64. 64.
    65. 65.
    66. 66.
    67. 67.
    68. 68.
    69. 69.
    70. 70. Responsive<br />Design <br />
    71. 71. Responsive Design<br />Responsive design is the approach that suggests that design and development should respond to the user’s behavior and environment based on screen size, platform, and orientation.<br /><ul><li>Flexible grids
    72. 72. Flexible layouts
    73. 73. Flexible images
    74. 74. Intelligent use of CSS media queries</li></li></ul><li>Responsive Design<br /><ul><li>Many users don’t maximize their web browsers (49.6%)
    75. 75. Roger Johansson poll: Windows65%, Mac20%
    76. 76. Over 400 varying devices sold between 2005 and 2008
    77. 77. Impossible to predict the future</li></li></ul><li>

    ×