awesome-creative-coding

Practical guide using Processing

Visualize, Program, and Create with Processing

Simulating natural systems with Processing

Practical introduction to the new foundations of graphic design

Series of tutorials on using OpenGL to do graphical rendering

Designer's Guide to Processing, Arduino, and openFrameworks

openFrameworks beginner Guide for programmer, visual artist, or designer

Advanced in depth guide to openFrameworks

Experiment with design problems to create 3D animations, GUIs, and more

Everything you need to know to create animation using the HTML5 canvas

Programming Fractals and Strange Attractors in JavaScript

Mini book about Ray Tracing

Guides you to explore the Processing environment using practical and useful recipes

Creative Coding for Visual Communication

Learn how to use modern techniques to generate synthetic three-dimensional images in a fraction of a second

Introduction to shader programming in general, but focusing on the GLSL shading language

Practical guide to starting 3d programming with OpenGL

Teaches JavaScript programmers how to incorporate real physics into their HTML5 games, animations, and simulations

Book teaches you to solve mathematical problems in code

Book in french, which covers OpenGL, OpenGL ES and WebGL

Explore the role of deep learning in music generation and assisted music composition

Step-by-step guide through the abstract and complex universe of fragment shaders

WebGL from the ground up. No magic

WebGL2 from the ground up. No magic

Extensive tutorial resource for learning Modern OpenGL

Learn Computer Graphics From Scratch

Community-written book/guide on openFrameworks

Collection of modern OpenGL tutorials by Etay Meiri

Site dedicated to tutorials for OpenGL 3.3 and later

Guide that teach you the basics of using OpenGL

Interactive Introduction to Graphics Programming

Free OpenGL programming tutorial in online book format

Book about 3D computational graphics by Morgan McGuire

Notes about generating various organic patterns, with examples and Python code, by Anders Hoff

A raytracing and rasterization textbook that teaches you how OpenGL and DirectX works

A free book for when you really need to know how to do Bézier things

Step-by-step guide to real-time shading techniques

Step-by-step guide to WebGL

An authorial set of fundamental Python recipes on Creative Coding and Computer Art, by Diego Inácio

Learn WebGL and 3D algorithmic in a progressive and interactive way

Get started creating content with WebGL without any frameworks

Introduction to the canvas 2D drawing API

Udacity course that teach you the principles of 3D computer graphics

Computer graphics course from Coursera

Selection of Kadenze courses covering p5.js, TensorFlow, Max/Jitter, and ChucK

Coursera course on creative coding with processing

Learn how to create gorgeous interactive graphics

Use computer programming as a creative discipline to generate sounds, images, animations and more

Use JavaScript and the ProcessingJS library to create drawings and animations

Combine JS, ProcessingJS, and mathematical concepts to simulate nature in your programs

Learn how to read, map, and illustrate data with Processing

Join information designer Nicholas Felton in the world of Processing

Join Nicholas Felton for a smart, comprehensive, and inspiring intro to data visualization

, , - Learn generative art and Processing with art with Joshua Davis

Workshop by Matt DesLauriers. that teaches you about generative art, interactive animations, 3D graphics, and shaders

Workshop by Matt DesLauriers that go deeper into graphics programming, math and shaders

This course by Bruno Simon will teach you the secrets to create the coolest WebGL websites with Three.js whether your are a beginner or an advanced developer

Learn all the theory and the math behind 3D graphics while creating a software renderer from scratch using the C programming language

[Cross-platform] - Computer programming language and IDE for visual arts

[Cross-platform] - A library that integrates Processing into the Python 3 ecosystem

[Cross-platform] - Open source library for professional-quality creative coding in C++

[Cross-platform] - Open source C++ toolkit for creative coding

[iOS] - Open-source creative coding framework for iOS

[Mac, Win] - Game engine, but useful for creative coding and installations

[Cross-platform] - Open source game engine, that can also be used for all sorts of things

[Cross-platform] - Open source, realtime collaborative WebGL engine

[Cross-platform] - GLSL library for building signed distance functions

[Cross-platform] - Open-source creative coding framework for the Rust language

[Cross-platform] - Open source collection of computational design tools for JavaScript, TypeScript, Clojure and ClojureScript languages

PixelKit

[iOS, Mac] - Open source, live graphics, Swift framework, powered by Metal

[Cross-platform] - Open source library for creative coding written in Kotlin

[Cross-platform] - HTML5 framework for building games, uses both a Canvas and WebGL renderer

Canvas-sketch

[Cross-platform] - HTML5 framework for making generative artwork in JavaScript and the browser

AsyncGraphics

