A curated list of beginner-friendly tools, resources and shiny things to get you started with creative coding.
This is primarly material and resources for beginners, if you're a rock-start check out: Graphics resources by @mattdesl and Awesome OpenGL by @eug.
Work in progess, needs better organization
[Coming]
- Generative Art: A Practical Guide - A practical guide using Processing.
- Generative Design - Visualize, Program, and Create with Processing.
- The Nature of Code - Simulating natrual systems with Processing.
- The Book of Shaders - Step-by-step guide through the abstract and complex universe of fragment shaders.
- Programming Design Systems - A practical introduction to the new foundations of graphic design.
- Pixel Shaders - An Interactive Introduction to Graphics Programming.
- Learning Modern 3D Graphics Programming - A series of tutorials on using OpenGL to do graphical rendering.
- Scratchapixel 2.0 - Learn Computer Graphics From Scratch.
- Programming Interactivity - A Designer's Guide to Processing, Arduino, and openFrameworks.
- Algorithms for Visual Design Using the Processing Language - Experiment with design problems to create 3D animations, GUIs, and more.
- Data-driven Graphic Design - Creative Coding for Visual Communication.
- Foundation HTML5 Animation with JavaScript - Everything you need to know to create animation using the HTML5 canvas.
- Playing with chaos - Programming Fractals and Strange Attractors in JavaScript.
- Ray Tracing in One Weekend - Mini book about Ray Tracing.
- r/creativecoding - Sharing and discussing the use of computer programming as a creative discipline.
- r/rraytraycing - Subreddit on raytracing.
- r/opengl - News and discussion about OpenGL on all platforms.
- r/graphicsprogramming - Subreddit on graphics programming.
- r/processing - Subreddit on Processing.
- r/shaders - Subreddit on shaders.
- r/proceduralgeneration - Subreddit on procedural generation.
- realtimevfx.com - Real Time VFX Community.
- creative-dev - Creative Developement Slack.
- The Creative Coding Podcast - Iain and Seb discuss the ins and outs of creative coding.
- Processing- Computer programming language and IDE for visual arts.
- Cinder - Open source library for professional-quality creative coding in C++.
- openFrameworks - Open source C++ toolkit for creative coding.
- vvvv - Hybrid visual/textual live-programming environment for easy prototyping and development.
- NodeBox - Cross-platform, node-based GUI for efficient data visualizations and generative design.
- Structure Synth - Cross-platform application for generating 3D structures by specifying a design grammar.
- three.js - JavaScript 3D library.
- regl - Functional WebGL.
- Stackgl - Open software ecosystem for WebGL, built on top of browserify and npm.
- Paper.js - The swiss army knife of vector graphics scripting.
- Pixi.js - HTML 5 2D rendering engine that uses webGL with canvas fallback.
- p5.js - JavaScript library that starts with the original goal of Processing.
- Fabric.js - Javascript canvas library, SVG-to-canvas parser.
- Sketch.js - Minimal JavaScript creative coding framework.
- Two.js - Two-dimensional drawing api geared towards modern web browsers.
- Coding Rainbow - Daniel Shiffman makes videos about creative coding.
- Shaders - Shader tutorial in the context of lwjgl-basics.
- Create 3D Graphics in JS Using WebGL - Get started creating content with WebGL without any frameworks.
- Learn HTML5 Graphics and Animation - Introduction to the canvas 2D drawing API.
- WebGL 2 Fundamentals - WebGL2 from the ground up. No magic.
- Shaders: A primer - A primer on shaders.
- Shaders: Second stage - 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.
- Ray Marching and Signed Distance Functions - Introduction to ray tracing.
- Introduction to Ray Tracing - A simple method for creating 3D images.
- GLSL lighting walkthrough - Phong shading tutorial with glslify.
- Interactive 3D Graphics - Udacity course that teach you the principles of 3D computer graphics.
- Interactive Computer Graphics - Computer graphics course from Coursera.
- MFGD - Fragment Shaders - YouTube playlist about fragment shaders.
- Shader-school - A workshopper for GLSL shaders and graphics programming.
- Webgl-workshop - The sequel to shader-school: Learn the WebGL API.
- Fragment-oundry - Interactive fragment shader tutorial.
- SDF Tutorial 1: box & balloon - Shadertoy tutorial on raytracing.
- HOWTO: Ray Marching - Shadertoy tutorial on Ray Marching.
- Raymarch Tutorial2 - Shadertoy raymarch tutorial.
- GLSL 2D Tutorials - Shadertoy GLSL 2D Tutorial.
- Shepherding random numbers - Tiny guide to shepherding random numbers.
- FBO particles - Article about FBO/GPGPU particles by @nicoptere.
- Ray marching (with THREE.js) - Article about ray marching with three.js by @nicoptere.
- Visualizing Algorithms - A look at the use of visualization to understand, explain and debug algorithms.
- Math as code - A cheat-sheet for mathematical notation in code form.
- Coding Math - Teaches you the math you need to understand as a programmer.
- Math snippets - Math snippets with graphic programming in mind.
- Formul Animations - The principles of painting with maths.
- Shadertoy - Build and share shaders with the world and get inspired.
- GLSLbin - Fragment shader sandbox with support for glslify.
- GLSL Sandbox - Online shader editor and gallery.
- CodePen - Show case of advanced techniques with editable source code.
- OpenProcessing - Algorithmic Designs Created with Processing, p5js and processingjs.
- Dwitter - Social network for short JavaScript demos.
- Chrome Experiments - Showcase of web experiments written by the creative coding community.
- Codedoodl.es - A showcase of curated creative coding sketches.
- For your Processing - Projects and tutorials about Processing.
- 31 days of Canvas tutorials - Collection of canvas tutorials by Seb Lee-Delisle.
- Art From Code - Code sketches by Keith Peters.
- Generator.x - Flickr group about generative strategies in art & design.
- Generative Art - Flickr group about generative art.
- ml4a - Machine learning for artists.
- Keras.js - Run Keras models (tensorflow backend) in the browser, with GPU support.
- Tesseract.js - Pure Javascript Multilingual OCR.
- Google ML - Cloud machine learning by Google.
- TensorFlow - Open source software library for machine intelligence.
- ConvNetJS - Deep Learning in your browser.
- Wekinator - Allows anyone to use machine learning.
- The Book of Shaders Glossary - Shader glossary by theme.
- GLSL - OpenGL ES shading language reference.
- gltut - 3D programming glossary.
- Smooth minimum - Article about the smooth based primitive union.
- Modeling with distance functions - Collection of distance functions in one centralized place.
- F3 - Powerful 3D design app that enables you to live code 3D form.
- Fragment - Mac app to live code GLSL graphics.
- Chrome Shader Editor - Live editing shaders in the browser.
- ShaderTool - Modern shader IDE for programmers and FX artists.
- Shadershop - Interface for programming GPU shaders.
- There is also canvas - Presentation by Bruno Imbrizi from WebExpo 2016.
- Intro to WebGL - Intro to WebGL with three.js.
- Inigo Quilez Live - Collection of live coding videos by Íñigo Quílez.
- abandonedart.org - Generative art ideas by Matt Pearson.
- iquilezles.org - Home of Íñigo Quílez.
- bit-101.com - Blog by Keith Peters.
- IBreakDownShaders - Explore the math behind shaders.
- Awesome opengl - A curated list of awesome OpenGL libraries, debuggers and resources.
- Graphics resources - A list of graphic programming resources.
- Awesome canvas - A curated list of awesome HTML5 canvas with examples, related articles and posts.
- Awesome audio visualization - A curated list about Audio Visualization.
- Awesome computer vision - A curated list of awesome computer vision resources.
- Magic Tools - A list of game development resources to make magic happen.
- Hanecci’s link collection - Link collection of ray marching on the GPU.
To the extent possible under law, Terkel Gjervig has waived all copyright and related or neighboring rights to this work.