Four-Part Challenge

First choose a location and datasets

  • Part 1: Identify insights from data
  • Part 2: Design a map
  • Part 3: Engage audiences with interactivity
  • Part 4: Blog about your process, challenges and successes

Finally, submit your visualization!

The challenge is set up in four parts in order to:

  • Encourage documentation and sharing of the steps you take in your process to create your visualization;
  • Provide a suggested structure for dataviz beginners; and
  • Build momentum and community around the challenge as we collectively work on our visualizations.

You don’t necessarily need to do these parts in order, but you do need to complete each part. Ultimately, you’ll need to submit three URLs to posts that show your dataviz process, a URL to a blog post, and a URL to your finished visualization. Tip: If you are submitting an entry as a team, you only need to have one blog and one social post per part.

You can use any data visualization software or tools that you prefer, provided that you can use a Mapbox basemap as part of your project. A whole host of tools are compatible with Mapbox basemaps, including Mapbox GL JS, Leaflet, Tableau, Power BI, Microstrategy, D3, Carto, and more. See the full challenge rules at: understandrisk.org/vizrisk/rules/

The rest of this page details the four parts of the challenge, with suggested resources for each. You can also check out resources suggested by challenge participants in a living Google Doc here.

First – choose a location and datasets to focus on

#VizRisk partners have prepared three suggested geographies and recommended datasets for your visualizations: understandrisk.org/vizrisk/data/.

You are also welcome to select another geography to focus on if you are interested in other locations or other risk datasets. You may use any risk or hazard datasets (we encourage you to use open data as much as possible).

Part 1 – Data analysis: Identify insights in your data

The first step to any effective data visualization is finding the compelling insights or narratives buried in your data.

Requirement to complete Part 1:

Using #VizRisk, share a social post (Twitter, Instagram, Facebook, or LinkedIn) with a screenshot of some or all of your rough, ‘pre-visualized’ data and a brief teaser explanation of the insight or story that you plan to visualize. Tag @UnderstandRisk @Mapbox and @DataVizSociety for more views. Save the URL link to this post! You’ll need it when you submit your final visualization.

Example:

“Checking out my chosen #VizRisk data in Visidata – based on a histogram of fuel types, I’m going to use the first 10 and lump the last 5 together. Anyone else working with this dataset? @UnderstandRisk @Mapbox @DataVizSociety”

Suggested process:

  • Learn about the context of your selected location and the disaster risk challenges and questions it faces.
  • Download and explore the recommended datasets for your selected location. Identify other datasets that you need in order to visualize and communicate insights about disaster risk. What insights would help governments and citizens prepare for and respond to these hazards? How can these insights help people understand risk?
  • Do some data profiling, or ‘previsualization’, to help you identify the insights from the data. Do the data tell a story? Which insights make sense to visualize on a map? Do these insights make sense?
  • Think ahead to your finished visualization and prepare your selected datasets appropriately. What type(s) of visualization techniques might be appropriate for these data and insights? What fields will you need in your data? Do you need to do some calculations or joins between datasets?
  • Clean and format your datasets into formats that you can work with in Mapbox Studio (or other tools of choice).
  • Upload your datasets to Mapbox Studio (or other previsualization tools of choice). Don’t have a Mapbox account? Sign up for free

Resources:

Sample tools:

Other tool suggestions? Share them in the #challenge-vizrisk channel in the Data Visualization Society Slack

Part 2 – Map design: Create your basemap style

Requirement to complete Part 2:

Using #VizRisk, share a social post (Twitter, Instagram, Facebook, or LinkedIn) with a screenshot of your chosen (ideally customized) Mapbox Studio basemap style and a short comment about why you chose that style. Tag @UnderstandRisk @Mapbox and @DataVizSociety for more views.
Save the URL link to this post! You’ll need it when you submit your final visualization.

Example

“I’ve decided to use a very dark @Mapbox style for my #VizRisk basemap to keep the emphasis on the bright interactive markers I plan to build. What do you think? @UnderstandRisk @Mapbox @DataVizSociety”

Suggested process:

