Justin's blog

Comparing hot sauces on a matrix of tangy to sweet, smoky to spicy.

Hot sauce rankings Comparing Rio in 2012 and 2016 after the Olympic construction boom.

Rio: A city transformed

Lunar landings: debris on the moon graphic.

Space Waste: Lunar debris SpaceX

SpaceX

How "democratic" is Congress? US Presidents assassinations graphic.

Days since a U.S. President was last shot Pantone color of the year graphic.

Pantone® Color of the Year US Presidents by birth year graphic.

US Presidents by Birth Year

Frontend Fundamentals: HTML A scatter plot showing the relationship between the Human Development Index (vertical axis) and Corruption Perceptions Index (horizontal axis) for various countries. A red trend line indicates a positive correlation, with high HDI linked to low corruption.

A scatter plot showing the relationship between the Human Development Index (vertical axis) and Corruption Perceptions Index (horizontal axis) for various countries. A red trend line indicates a positive correlation, with high HDI linked to low corruption.

Corrosive Corruption A graph showing global surface temperature changes from 1880 to 2020. Points transition from blue to red, indicating a rise in temperature over time. The y-axis represents temperature change in Celsius, and the x-axis shows years. Data by NASA.

A graph showing global surface temperature changes from 1880 to 2020. Points transition from blue to red, indicating a rise in temperature over time. The y-axis represents temperature change in Celsius, and the x-axis shows years. Data by NASA.

Global Temperature Trends Map of the United States showing states with same-sex marriage legality: fully legal (blue), fully illegal (red), and mixed legality (green). Data source: Wikipedia.

Map of the United States showing states with same-sex marriage legality: fully legal (blue), fully illegal (red), and mixed legality (green). Data source: Wikipedia.

Altered States: Cannabis in the US A grid of 36 colorful icons representing various charts and graphs, including bar, pie, line, and scatter plots, each depicted in a minimalist style.

A grid of 36 colorful icons representing various charts and graphs, including bar, pie, line, and scatter plots, each depicted in a minimalist style.

Charts & Graphs Artwork depicting students with obscured faces at desks, surrounded by a red, graffiti-like background.

Thoughts & Prayers A cartoon Tony Soprano in a white robe holds a newspaper, standing in front of a burning dumpster with ducks nearby. A Bada Bing! sign and car are in the background under a dramatic sky.

A cartoon Tony Soprano in a white robe holds a newspaper, standing in front of a burning dumpster with ducks nearby. A Bada Bing! sign and car are in the background under a dramatic sky.

The Sopranos A heatmap ranking the popcorn at 29 NBA arenas based on five qualities: butter, crunchiness, freshness, presentation, and saltiness. Top arenas: Mavericks (24), Nets (23), and Heat (22). Scores are color-coded from light to dark orange.

A heatmap ranking the popcorn at 29 NBA arenas based on five qualities: butter, crunchiness, freshness, presentation, and saltiness. Top arenas: Mavericks (24), Nets (23), and Heat (22). Scores are color-coded from light to dark orange.

Steph Curry's Popcorn Problem

U.S. Union Membership Rate, 1964-2018 A bar graph titled Monthly Background Checks from 2000 to 2023. The graph shows a general upward trend, with notable spikes around events like Sandy Hook, San Bernardino, and January 6th. Total checks peak at over 4 million.

A bar graph titled Monthly Background Checks from 2000 to 2023. The graph shows a general upward trend, with notable spikes around events like Sandy Hook, San Bernardino, and January 6th. Total checks peak at over 4 million.

NICS Background checks Graph comparing median wages to affordable studio wages in select U.S. cities in 2022. Includes cities like New York, Boston, Seattle, Miami, and El Paso. Shows disparity where affordable studio wages exceed median wages in several locations.

Graph comparing median wages to affordable studio wages in select U.S. cities in 2022. Includes cities like New York, Boston, Seattle, Miami, and El Paso. Shows disparity where affordable studio wages exceed median wages in several locations.

The Carrie Bradshaw Index Map depicting parts of Eastern Europe, including Ukraine, Moldova, Romania, and Russia, with the Black Sea. Red asterisks depict strikes in the sea near Crimea, highlighted in green stripes.

Map depicting parts of Eastern Europe, including Ukraine, Moldova, Romania, and Russia, with the Black Sea. Red asterisks depict strikes in the sea near Crimea, highlighted in green stripes.

Black Sea Fleet Losses The Palmer Archipelago penguins. Artwork by @allison_horst.

Palmer's Penguins An image showing five columns of NBA team logos linked together, representing tournament matchups or standings. Teams include the Bucks, 76ers, Hawks, Nets, Cavaliers, Heat, and others. Lines connect logos across columns, suggesting progression or timeline.

