(613) 818-2848
Menu

Effective visual data design, reporting and presentation

Communicate with clarity and impact using publication-ready data graphics developed following the principles of effective data visualization and set in visually-based and optimized reports and briefs, dashboards, digital reports and interactive displays.

Effective visual data analysis and presentation makes the most of your data, for marketing, business intelligence and management, public policy, program evaluation, data journalism and advocacy.

I learned these principles and techniques by heading to Boston and Mountain View, California and taking training directly from leaders in the field:

Stephen Few, probably the leader in the field, along with Edward Tufte and author of ground breaking books on visual data design, analysis and dashboards, including the foundational “Show Me the Numbers”; and

Duarte Design, the pre-eminent presentation design company in the United States, headed by Nancy Duarte, author of “Slideology”;

and from a career in policy, evaluation and government relations/consulting. I’ve helped clients by both doing the work and showing them how it’s done so they can continue, or by formal workshop-style instruction (see “Training”). I think a combination of these is the way to go.

Let’s look first at  making the most of data in reports and briefings through clear and compelling visuals and presentation. Then we’ll turn to getting your data up on your website and available to the world.

Effective and Engaging Presentation and Reporting with Data Visuals

Exploring and understanding your data, and presenting it clearly to others, depends on making the right choices in graph type, design and presentation. The right choices and good execution make a report or presentation engaging to the reader and clear in its content. The right visual data analysis graphs, like these examples of small multiples, table lenses and heat maps, with a little explanation can replace reams of tables and text.

combined viz data analysis images

 

 

 

 

 

 

 

 

 

 

 

 

All forms of data graphics benefit from good design. Good data visuals are based on solid principles and experience, as I learned taking training from Stephen Few and Duarte Design. As you can see, there are many forms and they all serve some, but never all, purposes. You need to know how and when to choose the best vehicle for the data, and of course, how to produce it. We cover these fundamentals and the means to create effective data visuals in my course.

As important as the data visuals are, it is also as important to place them in the right form of report, briefing note, slide or screen to let them work for you. There are some effective options, including annotated dashboard displays, quick chart-driven briefs/communiques and electronic “slidedoc”-style reports that take advantage of our increasing reliance on and facility with digital documents, incorporating easy navigation and links and designed to be easily readable on tablet and computer screens. The course spends lots of time on this as well.

 

 

 

Dashboards and similar displays are an important tool for displaying what your critical data says, quickly and in one place. They can be static or interactive, but the key is to summarize the key data in one clear view.

I provided this mapping of survey data-pres-thumbnailresponses to a client, who was then able to select and focus on the various categories and regions, seeing the whole picture while dispensing with pages of description.

 

 

 

 

 

 

The next example, displaying federal expenditures on cultural activities, was done as a demonstration. There is a link on the Portfolio page to the live, interactive version published on the Tableau public site.

The dashboard above was done with Tableau, which allows a great deal of flexibility and, if you are using it internally as a dashboard or analytical platform, interactivity. Very good dashboards can also be designed using Excel, which can include modest interactivity through links to other pages and data.

Annotated dashboards provide just enough interpretation to guide the reader and flag any data or other issues. This format could be the backbone of any briefing session, or even a public report.

 

 

As we look at annotated and interactive dashboards, we drift toward forms of reporting that can do away with the traditional paper document as a reporting format. These include several kinds of digital report styles.

I really like and recommend the “slidedoc”. This is a form of digital document, based on PowerPoint or other presentation software, that presents a highly-visual summary of key points.The document is meant to be read on a computer screen, and can contain interactive features such as hyperlinks to let a reader “drill down” to more detail, as well as links to navigate around in the document. A great use of slidedocs is as a briefing preparatory to a meeting, as a way to reduce reliance on decks of printed material. They are quick to prepare and when distributed in advance take away the pressure to include everything you have in you slide presentation. You can simply take data graphics and succinct key points in text from the slidedoc to use in the onscreen presentation. This is an example of a slidedoc page.Slidedoc page example copy

This is a great format, but can be adapted to more familiar formats on paper and PDD if needed to suite your organization while keeping its positive attributes. The design of a slidedoc is critical to its success, including the quality and relevance of the data graphics, the succinctness and clarity of text, and other visual design elements. I have recently, as an example, prepared slidedoc summaries and corresponding slide presentations for the Atlantic Canada Opportunities Agency’s evaluation and audit groups, which supported both their internal briefing processes and inter-agency consultations. Slidedocs are also very attractive if it is necessary to print them, providing the basis for a discussion.

Digital reports can also be based on html pages, like a web page, but used as a standalone report, either internally or hosted and displayed for public viewing. These reports are ideal for inclusion of the kind of interactive data displays discussed below.

