What Is Creative Coding?

By Tynker July 22, 2022

[{"selector":"#anim-32418569-1770-42a8-b793-04e19bc9888f","keyframes":{"opacity":[0,1]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-834d6e8f-422e-47d0-9176-60f8277c5156","keyframes":{"transform":["translate3d(115.18987%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Creative coding is where computer science meets the visual arts. It's a great way to bring coding to life for kids and other first-timers, too.

What Do You Need to Know?

[{"selector":"#anim-710aeff9-6bac-4fd6-93e8-cd59582376fc","keyframes":{"opacity":[0,1]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-da85dc6c-0949-4d03-8e72-09d06f58c392","keyframes":{"transform":["translate3d(119.88635%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Creative coders explore ideas like geometry and coordinates and how computers represent color.

What Languages Can You Use?

[{"selector":"#anim-2894dc7f-e754-4881-a729-8a458a8714ab","keyframes":{"opacity":[0,1]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-e85129f3-b591-4245-a33f-bbb989be43b6","keyframes":{"transform":["translate3d(114.87342%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Processing kicked off the modern era of creative coding. Many Processing variants are available: • p5.js for JavaScript coders • Processing.py for Python coders But nearly any programming language can be used, including block code. There are no rules!

Image Processing

[{"selector":"#anim-8afd0d6d-7ff8-42e7-8684-f02368df2899","keyframes":{"opacity":[0,1]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b4dafcdd-ccb4-408e-83de-a665ba2d190e","keyframes":{"transform":["translate3d(-96.83545%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Creative coders can invent their own amazing Snapchat-style filters, too. Put a cool artistic spin on your favorite photos.

A Rich History

[{"selector":"#anim-3249f1f5-6e13-41a8-955f-d618f3579235","keyframes":{"opacity":[0,1]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-d59afcab-f045-4626-b86b-707407951e51","keyframes":{"transform":["translate3d(115.18987%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Creative coding isn't anything new — it has been around since the beginning of computing. This "demo" was coded on a Commodore Amiga.

Music and Code

[{"selector":"#anim-91fe4610-e464-40e7-8886-768f556c5d6e","keyframes":{"opacity":[0,1]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-3b574e93-f129-4de8-b469-ba6f509d689b","keyframes":{"transform":["translate3d(-115.18988%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2500,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Credit: Sam Aaron / Sonic Pi Projects like Sonic Pi and Earsketch allow you to write code to compose music, in real time!

Music and Code

[{"selector":"#anim-3dc60e24-7698-4e36-a363-a4478aa40776","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-490c7101-1928-435c-b1f8-fa7fe2554beb","keyframes":{"transform":["translate3d(-84.23493%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Younger learners can code music with Tynker's simple Sound and Synth blocks, too.

Looking to try your hand at creating digital artwork? Read on.

Or take some inspiration from Open Processing , a community of creative coders!

Next Steps

Want to make your very own masterpiece? Check out Tynker's p5.js course! Learn more