An image showing five columns of NBA team logos linked together, representing tournament matchups or standings. Teams include the Bucks, 76ers, Hawks, Nets, Cavaliers, Heat, and others. Lines connect logos across columns, suggesting progression or timeline.

NBA graphics A scatter plot shows the relationship between gun ownership and firearm deaths per 100k people in various countries. The x-axis represents guns per 100k people; the y-axis shows firearm deaths. Data points are scattered with a trend line, highlighting the U.S.

A scatter plot shows the relationship between gun ownership and firearm deaths per 100k people in various countries. The x-axis represents guns per 100k people; the y-axis shows firearm deaths. Data points are scattered with a trend line, highlighting the U.S.

Lethal Passage Women at large machines, in the 1940s

Women in STEM A scatter plot shows deaths per 100k people versus a gun regulation index. Colors range from light to dark red indicating higher death rates. A downward trend line suggests that stricter gun regulations correlate with fewer deaths. Data: Epidemiology Nov 2023.

A scatter plot shows deaths per 100k people versus a gun regulation index. Colors range from light to dark red indicating higher death rates. A downward trend line suggests that stricter gun regulations correlate with fewer deaths. Data: Epidemiology Nov 2023.

Gun Regulation Index Illustration of the White House at night, featuring a bright exterior illuminated by lights. The American flag flies atop the building, with silhouettes of trees framing the scene.

Illustration of the White House at night, featuring a bright exterior illuminated by lights. The American flag flies atop the building, with silhouettes of trees framing the scene.

13 Keys to the White House A world map illustrating the voyage of the HMS Beagle from 1831 to 1836. The path is marked in colored lines, highlighting stops at the Falkland Islands and the Galápagos Islands. Map includes text about Darwin’s theory. Data by Marilyn Waldman.

A world map illustrating the voyage of the HMS Beagle from 1831 to 1836. The path is marked in colored lines, highlighting stops at the Falkland Islands and the Galápagos Islands. Map includes text about Darwin’s theory. Data by Marilyn Waldman.

The Voyage of the HMS Beagle A series of five U.S. maps showing the growth of Wal-Mart stores by decade from the 1960s to the 2000s. Blue dots represent store locations, expanding from a few in the central region to widespread coverage across the country over time.

A series of five U.S. maps showing the growth of Wal-Mart stores by decade from the 1960s to the 2000s. Blue dots represent store locations, expanding from a few in the central region to widespread coverage across the country over time.

Sprawl-Mart A black screen displays 8:46 in bold white text, with a Start Timer button underneath. Below, it reads, On May 25th 2020, Derek Chauvin held his knee on the neck of George Floyd for 8 minutes and 46 seconds, resulting in Mr. Floyds death.

A black screen displays 8:46 in bold white text, with a Start Timer button underneath. Below, it reads, On May 25th 2020, Derek Chauvin held his knee on the neck of George Floyd for 8 minutes and 46 seconds, resulting in Mr. Floyds death.

8 minutes, 46 seconds A bar chart illustrating the timeline of events covered in Gibbons Decline and Fall of the Roman Empire. The events range from page 1 to 3,737, covering significant chapters like the foundation of Constantinople and ecclesiastical discord.

A bar chart illustrating the timeline of events covered in Gibbons Decline and Fall of the Roman Empire. The events range from page 1 to 3,737, covering significant chapters like the foundation of Constantinople and ecclesiastical discord.

The Decline and Fall of the Roman Empire A heatmap showing daily activity from 2019 to August 2024, with months listed horizontally. Color intensity ranges from light yellow indicating less time to dark red indicating more time spent. Activity varies across different months and years.

A heatmap showing daily activity from 2019 to August 2024, with months listed horizontally. Color intensity ranges from light yellow indicating less time to dark red indicating more time spent. Activity varies across different months and years.

Crossword Puzzle Stats Box plot compares caffeine content (mg) across five classes: Energy Drink, Medication, Hot Drink, Soft Drink, and Chocolate. Ranges vary, with Energy Drinks showing the highest and most variable caffeine levels.

Box plot compares caffeine content (mg) across five classes: Energy Drink, Medication, Hot Drink, Soft Drink, and Chocolate. Ranges vary, with Energy Drinks showing the highest and most variable caffeine levels.

Caffeine Data Visualization A line graph showing ages of the worlds oldest people from 1960 to the 2010s. Females are indicated by orange dots and males by blue. Notable figures include Jeanne Calment, who appears prominently with labels. Ages range from 110 to 122 years.

A line graph showing ages of the worlds oldest people from 1960 to the 2010s. Females are indicated by orange dots and males by blue. Notable figures include Jeanne Calment, who appears prominently with labels. Ages range from 110 to 122 years.

