Data Visualization: Information design principles

Gestalt Principles of Design

The Gestalt Principles were first created in the 1920s to describe how human perception naturally tries to find order, grouping elements and finding patterns. By understanding these principles, design and thus data visualizations can be created to be both aesthetically pleasing and easily understood. The Gestalt Principles consist of:

• Proximity: White space

• Similarity: Objects that look similar are instinctively grouped together

• Enclosure: Helps distinguish between groups

• Symmetry: Objects should not be out of balance, or missing, or wrong

• Closure: We tend to complete shapes and paths even if part of them is missing

• Continuity: We tend to continue shapes beyond their ending points

• Connection: Helps group elements together

• Figure and ground: We see foreground first 

Resources:

• Gestalt Principles from the Interaction Design Foundation 

  Overview of gestalt principles with images to visualize each principle

• Gestalt Principles: The Complete Overview 

  By the UX Cam blog

Data visualizations are built using marks and channels and understanding how to use them properly for visual encoding information is critical.

Marks: basic geometric elements that depict items or links in a data visualization

Source: Tamara Munzner, 2014

Channels: visual variables that control the appearance of marks in a data visualization

Source: Tamara Munzner, 2014

Resources

• Munzner. (2015). Marks and Channels. In Visualization Analysis and Design (pp. 95–116). A K Peters/CRC Press. https://doi.org/10.1201/b17511-5. View online.

Proper usage of colour helps viewers quickly process a data visualization, understand the meaning, and remember its impact. Colour choice is extremely important in making data visualizations accessible. Some tools like Tableau and Excel have default colour schemes but this does not always mean that they are optimal.

Colours should be used to highlight the purpose of the data visualization:

• If data is categorical, then visually distinct colours should be used. 
• If data is numerical and continuous, then a sequential colour palette, a graduation of colours, should be used (ex. a pale green to a deep forest green)
• If data is numerical and consists of two extremes of positive and negative values with a baseline in the middle (ex. temperatures), then a diverging colour scheme could be used (ex. blue to red, for cold to hot temperatures)

Resources on colour theory and best practices:

• Which color scale to use when visualizing data, a 4 part series by the Datawrapper blog
• How to pick more beautiful colors for your data visualizations by the Datawrapper blog, which uses hue, saturation, and brightness/value to explain which colours and which colour combinations elevate your data visualizations
• Picking the right colors by Mike Cisneros on Storytelling with Data, which suggests the best colour palette to highlight a comparison between two, three, four, or more categories
• Color for data visualization, part of Adobe's principles to create better designs

Colour palette picking tools:

• Color Brewer 2, provides a selection of palettes based on inputted number of data class and type of palette desired
• Viz Palette, creates a report diagnosing the difficulties in telling inputted colours apart
• Data color picker, can provide a customized palette for categorical data, a single hue sequential palette, or a divergent palette based on a user-chosen colour