Table of contents

  1. Interactive charts
  2. Interactive maps
  3. Animations
  4. Dashboards

Print this page

Download as PDF

Interactive charts

 An interactive chart allows the user to change what the chart shows by taking an action.  

 Users can interact with a chart by scrolling, hovering, or using:   

  • buttons or tabs 
  • a drop-down menu 
  • an input box 

This does not include charts where the only interactive element is a tooltip. A tooltip displays data values when the user hovers over or selects part of a chart.  

Example of an interactive chart using input box

Baby names in England and Wales

When to use an interactive chart 

Only consider interactive charts where the information that is most important for the user cannot be clearly shown through a non-interactive chart.   

An example of a strong user need for an interactive chart is COVID-19 data at a local level. In this case:  

  • users are likely to be most interested in data about their local authority 
  • there is not a clear way of displaying data for each local authority without interactivity

Disadvantages of interactive charts 

 Interactive charts need the user to make a selection to see information. This may:  

  • make it more difficult for users to get messages  
  • hide the main messages from users 
  • prevent the chart from being useful outside of the ONS website, for example, on social media

They are also more complex and time consuming to produce; there may not always be enough resource to create an interactive chart.    

Instead:   

  • try to use charts that highlight the main points of interest or findings without needing user input  
  • consider using several small charts, known as small multiples, to avoid using too many categories in a single visualisation 

 Your charts do not have to showcase everything in the data. Expert users will be able to download and explore the data. 

Tips for creating an interactive chart  

  • Only include data that will be important to your user.  
  • Do not include all your data just because the interactive format allows it.  
  • Design your chart in a way that helps the user get the most meaningful information, for example, by allowing the user to easily compare certain categories. 
  • Provide context and help the user to navigate the data through annotations and the surrounding text. 
  • Consider starting your visualisation from a view that either shows the main message without needing any interaction, or helps users navigate the chart. 
  • Make sure the design of your interactive chart is consistent with other ONS interactive charts and uses elements from the ONS pattern library. 

Interactive maps

Zooming  

Some maps need to have an element of interactivity for the user to zoom in and out to see the data clearly. This is particularly true for maps showing small geographical areas, like local authorities or Middle-layer Super Output Areas (MSOAs).

Maps do not need to include the ability to zoom if the geographical areas shown are large enough to be presented clearly on a static map, for example, a map of the UK showing the devolved nations and English regions.

Other interactive features  

As with other charts, maps can also be made interactive allowing the user to select and change the data and categories shown. If you are creating this kind of interactive map, follow the general guidance on interactive charts.

Animations

Animations can sometimes be used to show data changes over time.

However, animations can make it difficult for users to see the whole story clearly. This is because not all of the data points are shown at once so may be difficult to compare.

Tips for creating an animation  

  • Never make an animation the only way to get the information.
  • Make sure there is a way for the user to control the animation, for example, to pause or reset and navigate through the frames.
  • Keep the animated elements to a minimum as using too many can be distracting and make it difficult to understand what the chart is showing.

An example of an animated chart shows the distribution of COVID-19 antibodies by age, included in a Coronavirus (COVID-19) Infection Survey article.

Dashboards

A dashboard is a visual tool that shows different views of data to provide an overview of a specific topic. A dashboard will normally be a combination of several charts or important values. It is typically updated regularly or automatically, so a user can monitor it over time.

A dashboard may or may not have interactive elements, such as filtering.

When to use a dashboard 

Only consider a dashboard when:

  • you are communicating high-level indicators; the more specific the issues and insights, the less likely it is that a dashboard will be useful
  • the topic is high-priority and users are likely to have some existing knowledge
  • the data are updated frequently, and users are likely to revisit the dashboard
  • the data can be updated automatically or with little extra work to avoid ongoing maintenance

Only use a dashboard if you have clear justification for doing so. This should be based on an understanding of your users’ needs.

Disadvantages of dashboards

There are some disadvantages to using dashboards. In most cases it is better to use charts that provide users with specific insights, and to integrate your charts into your analysis.

Dashboards can be problematic, as they:

  • are not well-suited to highlighting important findings; they put the burden of interpreting and understanding data onto the user
  • are not well-suited to data that need a large amount of explanation to be understood
  • can quickly become obsolete, as findings and user needs change
  • require a lot of maintenance if they need regular updating
  • are difficult to make accessible and responsive for different devices

If you wish to provide complex insights based on a combination of visualisations, use several charts within a single publication. For some publications, we use scrollytelling, where emphasis and information are changed as the user scrolls down the screen.

An example of scrollytelling is Mapping regional differences in productivity and household income.

Tips for creating a dashboard  

  • Put the most important insights at the top or in the most prominent position.
  • You do not have to fit everything onto one screen; if the most important information is visible, the user can scroll up and down.
  • Carry out research and testing to understand user needs.
  • Regularly review the measures in the dashboard to ensure they meet changing user needs and priorities.
  • Use written content to provide context – accompany dashboards with articles highlighting current trends and priorities.
  • Always make sure any dashboard design meets accessibility standards.