Visualizing data on a map provides context that helps make data more accessible and relatable. But maps can also introduce new visual complexities, making the design of your basemap an important part of your design process. Mapbox tools allow you to have total control over the visual design of your basemap, without needing to be a geospatial expert.

  • To create your basemap (or background map layer) for your visualization, you can either use an existing Mapbox core style or create a customized style using Mapbox Studio.
  • In Mapbox Studio, customize the style of your basemap and any additional data layers that you want to add to your basemap. Consider your target audiences and the communication goals of your visualization.
  • Think ahead to your interactive map – explore options like zoom-based styling for a dynamic map experience.

Resources:

Sample tools:

Other tool suggestions? Share them in the #challenge-vizrisk channel in the Data Visualization Society Slack

Part 3 – Interaction design: Build your interactivity

Requirement to complete Part 3:

Using #VizRisk, share a social post (Twitter, Instagram, Facebook, or LinkedIn) with a screenshot (or live link!) of your data visualization under construction and a short comment about your visualization technique. Tag @UnderstandRisk @Mapbox and @DataVizSociety for more views.Save the URL link to this post! You’ll need it when you submit your final visualization.

Example

“Working on dynamic zoom-based clusters that show a breakdown of the fuel type data by location, still playing with the colors but I like the interactivity #VizRisk Part 3!@UnderstandRisk @Mapbox @DataVizSociety”

Suggested process:

  • The steps for this part depend largely on your chosen dataviz tool(s). If you don’t have a preference, consider the sample tools listed here. Which tools best fit your goals and skills? What interactions help communicate the insights of your data?
  • If you are building your interactivity using code with something like Mapbox GL JS (Javascript library) you might follow steps like this:
    • Create a simple webpage and initialize a map (As described in this tutorial)
    • Load in your data sources
    • Add in ways for viewers to interact with the visualization: layers toggles, time series animations, pop-ups, hover effects, fly-to etc. Check out Mapbox GL JS examples for inspiration and code snippets

Resources:

Mapbox GL JS resources

Sample tools:

Other tool suggestions? Share them in the#challenge-vizrisk channel in the Data Visualization Society Slack

Part 4 – Polish and blog: Share your visualization and process

Requirement to complete Part 4:

Put the finishing touches on your visualization (title, description, attribution to data sources, legends, front-end UI elements etc.). Then write a blog post that documents what you learned and built! Your blog post can be shared on Medium or another site, as long as it is publicly accessible.

Your blog can be as short as a few hundred words or be a longer write up of your story and process – whatever works for you or your team. Consider the evaluation criteria that your submission will be scored against when writing your blog.

Your blog must include:

  • An overview of the datasets that you used and their sources
  • An overview of any Mapbox tools and third-party tools you used
  • A link to your live, publicly accessible visualization (or embed it directly)
  • At least two screenshots (or a screengrab/gif) of your visualization
  • At least two code snippets to help explain how you built it (if applicable)
  • A link to your code (if applicable) or more detailed technical documentation, if you are willing to share it (this is strongly encouraged to help use your visualization and grow the dataviz community)

Celebrate! Share your final project using #VizRisk in a social post (Twitter, Instagram, Facebook, or LinkedIn) with a screenshot of your finished map, a link to your blog post, and a link to your live visualization. Tag @UnderstandRisk @Mapbox and @DataVizSociety for more views. Be sure to share it in the #challenge-vizrisk channel in the Data Visualization Society Slack!

Example blog posts:

Example final social share:

“Here’s my final #VizRisk Challenge visualization @UnderstandRisk – exploring energy sources and fuel types around the world. See how I built these dynamic HTML clusters using @Mapbox GL JS: https://blog.mapbox.com/clustering-properties-with-mapbox-and-html-markers-bb353c8662ba @DataVizSociety

Final step: Submit your entry!

Use the form bit.ly/VizRiskSubmit to enter your visualization to the challenge. The form closes at 11:59pm EDT on July 15th.

All complete submissions will be considered by a panel of judges, with winners of the categories and grand prize announced August 15th. Details on challenge rules, eligibility, how to enter, prizes, and evaluation process.