6.7 KiB
6.7 KiB
Awesome Creative Coding
A curated list of beginner friendly tutorials, tools, resources and shiny things to get you started.
Work in progess, needs better organization
Table of Contents
[Coming when I have a final strucure]
Books
- 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.
Subreddits
- 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.
Communities
- realtimevfx.com - Real Time VFX Community.
- creative-dev - Creative Developement Slack.
Frameworks
- 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.
Tools
- Shadertoy - Build and share shaders with the world and get inspired.
- 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.
Libs / Ecosystems
- Stackgl - Open software ecosystem for WebGL, built on top of browserify and npm.
- three.js - JavaScript 3D library.
- regl - Functional WebGL.
Learning material
- Coding Rainbow -
- Shaders - Shader tutorial in the context of lwjgl-basics.
- 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.
Interactive tutorials
- 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.
Articles
- Shepherding random numbers - Tiny guide to shepherding random numbers-
- -
Math
- Math as code - A cheat-sheet for mathematical notation in code form
- Coding Math - Video tutorials designed to teach you the math you need to understand as a programmer. – Math snippets - Math snippets with graphic programming in mind.
- Formul Animations - https://www.youtube.com/watch?v=0ifChJ0nJfM - The principles of painting with maths.
Shader References
- The Book of Shaders Glossary - Shader glossary by theme.
- GLSL - OpenGL ES shading language reference.
- gltut - 3D programming glossary.
Related:
- Awesome-canvas - Awesome list for Canvas
Websites / Blogs
- abandonedart.org - Generative art ideas by Matt Pearson
- iquilezles.org - Home of Íñigo Quílez.