[iOS, macOS] - Open source, live graphics, async / await, Swift package, powered by Metal

Lygia

[Cross-platform] - Granular and multi-language (GLSL, HLSL, WGSL, MSL and CUDA) shader library designed for performance and flexibility

Fragment.tools

[Cross-platform] - A web development environment for creative coding

[Win] - Hybrid visual/textual live-programming environment for easy prototyping and development

[Mac, Win] - Cross-platform, node-based GUI for efficient data visualizations and generative design

[Mac, Win] - Visual development platform to create realtime projects

[Mac] - Development tool for processing and rendering graphical data

[Mac] - Live interactive-media programming environment

[Mac, Win] - Visual programming language for media

[Cross-platform] - Open source visual programming language for multimedia

[Cross-platform] - Interactive, intermedia audio-visual sequencer

[Win] - Open source tool for creating interactive 3d content and animations

[Cross-platform] - Open source visual programming language and environment for microcontroller-based projects

[Cross-platform] - Scene based media control software with integrated projection mapper

[Cross-platform/Web] - Your model kit for creating beautiful interactive content. Currently in private beta, invites can be requested

eternal

[Web] - Programs as graphs and graphs as compositional tools for creation

[Win] - Node-based authoring tool with a strong focus on real-time graphics. Currently in beta

Realtime visual coding tool, easy to understand and aimed at beginners

[iPhone, iPad, Mac] - Live graphics node editor, powered by AsyncGraphics

Make pixel art style games and art on a 240*136 pixel screen

[Multi-platform] - Platform for audio synthesis and algorithmic composition

Strongly-timed, concurrent, and on-the-fly music programming language

Domain specific language for live coding of pattern

The live coding music synth for everyone

A sound and music computing system

Live coding environment to quickly create procedural sequencers

A small procedural programming language for writing songs in browser

An open source audio environment designed to explore new musical ideas from synthesis and instrument building to live-coding

A MIDI producing environment for creating (live) music

Graph-oriented live coding language and music/audio DSP library written in Rust

three.js

JavaScript 3D library

regl

Functional WebGL

Open software ecosystem for WebGL, built on top of browserify and npm

The swiss army knife of vector graphics scripting

HTML 5 2D rendering engine that uses webGL with canvas fallback

JavaScript library that starts with the original goal of Processing

JavaScript library for visualization and creative-coding

Javascript canvas library, SVG-to-canvas parser

Parametric line drawing for SVG, CNC & laser cutters

Programmatic 3D modeling in JavaScript

Minimal JavaScript creative coding framework

Two-dimensional drawing api geared towards modern web browsers

WebGL graphic library for building scalable Web3D applications

Proton

A lightweight and powerful javascript particle engine

lightgl.js

A lightweight WebGL library

picogl.js

A minimal WebGL 2 rendering library

Alfrid

A WebGL tool set

Babylon.js

complete JavaScript framework for building 3D games with HTML 5 and WebGL

twigl

A Tiny WebGL helper Library

luma.gl

WebGL2 Components for Data Visualization

A web component for drawing patterns with CSS

OGL.js

JavaScript 3D library (WebGL)

A pseudo-3D engine for canvas & SVG

Oimo.js

Lightweight 3d physics engine for javascript

Ammo.js

Direct port of the Bullet physics engine to JavaScript using Emscripten

Theatre.js

Motion design library with visual tools

A lightweight open-source JavaScript library for graphics and animations (SVG/VML)

[Mac] - Video mapping projections and Light mapping

[Mac] - Realtime multimedia performance application

[Mac] - Real time video mixing and compositing

[Mac, Win] - Mixing of digital video and effects in a realtime

[Mac] - VJ software designed for realtime HD video mixing and compositing with a modular user interface

VirtualMapper

Realtime preview tool for projection mapping

[Mac] - A software to create and perform interactive audiovisual shows

[Win] - A real-time 2D/3D creation, compositing and video-mapping engine

[Linux] - A live performance tool featuring simple non-linear editing and mixing from multiple sources (files, devices, streams...)

Build and share shaders with the world and get inspired

A JavaScript library for creating interactive procedural 2D and 3D shaders

Online shader editor and gallery

Online shader editor

Show case of advanced techniques with editable source code

Interface for programming GPU shaders

Online shader editor and gallery

Online shader editor

Simple WebGL Fragment Shader Editor

Create and experiment with algorithmic design, Processing and P5.js

Online web editor for P5.js

Run-as-you-type tool for VJs, musicians, teachers, students, kids

Minimalistic API and online showcase for generative code. (Javascript)

Open source home for art made with code (WebGL1/2, JavaScript Canvas & P5.js)

