This is a submission for the DEV WeCoded 2026 Challenge: Frontend Art
What I Built
An interactive glass-shattering visualization that lets you literally break the glass ceiling. Click the glass — watch it crack, splinter, and fall away with realistic physics. Behind each shattered piece, a pioneer is revealed.
Six women who built the foundations of modern tech:
- 👩💻 Ada Lovelace — First Computer Programmer (1843)
- ⚓ Grace Hopper — Invented the First Compiler (1952)
- 🚀 Katherine Johnson — NASA's Hidden Figure (1962)
- 💻 Margaret Hamilton — Apollo Software Engineering (1969)
- 🌐 Radia Perlman — Mother of the Internet (1985)
- 📱 Megan Smith — Former U.S. CTO & VP at Google (2014)
Demo
🔗 Try it live → Breaking the Glass Ceiling
How I Built It
- HTML5 Canvas — Glass grid with Voronoi-style shard generation and irregular triangulation
- Physics Engine — Custom gravity, velocity, and rotation for each falling shard
- Web Audio API — Procedurally generated crack sound effects in real-time
- Particle System — Sparkle effects with decay and gravity
- CSS Animations — Pioneer card reveals and staggered final message sequence
Zero dependencies. Pure vanilla JavaScript, CSS, and HTML.
The Message
The ceiling was never real. The talent always was.
27% of the computing workforce is women. 5% of tech startup founders are women. But the potential when barriers are removed? Infinite.
Top comments (0)