Building Custom Data Visualizations

Make your data visualizations designs a reality with D3.js, a JavaScript library for producing dynamic, interactive data visualizations on the web! By coding along with Shirley Wu, you will go through basic visualization principles needed for designing custom data visualizations and delve into the D3.js modules, SVG, and web technologies that are necessary to make advanced data visualizations designs.

• Introduction
• Exploratory and Expository
• Course Agenda
• Exploring the Dataset
• Dataset Exercise
• Dataset Solution, Part 1
• Dataset Solution, Part 2
• Chart Types & Vega-Lite
• Chart Brainstorming Exercise
• Chart Brainstorming Solution, Part 1
• Chart Brainstorming Solution, Part 2
• Chart Brainstorming Solution, Part 3
• Chart Brainstorming Solution, Part 4
• Using Modules in Observable
• Using Heatmap
• Exploration Exercise
• Data Exploration
• Marks & Channels
• Gestalt Laws of Grouping
• Remix & Overlay
• Design Exercise
• Design Solution, Part 1
• Design Solution, Part 2
• Turning Designs into Code
• D3 Shapes and Layouts
• Code Exercise
• Code Solution, Part 1
• Code Solution, Part 2
• Readability
• Readability Exercise & Solution
• Adding Aesthetics
• Adding Aesthetics Exercise & Solution, Part 1
• Adding Aesthetics Exercise & Solution, Part 2
• Interactions
• Exploratory Visualizations
• Additional Resources