p5.js live-coding environment

Digital art platform for creative coders (Fragment Shader, Javascript Canvas)

Learn programming by issuing instructions to a turtle

The most minimalist creative coding environment is alive

Run your tweet on an 8-bit computer emulator

Live code-able video synth and coding environment

Open source microcontroller kits for building digital devices and interactive objects

Small single-board computers

Open source JavaScript microcontroller you can program wirelessly

Low-power open source single-board computers

Turn everyday objects into touchpads and combine them with the internet

Sensor device that supports hand and finger motions as input

Simple, modern, and precise pen plotter

Sensors, input devices and controllers for computers

USB-based microcontroller development system

AR projection mapping with built-in depth sensor

[Cross-platform] - Application for generating 3D structures by specifying a design grammar

[Mac] - Powerful 3D design app that enables you to live code 3D form

Fragment

[Mac]- App to live code GLSL graphics

[Win] - Modern shader IDE for programmers and FX artists

[Mac] - Allows applications to share frames with one another in realtime

Real-time GPU shader editor, live-code performance tool and graphics prototyping sketchpad

GLSL shaders for use in interactive applications

Live-coding console tool that renders GLSL Shaders

[Cross-platform] - Shoebot is a creative coding environment designed for making vector graphics and animations with Python

[Mac] - Education oriented 2d graphics programming environment based on Python

Klak

A collection of scripts for creative coding with Unity

Scripting (JS) in InDesign for designers and artists in the spirit of Processing

Konstrukt

[Cross-platform] - A commandline tool to generate different scaleable patterns as SVGs

Daniel Shiffman makes videos about creative coding

YouTube playlist about fragment shaders

YouTube channel about shaders

YouTube channel about shaders case studies

YouTube series to learning openFrameworks

YouTube playlist about openFrameworks - not updated [2015]

YouTube playlist about Shaders, using Visual Studio Code

YouTube playlist about the Kha framework, built in Haxe

YouTube playlist about WebGL 2.0

YouTube playlist about modern OpenGL

YouTube playlist about vertex shaders

YouTube playlist diving into three.js

YouTube playlist teaching you how to make shaders, starting with zero knowledge using shadertoy

Introduction to WebGL lightning with Greg Tatum

Intro to WebGL with three.js

Collection of live coding videos by Íñigo Quílez

Bruno Imbrizi go through the use of canvas for creative coding at WebExpo 2016. Interactive slides

Beginners tutorial series about creating 3D games OpenG

Talk on how tech-based artists do this financially

How I Learnt to Stop Worrying and Love Linear Algebra

Talk about WebGL, GPUs and Math by Steven Wittens

Inspiring talk by Zach Lieberman

FITC talk by Matt DesLauriers about his passion for generative art

Part 1 of an introduction to shaders using threejs

Introduction to three.js from a creative coder perspective

lwjgl: Shaders

Shader tutorial in the context of lwjgl-basics

A primer on shaders

The second part to the previous

WebGL Lessons — Fragment Shaders

A brief introduction to fragment shaders

WebGL Lessons — ThreeJS Shaders

Using custom vertex and fragment shaders in ThreeJS

ThreeJS post-proces example

example of post-processing effects in ThreeJS

Introduction to ray tracing

A simple method for creating 3D images

GLSL lighting walkthrough

Phong shading tutorial with glslify

Three glslify example

Example on how to use three.js with glslify

WebGL Beyond Dom

Greg Tatum explain the basic of WebGL using Regl

Article about FBO/GPGPU particles by @nicoptere

Article about ray marching with three.js by @nicoptere

Introduction to custom shaders, uniforms, textures and lighting in three.js

First part of an introduction to modern OpenGL

Modern OpenGL Series

Good introduction to some of the OpenGL terms

Article about the smooth based primitive union

Collection of distance functions in one centralized place

Explains how to create complex 3D shapes inside volumetric shaders

Book, blog and collection of resources regarding real-time rendering

Short and sweet introduction to OpenGL shaders by Anton Gerdelan

The title says it all. Introduction by Adok

Really good introduction to how basic software rendering works

Website with a really good collection of WebGL tutorials

, , - Beginner introduction on how to create geometry object

Series of tutorials about WebGL, Three.js, and Three.bas

Brief overview over the different coordinate systems through out the 3D graphics pipeline

Short and sweet online introduction to WebGL

Fluffy predator with three.js and instanced geometry

How to create a particle effects with billboarding and WebGL

How to create GPGPU particles with regl

Introduction to the concepts behind real time directional light shadow mapping

A tutorial and a list of useful resources to use WebGL raymarching and distance functions easily

