Pick a song, create a visual style, and code how it responds. In this hands-on workshop, you’ll turn music into data, build your own visuals, and customize a music visualizer with HTML so it reacts to your playlist.
Turn a song you love into something you can see, shape, and code.
In this hands-on workshop, you’ll explore how sound can become data, and how that data can drive visuals. You’ll create a playlist, design a GIF that captures its mood, and use HTML to customize a music visualizer that responds to what you hear.
You’ll experiment with how the visualizer reacts to different sounds, make creative design choices, and see how engineering and design can work together in one interactive project. At the end, you’ll share your creation with the group as your playlist plays through the visualizer you built.
Led by PhilaCon Valley. No coding experience needed.
• How sound works as data, and how that data can drive something you see
• How to tune a real system's behavior by changing what it responds to
• How to design a visual that matches the feel of a piece of music
• How to use HTML to change the way your visualizer looks
• What it looks like when engineering and design are two halves of the same build
• Students in middle school (6th - 8th grade) and high school (9th - 12th grade) in the Philadelphia area.
• This workshop is for beginners, newbies & amateurs in the field of tech and entrepreneurship.
In fall 2026, Coded by: is offering two different sessions of the Your Playlist, Brought to Life workshop - one for middle school and one for high school students. Registration is NOW OPEN.
Middle School (6th - 8th Grade)
• Date: Saturday, November 7th
• Time: 1:00 pm - 3:00 pm
High School (9th - 12th Grade)
• Date: Saturday, December 5th
• Time: 1:00 pm - 3:00 pm
Check out the full calendar of Coded by: programs here.
Coded by: Offices
CIC Philadelphia in University City
3675 Market St, Suite 200
Philadelphia, PA 19104
Who can sign up for the program?
The program is open to middle and high school students in the Philadelphia area.
Do you need previous experience to register?
No, this is a workshop perfect for beginners.
Is there a cost for enrollment?
No, Coded by: programs are free for all participants.
Do you host this course at partner sites?
Yes, please email programs@codedbykids.com if you are interested in hosting Coded by: program.
Coded by Kids runs free programs and competitions throughout the year. Don't miss the opportunity to grow and showcase your tech skills.
