Accessible Web visuals and code with p5.js

Posted to Coding  |  Tags: ,  |  Nathan Yau

Visualization on the Web can be tricky for those unfamiliar with code. The new JavaScript library p5.js, developed by Lauren McCarthy and collaborators, aims to make your first steps easier and less painful.

Using the original metaphor of a software sketchbook, p5.js has a full set of drawing functionality. However, you’re not limited to your drawing canvas, you can think of your whole browser page as your sketch! For this, p5.js has addon libraries that make it easy to interact with other HTML5 objects, including text, input, video, webcam, and sound.

The library follows some of the same philosophy as Processing — that is, straightforward to get up and running — and reimagines the implementation and approach for recent web technology. Even if you’re not into programming, it’s worth visiting if just to watch, listen, and interact with Dan Shiffman as he enthusiastically talks about the library.

Favorites

A Day in the Life of Americans

I wanted to see how daily patterns emerge at the individual level and how a person’s entire day plays out. So I simulated 1,000 of them.

Years You Have Left to Live, Probably

The individual data points of life are much less predictable than the average. Here’s a simulation that shows you how much time is left on the clock.

19 Maps That Will Blow Your Mind and Change the Way You See the World. Top All-time. You Won’t Believe Your Eyes. Watch.

Many lists of maps promise to change the way you see the world, but this one actually does.

Famous Movie Quotes as Charts

In celebration of their 100-year anniversary, the American Film Institute selected the 100 most memorable quotes from American cinema, and …