Getting Started With Creative Coding

When art meets programming and generates design

Jun Wu
Jun Wu
Jan 4 · 4 min read
Image for post
Image for post

We all know that programming can be functional. In the business world, we program to solve business problems. In the software world, we program to create a product that can either entertain or help us live better. Can you imagine programming for art? This is exactly what Creative Coding is. It’s the art of creating visualizations for expression.

You generate (2D, 3D, interactive) visualizations by applying algorithms using a programming language. Historically, this is called generative art. But, more and more, with the hype of data science, programmers are venturing into creative coding to bridge the gap between art and programming.

By the way, I find the name “creative coding” to be somewhat misleading. It implies that programmers who engage in creative coding are not programmers. They are coders. This is not true at all. To be a functional “creative coding” artist, you are straddling many disciplines: art, design, programming, and math. Often, you end up creating algorithms for your projects. Not only do you need math fundamentals, but you need artistic sensibilities to apply these algorithms to generate art. People who are truly great at “creative coding” are polymaths. They search for meaning in both the creative universe and the logical universe. They delve deep into the subjects that they work with. They end up becoming great programmers. A lot of their projects are software projects.

Designers who historically used Illustrator and Photoshop are also venturing into creative coding. Here’s an inspirational video of how designers are using creative coding in different types of ways. You will find creative coding designs in large art installations at museums, in concerts, in-store displays, and in trade show displays. Very often, marketers use these types of art displays to inspire customers.

Kids find it easy to use creative coding as a stepping stone to get into programming. Most kids who are in junior high school or elementary school love to draw and paint. Often, these kids are visual learners who can potentially become polymaths. They find it fascinating to use creative coding to explore more logical subjects such as math, biological sciences, architecture, and engineering.

Disclaimer: This article is purely for information purposes. This article does not contain affiliate links.

How to Get Started With Creative Coding

There are a few different ways to get started with creative coding. Creative coding is for programmers who have a creative mind. This programmer might draw, write, design, or take photographs on the side as a hobby. If you are this type of programmer, you might want to consider creative coding as a hobby.

Here’s my five-step method to get started with creative coding.

  • Take a creative coding course.
  • Try out the programming language or the packages available for drawing.
  • Get inspiration from creative coding artists.
  • Create your process of creative coding.
  • Execute your first creative coding project.

List of Creative Coding Courses

You can get started with creative coding by taking any of these courses. Some of them are free. Taking the course is a shortcut that allows you to see the big picture before you venture further to pick a programming language to learn.

Creative Coding for Complete Beginners—free

Creative Coding Course on Skillshare—free

NYU’s Creative Coding e-Learning Course—not free

List of Programming Languages and Packages Available for Creative Coding

Python programmers and JavaScript programmers find it easiest to start Creative Coding. The JavaScript P5.js is what you would use for Creative Coding in JavaScript. The Turtle package can be used for Creative Coding in Python. There’s also a Python Mode of the Processing Programming Language that most Creative Coding artists use for their projects.

Here’s a list of resources:

JavaScript—P5.js and Process.Js

Creative Coding with JavaScript—YouTube video on how to get started.

Coding Train Tutorials P5.js—YouTube video on how to get started.

P5.js Online tutorial

Creative Coding and Data Visualization with P5.js—O’Reilly book.

Generative Design: Visualize, Program, and Create with JavaScript in P5.js—Step-by-Step book.

Processing.js website

Python—Turtle Package, Python Mode of Processing Language.

Turtle Examples from Michael0x2a blog.

Using Python to Make Art With Math

Introduce Beginners to Python Using the Turtle

Python Mode of Processing

Processing Language

The main programming language for creative coding enthusiasts is the Processing Programming Language. tutorials

Open Processing

Processing Foundation

Jose Sanchez Processing Tutorials—YouTube

The Nature of Code E-Book

Algorithms for Visual Design Using Processing Language—Book

Processing: Creative Coding and Generative Art in Processing—Book

Inspirations From Creative Coding Masters

The next step after you’ve gone through a few tutorials is to go through works from the creative coding masters. This process will allow you to see possibilities and be inspired.

Here are some of the artists I admire:

Casey Reas—He writes software to explore emergent systems and his work spans installation, works on paper, and live performance.

Patrick Hubner—He examines how modern technologies reshape and reinvent communication.

8 Creative Coders Who Create Amazing Algorithmic Sketches

Create Your Creative Coding Process

Every artist has a process for generating their artwork. Finding your process is as important as creating the artwork.

Here’s a sample of a creative coding process:

  1. Find an inspiration: a word, a painting, an object, a shape, etc.
  2. Sketch out what you envision your artwork to be.
  3. Visualize interactions—with the environment, with data, with math, etc.
  4. Create the algorithm.
  5. Create your artwork with a programming language you choose.
  6. Go through iterations of editing and exploration to reach your final product.

Final Words

Now that you have your creative coding process established, it’s time to embark on your first creative coding project. This will take you a week or two to explore the iterations of creative coding. It may lead you to new ideas. But it’s a fulfilling adventure.

Better Programming

Advice for programmers.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store