Introduction to different bump mapping techniques

Deck on OpenGL/GLSL shader programing

Perlin noise flow field tutorial

Introduction to flow fields also known as vector fields

Introduction to flow fields also known as vector fields

Introduction to 3D graphics programming including shaders, math post-processing etc. from Newcastle University

Introduction to Three.js by Eric Haines

Slides from the SIGGRAPH 2017 WebGL workshop

Advice and thoughts on how to get started by Eric Arnebäck

Deep dive into the importance of gamma

Profound introduction to the canvas API

Collection of canvas tutorials by Seb Lee-Delisle

, - How to use the AxiDraw pen plotter with JavaScript

In-depth blog post about noise as an indispensable tool for creative coding

In depth tutorials on math, algorithms and Unity

Learn creative coding writing simple programs

Introduction to C4 published on Creative Applications

An end-to-end tutorial on the design, programming and launch of an app using C4

Particle physics explained

Looks at the use of visualization to understand, explain and debug algorithms

Easy to understand collection of articles on game development, but relevant to creative coding as well

Collection of resources on stuff like path-finding, Ai, math etc

Tips to make your art look better

Tips on how to get color right

Shader-school

Workshop for GLSL shaders and graphics programming

Webgl-workshop

The sequel to shader-school: Learn the WebGL API

Interactive fragment shader tutorial

Shadertoy tutorial on raytracing

Shadertoy tutorial on Ray Marching

Shadertoy raymarch tutorial

Shadertoy GLSL 2D Tutorial

Shader breakdown by Perlin

Interactive Shader-Toy on writing a ray marcher

Interactive Shader-Toy raymarching tutorial

OpenGL ES shading language reference

Shader glossary by theme

, , , , , , , - OpenGL 3D programming glossary

Quick and visual canvas cheatsheet

WebGL 1.0 API reference card

Glossary of terms relating computer graphics

OpenGL Shading Language quick reference guide

Math cheatsheet by Anton Gerdelan, from his OpenGL book

Improvement of the official OpenGL documentation

Khronos Group GLSL wiki

PDF Reference Card for the OpenGL 4.3 API

Interactive easing functions cheatsheet

GLSL library on the back of tarot cards, for learning and reference

Collection of procedural patterns and procedural noises

Visualize noise algorithms in 1D and 2D

Simple trigonometry visualisation

Morphogenesis

Exploration of how shapes, forms, and patterns emerge in nature

Sharing and discussing the use of computer programming as a creative discipline

Subreddit on raytracing

News and discussion about OpenGL on all platforms

Subreddit on graphics programming

Subreddit on Processing

Subreddit on shaders

Subreddit on procedural generation

Subreddit on machine learning

Subreddit on generative art and music

Creative Coding Club Slack

Iain and Seb discuss the ins and outs of creative coding

Real Time VFX Community

Podcast on data visualization

Great collection of shader and math related resources

A community of front-end developers who build collaborative creative coding projects on CodePen

A weekly newsletter of resources around creative technology

Math as code

Cheat-sheet for mathematical notation in code form

Teaches you the math you need to understand as a programmer

Math snippets

Math snippets with graphic programming in mind

The principles of painting with maths

Learning Maths again

Collection of JS and GLSL math snippets

Eases

Grab-bag of modular easing equations

Visualization of different motion equations

Matrix multiplication visualized

The most useful rules of basic algebra

Fully interactive linear algebra

Interactive and visual introduction to image kernels

Interactive explanation of sine and cosine

Perlin noise explained in detail

Tutorial on vector algebra and matrix algebra from the viewpoint of computer graphics

Graph functions, plot data, evaluate equations, explore transformations, and much more

Math for game developers YouTube playlist

Essence of linear algebra YouTube playlist

Slides about the mathematics of animation ( )

Beautiful and visual introduction to math and quasi physics

introduction to 2D and 3D perlin noise

High level introduction to matrices

List of all mathematical symbols and signs

Interactive tool to better understand transformation matrices

JavaScript math snippets for movement

Maths cheat-sheet for 2D and 3D game-makers

Introduction to matrices by Greg Tatum

Talk by Steven Wittens about bezier curves, procedural generation, physics engines and fractals

Interactive real-time physics simulations, with formulas and code

Explanations of fields like Linear Algebra and Geometry designed to help you develop a visual intuition for what is going on

L-systems

A Haskell package for L-systems

Introduction to linear interpolation (also known as mix/lerp)

In-depth article on vectors for game math

Tiny guide to shepherding random numbers

Tiny guide to shepherding random grids

Tiny guide to shepherding random growth

