eyes

My animations to date have been written entirely with p5. I've dabbled with d3 and SVG, but haven't invested much time. With increased interest in visualizations at work, I've decided to dig into both technologies, starting with SVG.

no masking

Here's a first version using SVG's circles, and a React-wrapped svg element that updates when the mouse moves. I changed the cursor to a honey bee with CSS.

This was pretty straightforward, and perhaps about as verbose as p5. I decided to see what it would look like if the colored part of the eye could be partially obscured. SVG allows for creating a mask, so…

with masking

Masking with SVG was decidedly simpler than p5.