World's Oldest Person Titleholders OpenAI company logo

OpenAI Timeline An illustration of a flag on a pole, featuring a stylized profile of Donald Trump's face with prominent blond hair against a red background. The design is shredded horizontally, giving the appearance of a disrupted image.

The Failing NYT Illustration of four people interacting with large, floating digital screens displaying data and graphics, including a semi-circle dial. The scene suggests teamwork and technology in a modern workspace.

Illustration of four people interacting with large, floating digital screens displaying data and graphics, including a semi-circle dial. The scene suggests teamwork and technology in a modern workspace.

Data Visualization Glossary $The image shows the entropy formula: $ H = -\sum_{i=1}^{k} p_x \log(p_x) $, where $ k $ is the number of possible outcomes, and $ p_x $ is the probability of a specific outcome.$ Equations that Changed the World A plot graph showing various cities, with lines and dots connecting data points. Notable cities labeled include Fairfield, Conn., San Jose, San Francisco, Houston, Washington, D.C., and Chicago, indicating varying data ranges across the chart.

A plot graph showing various cities, with lines and dots connecting data points. Notable cities labeled include Fairfield, Conn., San Jose, San Francisco, Houston, Washington, D.C., and Chicago, indicating varying data ranges across the chart.

Inequality in America, 1980 - 2015 The Red Hot Chili Peppers logo

Red Hot Chili Peppers Tribute Abstract painting by Piet Mondrian featuring red, blue, yellow, and white rectangles separated by black lines. Titled Composition with Red, Blue and Yellow, 1930.

Abstract painting by Piet Mondrian featuring red, blue, yellow, and white rectangles separated by black lines. Titled Composition with Red, Blue and Yellow, 1930.

Piet Mondrian in CSS Grid Four scatter plots with green dots, each labeled 1 to 4, titled The same data graphed. A trend line with a shaded confidence interval is present in each plot. The x-axis ranges from 5 to 20, and the y-axis ranges from 4 to 12.

Four scatter plots with green dots, each labeled 1 to 4, titled The same data graphed. A trend line with a shaded confidence interval is present in each plot. The x-axis ranges from 5 to 20, and the y-axis ranges from 4 to 12.

Anscombe's Quartet Graph titled Work in progress showing WeWork funding rounds from 2010 to 2023. Financial growth starts at $0B in 2010 and reaches $45B by 2021, with notable increases marked D, F, and the epic SoftBank round at G in 2019.

Graph titled Work in progress showing WeWork funding rounds from 2010 to 2023. Financial growth starts at $0B in 2010 and reaches $45B by 2021, with notable increases marked D, F, and the epic SoftBank round at G in 2019.

WeWork Valuation A computer desktop screen displaying a Windows XP interface with the Start menu open. The menu lists programs like Internet Explorer and Outlook Express. The background features a green hill and a blue sky with scattered clouds.

A computer desktop screen displaying a Windows XP interface with the Start menu open. The menu lists programs like Internet Explorer and Outlook Express. The background features a green hill and a blue sky with scattered clouds.

Windows XP Map of the contiguous United States showing the area codes where rapper Ludacris claims hoes.

Where rapper Ludacris claims hoes Illustration of a framed picture hanging on a pink wall. The picture depicts a simple sailboat on water with two clouds. Below, a plaque reads Scene From Moby Dick.

Illustration of a framed picture hanging on a pink wall. The picture depicts a simple sailboat on water with two clouds. Below, a plaque reads Scene From Moby Dick.

The Simpsons A light grey poster with the word CHILL in the center. In the bottom right corner, text reads: OFF-WHITE c/o VIRGIL ABLOH™ Defining the grey area between black as the white color Off-White™.

Off-White

Illustrated solar system showing orbits of planets and some moons. Sun is on the left, followed by Mercury, Venus, Earth with Moon, Mars, Ceres, Jupiter with moons, Saturn with moons, and Uranus with moons.

The Solar System A circular emotion wheel displaying various emotions organized by intensity and grouped into categories: sad, mad, scared, joyful, powerful, and peaceful. Each segment includes related emotions from light to intense.

A circular emotion wheel displaying various emotions organized by intensity and grouped into categories: sad, mad, scared, joyful, powerful, and peaceful. Each segment includes related emotions from light to intense.

Feeling Wheel

Titanic Survival Analysis Grid displaying numbers from 1 to 200, with prime numbers highlighted in red. The text at the top reads, All prime numbers under 10,000.

Grid displaying numbers from 1 to 200, with prime numbers highlighted in red. The text at the top reads, All prime numbers under 10,000.

Prime numbers What do you call a pig that does karate? Pork chop!

