Digital Information Design Best Practices

According to Carrie, she has always been drawn to "all the computer and math stuff" while working in Honduras and studying ancient settlements. Carrie’s interest in mathematics might be traced to the mystique and discovery that information provides. Analysis, statistics, and mathematics can be great story tellers, especially when they are unheard stories. Today, those same stories have changed from simple tables and figures into digital information design and infographics. What are some best practices for digital information design? There are many information design resources, however there are a few attributes that can make for an effective story with information design and infographics: Make infographics legible What makes infographics legible? The obvious answers for most information designers fall in one or more of the following: color, orientation position, shape, size, texture, and weight. However, there are two ways that the mind perceives infographics and graphical content: pattern perception and table lookup. Pattern perception is a holistic view of data that allows users to draw conclusions about the information being presented (macroscopic). Table lookup is a detailed visual scan of a single unit or group of information (microscopic). Information that can be viewed on a large and small scale is a good way of making your story legible. For example, the Big Bang could be seen as a dull and repetitive topic, until you see it animated to show the macroscopic and microscopic views of the universe that we all dwell in. Infographics that show noticeable and measurable differences that the user can see and perceive makes stories legible too and has been practiced for hundreds of years. 100 year old Brazilian infographic that uses difference thresholds effectively : (Courtesy of Infographic News) Macro and micro infographics: Big Bang Briefly FINAL HD Make the infographics familiar How do we make information familiar? Infographics that allow users to make an connection with an existing knowledge is the key to familiarity. For example, when using infographics to display the United States (U.S.) electric grid, the storycan be familiarized when a national map of the U.S. is overlaid above it. Visualizing the U.S. Electric Grid (Courtesy of NPR): Animate your Infographics Animation goes a long way to make awkward topics a source of discovery and awe. For example, knowing how often 'Good Morning' appears in the Twitter universe may seem uninteresting until you see it animated across continents and over time. Viewing mathematical models of a ten dimension universe may sound like a graduate level course at Harvard, but Rob Bryanton, author of Imagining The Tenth Dimension, managed to explain it using animation via infographics. Twitter GoodMorning! Full Render #2 from blprnt on Vimeo. Imagining the Tenth Dimension (Courtesy of Rob Bryanton): Make it Chunky Information design can be dense with information and should be broken into small chunks for users to comprehend and digest the information. On the Internet, almost all users become visual learners. Short term memory only lasts 20-30 seconds before it is moved to long-term memory or is discarded. Visualizations can be chunked to lower the overall density. OurSignal Personas Google Insights (via Information is Beautiful): Make it Organized What does an organized infographic look like? It strictly follows the Gestalt principles of visual perception: proximity, closure, continuity, enclosure, and connections. Gestalt Principles: Courtesy of UIPUI Computer Science Department: Grids are also good ways to organize space and information. By using columns, modules, margins, and spatial zones, an infographic can take form using single or multi-column grids, modular grids, or hierarchical grids. 960 Grid System If information design and information graphics can make data a frontier full of revelation and breakthroughs, it’s not quite as hard to see why Carrie Grimes went from archeology to statistical analysis, especially when they are two different ways of the unearthing hidden truths. For further inspiration: Information is Beautiful Good Magazine Information Aesthetics Infographics News Edward Tufte Cool Infographics Flowing Data Indexed Google Insights References: The Information Design Handbook by Jenn and Ken O’Grady Information Dashboard Design by Stephen Few The Visual Display of Quantitative Information by Edward Tufte Layout Essentials: 100 Design Principles Using Grids by Beth Tondreau Article by John I. McSwain, III John is an interaction designer and information architect in Atlanta, Georgia. John designs, builds, and prototypes web applications, iPhone applications, and consumer software. John also is an avid technology and design blogger and frequently reviews published literature featuring user experience, information design, and other related topics. He is a graduate of the University of Connecticut and is currently an Human Computer Interaction MS degree candidate at Iowa State University.