Making the change to static charts with limited options has completely changed the way we think about the visualisations we do. The \u201cconstraints\u201d we\u2019ve applied remove a lot of the decision-making usually found in design. We only have four main colours to work with (a few shades of those) and we have predefined fonts and sizes for each element on charts (titles, axis labels, source etc). The charts are always 1080px X 1080 px.<\/p>\n\n\n\n
With the basics of colours, fonts, and chart shape out of the way, we can focus on the point of the chart rather than fiddling with the elements.<\/p>\n\n\n\n
There are times when the limitations can feel frustrating and when it feels like a bit more freedom would make it easier to make a better-looking chart. Ironically it\u2019s at exactly this point that the benefits of constraints really come into their own. Because you don\u2019t have the option to make new colours, change fonts or stretch the chart to fit the data we\u2019re forced to think outside of the immediately obvious solutions. That doesn\u2019t guarantee that you\u2019ll make a better chart but it does ensure you think through the options properly.<\/p>\n\n\n\n Static charts also have another major advantage over interactive ones in that they are portable. We can use them on our website, on Twitter, Instagram, or even via WhatsApp and we don\u2019t have to worry about how they render. It removes a lot of headaches and makes it significantly easier to re-use the charts across multiple channels from our newsletters<\/a>, to Instagram<\/a> and Twitter<\/a>.<\/p>\n\n\n\n We settled on the 1080 x 1080 size for our charts because it seemed the optimal size for most of the platforms we use. But we did design the template so the charts could easily be used at half-size without losing detail. In fact, at full size the charts are probably oversized but because they are most often viewed around 600px square that\u2019s fine. We\u2019d rather the fonts look a little too big at full size than have them too small on a mobile phone.<\/p>\n\n\n\n The built-in limitations of static charts also forces us to think about the intention and message of each chart we make. Static charts are exactly that: static. We can\u2019t have layers of information that users can click through to find the message or meaning. And when we can\u2019t rely on interactivity to make visuals useful to people we have to think carefully about what we include in each chart. And in most cases, it\u2019s more a case of how much we can leave out rather than how much we can include in each chart.<\/p>\n\n\n\n Static charts also force us to think about annotations. Interactive charts often rely on pop-ups to add extra value. With static charts, we have to think about other methods to add insight to a chart. Most often this is a compromise between how much detail we can add and how much we can leave out. For example, we often add values to bars when it\u2019s important that readers understand the exact details and drop the x- or y-axis labels to avoid clutter. If the details aren\u2019t as important then we may drop the direct labelling of bars and include the axis points for a sense of scale.<\/p>\n\n\n\n Making visualisations that are both good-looking and valuable to readers is never going to be easy. But setting constraints has massively improved our productivity. Earlier this year it would often take our very small team a few days to finalise one chart, a lot longer for interactive ones. We introduced our new limited static charts at the end of March 2022 and we\u2019re now publishing at least one new chart every day of the week, more than 120 new charts in six months.<\/p>\n\n\n\n We still have a way to go to really refine our process of chart-making but I can highly recommend setting yourself some constraints and working within limits for a while to sharpen your chart skills. You can see our charts (including earlier ones) here: https:\/\/charts.theoutlier.co.za<\/a><\/p>\n\n\n\n To be fair the idea of static charts is not new. For years in a print newsroom that\u2019s all we produced. And then the internet happened and new technology opened the way for increasingly complex interactive visualisations and we\u2019re just now rediscovering the simple joys, and lessons, of those earlier days.<\/p>\n\n\n\n We\u2019re not alone in this and there are a lot of good discussions in the data visualisation community over the value of interactive versus static visualisations, for example:\u00a0@jburnmurdoch<\/a>\u00a0There are also a number of good papers looking at\u00a0interactivity versus static charts<\/a>\u00a0and\u00a0comparative examples<\/a>.<\/p>\n\n\n\n On constraints, Alex Selby-Boothroyd<\/a> of The Economist wrote a great introduction to their really tiny charts in the Off the Charts<\/a> newsletter (subscriber only I think) but think thumbnail-sized charts.<\/p>\n\n\n\n We\u2019ve also been heavily influenced into adopting static charts with constraints by the excellent work of Al Jazeera Plus, FT and The Economist.<\/p>\n","protected":false},"excerpt":{"rendered":" Making the change to static charts with limited options has completely changed the way we think about the visualisations we do. The \u2019constraints\u2018 we\u2019ve applied remove a lot of the decision-making usually found in design.<\/p>\n","protected":false},"author":1,"featured_media":86703,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[447,448,1387],"tags":[359,464,463,465],"newsletter-post":[],"site":[],"class_list":["post-64","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-databites","category-how-to","category-the-outlier","tag-data-journalism","tag-ideas","tag-visualisation","tag-work"],"acf":{"big_number":"","big_number_caption":"","big_number_link":"","big_number_background":"","big_number_text_colour":"#000000","big_number_icon":false,"big_number_wide":"yes","featured_chart":false,"flourish_chart_id":"","flourish_sub_title":"","flourish_chart_width":"medium","is_newsletter_post":"No","post_style":"bc","show_on_front":"Yes","link_through":"Yes","chart_url":"","background_colour":"#0089AA","text_colour":"#FFFFFF"},"_links":{"self":[{"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/posts\/64","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/comments?post=64"}],"version-history":[{"count":2,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/posts\/64\/revisions"}],"predecessor-version":[{"id":89536,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/posts\/64\/revisions\/89536"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/media\/86703"}],"wp:attachment":[{"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/media?parent=64"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/categories?post=64"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/tags?post=64"},{"taxonomy":"newsletter-post","embeddable":true,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/newsletter-post?post=64"},{"taxonomy":"site","embeddable":true,"href":"https:\/\/outliereditor.co.za\/index.php\/wp-json\/wp\/v2\/site?post=64"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}![\"\"](\"https:\/\/editor.mediahack.co.za\/databites\/wp-content\/uploads\/sites\/3\/2023\/03\/OutlierCharts-1024x580.png\")
<\/a>Not just about design<\/h2>\n\n\n\n
Focus on the message and value<\/h2>\n\n\n\n
Speeding up<\/h2>\n\n\n\n
Credit where due<\/h2>\n\n\n\n