Learn Shaders Through Livecoding
In this workshop, you will learn how to livecode shaders by creating a visual composition with GPU code and a little bit of math. Livecoding is a method of programming in which one’s changes to the code are realized immediately and in real-time. This is an ideal way to create music visualizers, or any interactive abstract graphics of the sort. We will briefly go over how to use the shaders we create in a variety of other real-time engines like Unity, p5.js & touch designer.
You will learn about where the shader exists in the graphics pipeline, the basics of how the language works, and how to quickly iterate on writing your shader using livecoding tools. You will also be given a plethora of tools to build upon what you learn, so you can keep learning and practicing beyond this workshop.
Course Logistics
Dates:
Thursday, March 10, 2022
Times:
11:00AM-2:00pm PST
Cost:
$80 for a 3h workshop
We also offer Diversity Scholarships. Apply here.
Experience Level:
Intermediate
Requirements:
Bring a PC/Mac Laptop and charger.
Make sure your browser can run this page, you should see text on a colorful background: https://www.shader.place/present.html?room=
If not, first switch to a browser that can support webGL: https://caniuse.com/#feat=webgl
Then, follow instructions here to enable webGL for your browser:
https://superuser.com/questions/836832/how-can-i-enable-webgl-in-my-browser
Workshop Outline
- Introduction to the graphics pipeline, concepts, and context.
- Guided hands on creation in GLSL, application of concepts. This includes converting coordinate system to transform space, using basic trig functions to create shapes, and color palette functions to have more control over the look of your shader.
- We break off into smaller groups and explore the code.
- Show and tell your shader creation(s)!
- Q+A.
- Go over templates provided for Unity, Touch Designer and p5.
- Exploring next steps, including introduction to online shader communities and tips for exporting and sharing your creation online!
Educational & Experiential Goals
You will learn about where the shader exists in the graphics pipeline, the basics of how the language works, and how to quickly iterate on writing your shader using livecoding tools. You will also be given a plethora of tools to build upon what you learn, so you can keep learning and practicing beyond this workshop.
About Technologies
In this workshop you will be introduced to GLSL, GLSL is the OpenGL Shading Language, a C-like programming language that allows you to code powerful graphics programs directly on your computer’s graphics card.