From there, it is only a short jump to “infographics”. An infographic is a one page, paper or digital, depiction of a concept or issue and supporting facts and data in a highly visual format. By far the best approach is to rely on the elements of: a cohesive “story”, or set of points that contribute to a clear understanding of the issue or subject at hand; use of high quality data charts as discussed earlier to do most of the work in describing quantitative and even some qualitative information; use of other images only in so much as they impart information, like maps or diagrams, or clearly support a flow or organization of information, such as those created for this purpose by visual presentation leaders like Nancy Duarte; and strategic use of text to ensure that the information is understood. There are many examples of this style, but, not to sugar-coat it, these good examples of the potential of infographics have all too often been obscured by a profusion of “infographics” that are really nothing more than a jumble of related but unconnected “factoids” placed on a page with bright colors, symbols and numbers. These are generally designed by people who do not understand data or how data is best presented for clarity and comprehension. As you might guess, I will not do this. I will, however, give you coherent one-page data-based presentations of a subject or issue that will tell the “story” in the data.

Presentation of data to the wider world of your stakeholders, customers and the general public can take or draw from any of the forms discussed above, but the key is always the quality and clarity of the data visuals and a good fit with your communications requirements. Good data graphic design follows principles to accentuate the message and suppress the irrelevant.

 

 

Combining Set and Interactive Data Visuals for Websites

Bringing your data to the world often involves, or should involve, your website. This is about adding some interactive appeal. Including an interactive chart or map in a set of standard charts and textual explanation can provide a more engaging experience to someone looking at your website.

Tableau is a great tool for interactive visual presentation. Here is an example of a worksheet/dashboard presentation of data on population, dwellings and density per dwelling for Ottawa, Canada. The boundaries are postal forward sorting areas. The statistical data is from the 2011 Census of Canada. This was embedded on my site as an interactive visual by posting it first on Tableau public. As long as your information is public and you are ok with posting on the Tableau Public site, either through your own account or with the help of someone like me, then a wide range of interactive and beautiful visuals are waiting to go on your website using your data.

I have started to add interactive D3.js visuals to what I do. D3.js is a javascript-based approach to data visualization that allows customizable and interactive data visualizations that can be put up on a website or any other html page without posting it elsewhere first. An advantage of this, other than avoiding software licensing costs, is that you can keep your data in-house if this is an issue; you don’t have to post your work on a public server to do this and you can put up some pretty nifty visuals. Many effective and engaging visuals are possible with D3.js. You can zoom in on this map and reposition it by dragging with your mouse or trackpad. The globe can also be rotated and reoriented to focus on a particular part of the world at a time. In this example the city markers are sized proportionally to population, but could be sized or coloured to reflect any other information. Various levels of detail in political and geographic features and boundaries are possible, although this is most well-developed for the United States at the moment.

Or, in this example, you can see how tooltips can provide more information in a mapping. The information could include anything from numbers of customers and clients, to funded organizations, to points of interest. In this example, you use your browser’s zoom to close in and out, and your cursor to activate the tooltip. I think I’ll call this “I’ve Been Everywhere, Man”, reflecting the Hank Snow song about having travelled all over the map in his career, in this case following some of my travels. Maps like this could display all kinds of information, combining tooltip annotations with mark sizing and colour to show project locations, population centres, incidents or anything else where you have the longitude-latitude coordinates. Here, mark size reflects population, and colour reflects why I was there: green for work, orange for fun and blue for both, probably multiple times. As discussed above, more detailed political/geographic boundary and features information is becoming available for applications like this, although most is still relevant mainly to the U.S.

When designed and executed with the same attention to clarity and economy and principles-based design as was presented in the previous section, this opens up a world of possibilities.

A few more examples. The first chart below illustrates the labour force composition trend in scientific researchers per million population for the OECD countries. It is obviously too dense to provide information on all of the countries, so at best you can highlight a few of interest. Here, Canada is highlighted in orange. The line chart below that, done with d3.js, allows you to use your mouse or trackpad to emphasize the series in which you are most interested, one at a time. Other interactive features of D3.js include “toggle” functions that can turn some of the data on or off, letting you focus on what is most important in a complex picture. Try moving your cursor over/clicking on the examples that follow, as indicated.


The interactivity of D3.js visuals connect contextual and in-depth information directly to visual data displays, as in this standard chart example. Interactive elements like this, combined with static charts and text makes a highly engaging digital page possible. Moving your cursor over the country name labels displays text below or over charts to highlight key information.

The same kind of functionality brings more information to any kind of data visual:



We’ve covered a few of the possibilities to provide interaction and engagement for your readers. Here’s a closing example of an interactive tree diagram. This could illustrate anything where there are unfolding and branching possibilities: from a news article to a project plan to a series of outcomes and recommendations. You can use this either to easily produce a very complicated and beautiful tree diagram simply by entering the data into a spreadsheet file and running the program, or to put a live version on your site, so that a reader can be engaged in the unfolding of a process or narrative.

For now, let’s end with a lighthearted (and fictitious) look at how you might use D3.js to tell a story. Click on any filled circle to advance the story.

 

 

 

My visual data clients include the Atlantic Canada Opportunities Agency, The Agency for Co-operative Housing and consulting companies doing work for the World Bank, the Girl Guides of Canada and Toronto Community Housing. I have conducted repeats of my skill-development workshop for the Canadian Evaluation Society.

visual-data-clients