Elevate your graphics with Illustrator

Adam Marton · January 15, 2025

NICAR 2025 Handout by Adam Marton, Philip Merrill College of Journalism

This document will walk you through how to use Adobe Illustrator and Flourish Studio to create a heatmap that displays the rate of COVID-19 deaths by U.S. state between May 2020 and December 2022. The graphic will also display vaccine milestones.

Requirements:

  1. A free account at flourish.studio
  2. A copy of Adobe Illustrator (this can also be done using the free vector graphics program Inkscape)
  3. An understanding of the very basics of Adobe Illustrator.
    Note: Here is a great video that will show you some Illustrator basics. You can find other shorter videos on YouTube. All you need to understand is how to use a few basic tools.

How to make a heatmap showing COVID-19 deaths in the U.S. during the pandemic

  1. Download the data. This data displays COVID-19 deaths per 100 people by state for each month between May 2020 - December 2022. The data is from the CDC and state population numbers were obtained from the US Census (to calculate the rates per 100k).

  2. Open Flourish.studio. Start a new visualization. Under “Heat map,” select “Categorical Heatmap” to open a graphic template.

  3. Select the “data” tab. Delete all the data that came with the template. Copy and paste our data (from step 1).

  4. On the right side of the data tab, map X to the month/year column, Y to the state column, and Value to the deaths per 100k column, like so:

  5. Switch to the preview tab. Make changes to the graphic via the tabs on the right side of the screen. I would suggest the following:
    A. Under the Heatmap tab, set cell padding to 0 and height to 1.

    B. Under the Color tab, select “Numeric,” “Sequential,” and “Linear.” You might consider a custom color palette or choose one of the palettes baked into Flourish.

    C. Move the x-axis to the top. Set it to a 45 degree angle

    D. Go through the tabs and make any other changes you think are needed!

  6. Select “Export and publish” then “Publish to share and embed” then “Publish.”

  7. Select “Export and publish” again, then “Download Image.” Change the image format to SVG and download.

  8. Open the downloaded SVG in Illustrator. The easiest way is to right click on the file and select Open with - Adobe Illustrator. Click through or ignore any warnings Illustrator throws.

  9. In Illustrator, select File -> Document Setup -> Edit Artboards. Make your canvas bigger so you have some room to add elements.

  10. Add your annotations. For each of the items below, draw a vertical line from the top of the heat map to the bottom at the appropriate month. Add the text at the bottom of the line (below the graphic). Style the annotations as you see fit. An example is below.

Dec.14, 2020: The first deliveries of the COVID-19 vaccines began
Nov. 21, 2021: Age 18+ eligible for COVID-19 Vaccine Boosters
Jan. 10, 2022: Everyone age 12+ eligible for booster

Source

  1. Add your legend. You can recreate it using Illustrator’s gradient tool. Or, for an easier method, take a screenshot of the legend from Flourish and paste that into your Illustrator canvas.

  2. Use the text tool to add a headline, chatter and source. Style as you see fit.

My final version:

Twitter, Facebook