Monthly brainstorm and idea sharing session at JSI around data visualization. The August deck focuses on alternative reporting formats and questions to think through to reach various audiences, including tools like interactive timelines, interactive graphics and dashboards (Tableau & others), scrolling/parallax webpages, and key design principles.

1. Design-storm | August
Alternative Reporting Formats
Amanda Makulec
John Snow Inc.

2. how we consume information
Two questions:
1. When was the last time you
settled into a chair in your
office to read through a long,
printed report?
2. When was the last time you
clicked through a link to an
infographic in your email to
find out about results?

3. So how does this massive amount of public expression
change the way we think? Technology—and the worldwide
audience it offers to us all—is pushing us to be
smarter and more creative in the ways we share
and express our ideas, Thompson said.”
We click and consume information on a daily basis. It appears constantly in
inboxes, social media, streams, and web browsers, putting us in a constant
state of information overload. How we consume information has
fundamentally changed, though standard project reporting formats (often
required by funders) have been slow to catch up.
Clive Thompson
Wired Magazine
“As a global community, we write and post some
3.6 trillion words to the internet every day,
Thompson said—that’s roughly equal to the
contents of the entire Library of Congress.
Excerpt from “From Hackers to Health care: Five Favorite Moments from Day 1 of Switchpoint”

4. Design for Delight

5. start here
Who is your audience?
How do they use and consume information?
What story do you want to tell?

6. audience
(world)
Think about who you’re trying to reach and
how they connect with information. Consider
the detail they need, their bandwidth for
connecting to visually-heavy webpages or
downloading large files, and how they want to
consume information. As a few examples:
• A researcher may want more detail about the methods
used to collect the data and conduct the assessment,
requiring a longer form, narrative report.
• An advocate may want sound bites and mini-
infographics that they can share to amplify their
message.
• A donor often wants to see what results have come
from a program they funded, so focusing on results
data presented in an easy to consume format is key.
• Public health professionals are often looking for
information on context, how, and why a program was
successful (or not), so consider including demographic
data to frame your program results and including some
qualitative information on how and why your program
worked.

7. design
Simple graphic design principles applied to your
reporting documents will ensure readability and
maximize learning. You can use design elements and
visual depictions of your data to assist the reader.
• Arrangement: Descriptive text and its related data visualization
should be arranged so they appear together on a page. Narrative
text should be left-justified.
• Color: Blocks of background color can help group cognitively-
similar items or set off reporting elements like sidebars. Text
intended for narrative reading should be set in black or dark gray
on a white or very light background.
• Images: Written reports and presentations should always include
images. Beyond just charts and graphs, photographs or drawings
increase the relevancy of the material to the audience and make
the report more engaging.
• Type: Generally speaking, serif fonts support readability in long,
narrative-style documents produced on paper. Sans serif fonts are
easier to read in electronic reporting media.
From BetterEvaluation: http://betterevaluation.org/plan/reportandsupportuse/report

8. Think Web

9. interactive
Interactivity promotes exploration,
and well-designed interactivity helps
you engage users in a memorable
experience.
The greatest benefit of interactive features is
that they create a more engaging, interesting,
thought-provoking experience for you user.
They also let you share your big-picture, high
level themes and takeaways first, and then
allow the user to explore the information you’re
sharing and learn more about the details. That
prevents your reader from being overwhelmed
with information: instead, user Professor
Shneiderman’s (a master of human-computer
interaction design) mantra to start big and then
let the user burrow into your data.

10. interactive timeline
Great for:
telling a story that unfolds with anecdotes
and results over time, particularly if you
have photos, graphs, and other visual
elements to include
Platforms:
Timeline.JS
Tiki-Toki
Examples:
Fight for Democracy in the
Middle East
(complex, built in Tiki-Toki)
MEASURE Evaluation
(simple, built in Timeline JS)

11. slideshare
Great for:
Making your presentation decks (or preferably
Slidedocs) more accessible by sharing through a
taggable, searchable site that provides an embed
code for you to use on your project website to allow
visitors to click through a presentation without
having to download the Powerpoint or PDF
Platforms:
SlideShare
Examples:
SlideShare embedded on a website
(Ann Emery’s diverging stacked bar charts tutorial)
SlideShare homepage
(Data Viz presentation decks & resources)

12. scrolling webpage
Great for:
Telling your story on an elegant,
scrolling webpage where elements
appear to move as you maneuver
around the screen (instead of a
“download here” PDF link)
Platforms:
You need a web designer for
this one.
Examples:
Gates Foundation Annual
Letter 2014
UNICEF A Promise Renewed

13. interactive graphics
Great for:
Sharing data in a format that promotes
exploration by your user, who can drill down to
different levels of the data using interactive
controls. Caveat is to think about the level of
access you want to give your reader versus
creating the graphs and charts for them.
Platforms:
Tableau (especially new StoryPoints)
Drupal
Other web-based platforms
Examples:
PRB World Data 2014
SPRING Factors Affecting Nutrition in
Uganda

14. don’t forget mobile
While it may not be your primary platform, keep in mind
that an increasingly proportion of internet users are
accessing the web entirely through their mobile phone.
Think about how you can make your information
accessible to those users as you’re designing for the web.

15. Use Metrics

16. use data
“We should make decisions [on how, when, and
where to publish] based upon data. Who will
the audience be for a particular piece of
content? Who are they? What do they read?
That will lead to a very different approach to
being a publishing enterprise. Knowing our
target audience will dictate an entirely
differently rollout strategy. We will go from a
"publish" to a "launch." It will also lead us in a
direction that is inevitable, where we decouple
the legacy model from the digital. At what point
do you decide that your digital audience is as
important—or more important—than print?”
Aron Pilhofer, Executive Editor of Digital Content for The Guardian

17. metrics
“Not everything that can
be counted counts, and
not everything that
counts can be counted.”
Albert Einstein
Consider the various metrics you can use to
measure not only traffic (unique page
views), but also engagement. Are people
sharing content? Commenting? And where
are they coming from? Most web-based
platforms let you track where your readers
are connecting from, helping you
understand if you have the global reach
you might want. Plus, not all numbers are
created equal: while broad dissemination
strategies are appropriate for some
publications, others require a more refined
plan, targeting specific demographic
groups, organizations, or donors.

18. Resources

19. New Resource! Data+Design is a free, creative commons licensed eBook that
gives a comprehensive primer on making data accessible through information. It
starts with data collection, goes all the way through infographic design, and was
created by more than 50 enthusiastic collaborators who love data viz.
Read online or download at infoactive.co/data-design

20. report checklist
Evaluation Report Layout Checklist [Stephanie Evergreen] to access to the full checklist

21. Connect!
Datavizhub.co dataviz@jsi.com