SuperHi – Shaders for the Web

Learn how to make OpenGL shaders using the programming language GLSL, and gain insight on how the top websites use hardware-enabled graphics

Get to know one of the most cutting-edge parts of the web right now: OpenGL shaders. The top websites are using them in their web designs but most sites aren’t due to the lack of understanding about how to use them.

In this course, we’ll show you how to make shaders from scratch using the programming language, GLSL, along with everything you need to know about uniforms, vertex and fragments, and then how to apply them to both 2D and 3D projects on the web.

MP4 | Video: h264, 1920×1080 | Audio: AAC, 44.1 KHz, 2 Ch
Genre: eLearning | Language: English | Duration: 168 Lessons (16h 3m) | Size: 6.2 GB

What you’ll learn

What a shader is exactly and how to write GLSL code

What uniforms, vertex and fragment shaders are

How to apply GLSL code to the web using GlslCanvas and Three.js

How to connect web events like mouse movement and scroll to our shader code using Javascript

Quick mathematical techniques for producing stunning graphics

How to use procedural noise and randomness to create changeable graphics

WHAT YOU’LL GET
8+ hours of video lessons – Practical, go-at-your-own pace learning

Access the community – Join our Slack and connect with thousands of SuperHi students and alumni

Continued help – Help from our expert teachers and educators with years of experience in the industry

Real world projects – Projects and code that you can alter and remix to add to your own sites and portfolio

Resources – Resources to get you started and going post-course

WHO THIS COURSE IS FOR
This course is aimed at creative people who want to make highly-performant graphics for the web.

As this course is applying shaders to websites, you’ll need knowledge of HTML, CSS and Javascript to start this course as we’ll be using them within our projects.

If you’re less comfortable with Javascript, we recommend taking our Javascript for Designers course or Experimental Javascript course before this one.

WHAT YOU’LL NEED
A computer (Windows, Mac or Linux) with the latest version of Chrome installed and a broadband internet connection. Just that!