Intro to GPU Accelerated Graphics with GLSL Shaders

In this more advanced video, we introduce GPU accelerated graphics with GLSL shaders.

* demonstrate the dramatic difference GPU acceleration can make
* introduce OpenGL and GLSL concepts - the pipelines, vertex and fragment shaders
* built and explain simple GLSL programs

The runnable code for this tutorial is online:
You can make your own copy and continue editing it yourself:

---

Chapters:

00:00:00 Intro
00:02:48 Javascript Performance Test
00:06:10 OpenGL Concepts
00:17:30 Simple Colour
00:31:08 Passing Pointer Data
00:46:01 Passing Array Data To Visualise Forces
01:04:35 Shapes From Pixel Locations - Yellow Atoms
01:11:42 Animating Moving Objects and Forces

---

[SwapperTheFirst]

Satie as a background music - the next level, hats off.

[yanyu]

I have never been in contact with Shaders before, this is the only video I understand so far about Shaders, I absolutely love it! Hope to hear more about it!

[kkaa]

Incredible video, one of the most useful introductory videos I have ever seen. Please keep on creating, I'll be eager to watch your work!

[samueleb.]

There's not really so much information about shaders and particurarly about GLSL. Please, keep doing videos about this argument, the video is so well made and you could give a great contribute to the community. Thanks a lot, regardless.

[nztuber]

Nice!
8m16s: that's the*cpu* approach.

[enocrodriguez]

hi, how to set image whit p5 to shader?

[albertaillet]

I seems the code is not working anymore, I have tried to remove everything except the code that runs the full red shader, maybe the p5.js import are broken?

[djneils]

love the content and ambition of this video but crikey lose that background music!

[michaelkohlhaas]

Could be great if it weren't for this stupid background music.