Word avalanches Illustration of a man at a laptop learning web development.

Developer Resources A survey form with three smiley faces: happy, neutral, sad. A red pencil marks the happy face. The text on the left reads Customer Satisfaction Survey with a teal and white abstract background.

A survey form with three smiley faces: happy, neutral, sad. A red pencil marks the happy face. The text on the left reads Customer Satisfaction Survey with a teal and white abstract background.

Customer Satisfaction (CSAT) Infographic showing Net Promoter Score. It features a formula: percentage of promoters (smiley faces) minus percentage of detractors (frowning faces), with passives as neutral faces in between, ranked from 0 to 10.

Infographic showing Net Promoter Score. It features a formula: percentage of promoters (smiley faces) minus percentage of detractors (frowning faces), with passives as neutral faces in between, ranked from 0 to 10.

Net Promoter Score (NPS) Illustration depicting various airplanes from different eras, including early biplanes, a Concorde, and modern jet airliners, all set against a background of stylized clouds.

Illustration depicting various airplanes from different eras, including early biplanes, a Concorde, and modern jet airliners, all set against a background of stylized clouds.

Evolution of human flight A collage of five sections with different images and text. From left to right: a vase with flowers and the word MOVIES, a close-up illustration with GO:OD AM, an eye with SWIMMING, a man in sunglasses with ON & ON, and a geometric portrait with CIRCLES.

A collage of five sections with different images and text. From left to right: a vase with flowers and the word MOVIES, a close-up illustration with GO:OD AM, an eye with SWIMMING, a man in sunglasses with ON & ON, and a geometric portrait with CIRCLES.

Mac Miller Tribute

WWDC16

An image of Saturn, showcasing its iconic rings. The planet appears with a smooth, yellowish surface, partially in shadow, against a black background. The rings are clearly visible, casting shadows on the planet.

The Planets Abstract art on a blue background representing UI details and design.

Practical UI details Bayes Theorem illustrated.

Bayes’ Theorem Diagram explaining the CSS empty selector a:empty{}. Shows an a element in green with no children or text, a hand pointing, and a tree diagram with a having two b children. Text notes empty elements lack children or text.

Diagram explaining the CSS empty selector a:empty{}. Shows an a element in green with no children or text, a hand pointing, and a tree diagram with a having two b children. Text notes empty elements lack children or text.

CSS selectors Line art drawing of a man in a hoodie walking alone.

Wondering about social distancing? Abstract art of two lovers on a park bench.

Honest dating advice Cascading style sheets illustration.

Cascading Style Sheets The word 'typography' with annotations showing typographic elements of the font (e.g the 'counter' is the space within the letter O.

The word 'typography' with annotations showing typographic elements of the font (e.g the 'counter' is the space within the letter O.

Fundamentals of Typography An illustration of a pair of dice.

Powerball & Random numbers

Arthur's clenched fist from the children's cartoon Arthur on PBS.

Arthur's Fist Literal radio buttons

Radio buttons A bingo card titled Conference Call Bingo with humorous phrases like Sorry, I was on mute, Child noises, Can you e-mail that to everyone? and Uh, X, youre still sharing! Each square contains a typical virtual meeting mishap.

A bingo card titled Conference Call Bingo with humorous phrases like Sorry, I was on mute, Child noises, Can you e-mail that to everyone? and Uh, X, youre still sharing! Each square contains a typical virtual meeting mishap.

Conference Call Bingo A stick figure person.

Security Tips Optical illusion featuring multiple interlocking grey rings with a darker center. The arrangement creates a visual effect where the rings appear to spin. Above the image are the words Post and Spinning Rings Illusion in black text.

Optical illusion featuring multiple interlocking grey rings with a darker center. The arrangement creates a visual effect where the rings appear to spin. Above the image are the words Post and Spinning Rings Illusion in black text.

Spinning Rings Illusion A checklist titled Dont do these things with music-inspired items. The list includes: chasing waterfalls, forgetting about Dre, tripping, fearing the reaper, and more, with a selected blue car emoji next to Trip.

A checklist titled Dont do these things with music-inspired items. The list includes: chasing waterfalls, forgetting about Dre, tripping, fearing the reaper, and more, with a selected blue car emoji next to Trip.

To-Don't List A humorous phonetic alphabet chart with words like Aisle for A, Knight for K, Pneumonic for M, and Tsunami for T. Each letter humorously uses a word with a silent initial letter.

A humorous phonetic alphabet chart with words like Aisle for A, Knight for K, Pneumonic for M, and Tsunami for T. Each letter humorously uses a word with a silent initial letter.

Phonetic alphabet Hello world Blank page

Blog

I create data visualizations to explain fun things.

Posts

Just for fun