Machine learning for artists

Run Keras models (tensorflow backend) in the browser, with GPU support

Pure Javascript Multilingual OCR

Cloud machine learning by Google

Open source software library for machine intelligence

Deep Learning in your browser

Allows anyone to use machine learning

Machine Learning

Coding Train repo with links to machine learning resources

Space to share creative Ai projects

Ai microsite intended to help newcomers get started

Teachable Machine

Explore how machine learning works, live in the browser

JavaScript library for training and deploying ML models in the browser and on Node.js

Fully commented TensorFlow.js demo

Friendly machine learning for the web

Discover open source deep learning code and pretrained models

Toolkit that adds artificial intelligence capabilities to design and creative platforms

Build, train, and ship custom deep learning models using a simple visual interface

Platform for discovering, sharing, and discussing easy to use and pre-trained machine learning models

Algorithmic Designs Created with Processing, p5js and processingjs

Social network for short JavaScript demos

Showcase of web experiments written by the creative coding community

Showcase of curated creative coding sketches

Projects and tutorials about Processing

Code sketches by Keith Peters

Flickr group about generative strategies in art & design

Flickr group about generative art

Open source micro blog about inspiring and creative works published online

People You Should Follow on CodePen

List of interesting people worth following

Tumblr by visual artist Raven Kwok

Really good collection of experiments in Processing

Tumblr with visual inspiration

Tumblr with gifs by Dave

Celebration of art made with code by artists that push the possibilities of creativity

Tumblr with curves, surfaces, scalar and vector fields

Digital design festival ( )

Creative coding, art and technology festival

Showcase of light art and emerging technologies in Prague, the Czech Republic

Bring together creative coders, data designers and creators working at the intersection of data, art and technology

Organization dedicated to digital creativity in sound, music, and audio-visual art

An open platform for the exchange on culture, arts and technology

3 day event offering conferences, workshops, digital showcases & installations

Projects and nonprofit events, to inspire through experience

Inspiring people through creative uses of tech

ZKM organizes exhibitions and events on the effects of media, digitization, and globalization

Museum of the Future — a place where diverse blends of artistic genres, scientific domains and technological directions are displayed and processed

Technorama allows hands-on experiences of hundreds of natural phenomena and technology

Contemporary art gallery presenting works by international established, mid-career, and emerging artists focusing on photography and new technologies

Digital Art Museum is an resource for the history and practice of digital fine art

The first museum in the Netherlands dedicated to new media art

Graduate program in London which develops your arts practice through the expressive world of creative computation

school in London working at the intersection of creativity and computational technologies

School in New York that explore the intersections of code, design, hardware and theory

Hosts a range of educational initiatives, most notably, the Interaction Design Programme and the CIID Summer School

Huge list of residencies, fellowships and summer schools around the world (Navigate with the bottom left tabs)

Famous digital art blog

Home of Íñigo Quílez, specialised in GLSL and math snippets

Blog by Keith Peters, specialised in creative coding

Explore the math behind shaders

Blog of software engineer Adrian Courrèges. Articles about game graphics studies etc

Home of Jaume Sanchez Elias, with demos, talks, articles on WebGL and WebVR

Blog about generative art and systems, by Mikael Hvidtfeldt Christensen

WebGL experiments and articles by Evan Wallace

Home of Song Ho Ahn, with a good collection of tutorials on OpenGL and math

Game art tricks, design tricks by Simon schreibt

Blog about generative art algorithms and techniques, by Manohar Vanga

jsdo.it-archives

Compilation of WebGL experiments including comparisons on WebGL frameworks and physics engine (oimo.js, cannon.js, ammo.js)

Newsletter to know everything about the WebAudio API

Awesome opengl

Curated list of awesome OpenGL libraries, debuggers and resources

Awesome webgl

Curated list of awesome WebGL libraries, resources and much more

Awesome canvas

Curated list of awesome HTML5 canvas with examples, related articles and posts

Awesome audio visualization

Curated list about Audio Visualization

Awesome computer vision

Curated list of awesome computer vision resources

Awesome visualization research

Curated list of recommended research papers and other readings on data visualization

Awesome livecoding

Curated list of livecoding languages and tools

Awesome graphics

Curated list of computer graphics tutorials and resources

Graphics resources

Curated list of graphic programming resources

Magic tools

Curated list of game development resources to make magic happen

Link collection of ray marching on the GPU

Awesome public datasets

Curated list of public available datasets, mostly free resources

Curated list from 2013

3D Machine Learning

A resource repository for 3D machine learning

Awesome creative technology

Curated list of Creative Technology groups, companies, studios, collectives and more