In July 2022 I posted a Three.JS Tip a day. Here are articles about these tips.
Create installable Oculus Quest app using PWAs
I’ve added a new section to my ‘Learn to create WebXR, VR and AR, experiences with Three.JS‘ course. Learn how to make your WebXR website into an installable app, using Progressive Web Apps (PWA) technology. You’ll start with a super simple example. Then learn how to package it using PWABuilder. Then learn how to use Oculus Developer Hub to deploy your app to your headset. Finally you’ll learn to create, package and deploy a WebXR example.
Course is available at the lowest price Udemy will allow until Tuesday 12th June.https://www.udemy.com/course/learn-webxr/?couponCode=OCULUS_PWA
Beginners Guide to 3D Web Game Development with Three.JS
My ‘Beginners Guide to 3D Web Game Development with Three.JS’ is just $9.99 for the next few days. It’s a great introduction to an amazing library even if you aren’t interested in the game side.
The JavaScript programming language is probably the most popular programming language in the world. Companies all around the global require developers who are proficient with this language. In this course I teach you about the language then apply your new skills to create three games.
Before you write your first game you’ll use your new JavaScript skills and the popular Open Source library, ThreeJS to create several simple online 3D apps. Once you know enough about the ThreeJS library it’s time to create your first game. The first game is a simple game. Here you’ll learn about loading assets, moving assets, user input and collision testing.
The course builds on the skills you learn. The next game is a shooter and you learn how to animate a player avatar, how to control NPC characters so they patrol on a random path using navigation meshes and path-finding. You’ll learn how to control the avatar with a keyboard or gamepad and on a mobile using an on-screen controller. You’ll learn how to fire bullets at the enemy and add AI to the NPCs so they fire back. All the key ingredients of a shooter game.
The last game uses the physics engine CannonJS to control the motion of balls in an Eight-ball Pool game.
Along the way you’ll learn to use the 3D application program Blender to prepare your 3D assets for the games you develop.
Once you’ve completed the course you’ll be super ready for any challenges an employer throws your way when writing JavaScript code. But the main thing is you’ll have developed your much in-demand skills while having fun making games.
My GLSL course is just $9.99 this week
https://www.udemy.com/course/learn-glsl-shaders-from-scratch/?couponCode=MAY22_BEST
In this course we’re going to look at GLSL ( OpenGL Shading Language) to create amazing effects.
Maybe you are
- a designer who has seen some terrific, cutting edge websites using cool transitions and wondered how it was done. You may have heard about WebGL and know that you can use some simple THREE.js code to do some remarkable things.
- a developer trying to visualise some data in a striking way.
- a game developer wanting to add some custom effects to your 3d objects surfaces.
GLSL is how you can use OpenGL to display a surface. The code syntax is based on the C language, but fear not, we will assume you have literally no knowledge of this language at all and we will, as the course title states, learn this from scratch. GLSL uses the GPU ( the Graphics Processing Unit) to handle multiple programs at the same time, so it is unbelievably fast.
In the course we will be writing code for the browser, because this allows us to focus on GLSL, without needing to worry about installing any additional software. We will be using the THREE.js WebGL library and CodePen so you can instantly edit the source and see the results, needing nothing other than a browser to experiment. Only a small amount of Javascript is used but this will be explained thoroughly as it comes along. But you can also use what you learn about GLSL in a C/C++/C# program or a Python program.
We will start from really simple examples and progress slowly through each stage of developing a custom shader. You will be able to play with the shader code on CodePen, so you can experiment with different values to see the impact it has on the end result.
GLSL shaders are split into vertex shaders and fragment shaders and we will focus initially on the fragment shader, working essentially in a 2d environment. With dozens of shaders in the course resources you will learn the language in gentle stages.
Creating your own shaders means understanding the GLSL language and that is the aim of the course. You could search for a suitable shader on ShaderToy, ShaderFrog or glslViewer and then try to adapt the code. But without knowing the language you’re going to find that difficult to do. To really be effective you need to know about the GLSL language, shaping functions, tiling, polar coordinates and lighting calculations. To do this you will need to follow along with the course and complete the many challenges suggested. At the end you will then be able to create any shader that you can imagine.
As usual there is a 30 day money back guarantee. So you have nothing to lose. Let’s get shading today!
What students say
“I came here interested in making a custom lighting shader on an obj model, and I really found answers to my questions and more. The two faced aspect of the lessons and the CodePen sketches [are] great. I thank you !”
“A great course! Methodical, step by step explanations not only of the GLSL but also of the general theory behind shaders, usable with any shader system. Essential if you are into computer graphics or generative art. Thank you!”
“I’ve tried to pick up shaders in the past but found it quite difficult. Unlike other resources I’ve found, this course was the course that finally helped me get a much better grasp of glsl. It is well structured and very informative. I would recommend it to anyone looking to pick up glsl.”
“This is exactly what I needed. I am a web designer/developer with design background and a good a good deal of javascript experience I’m trying to get into 3D visualizations for web. Since GLSL is written in C language it had been a huge barrier. I totally recommend this course to anyone having problems to get a clear understanding of GLSL.“
“So far this course has been really amazing. Very few courses on shaders really take the time to explain the math behind what’s happening in a way that let’s “non-math” folk develop an intuition for it. Great job!”
“I was always intimidated by the idea of GLSL, even though I’m an advanced front-end developer. I’ve always been terrible at math; and yet Nik’s style of teaching made me understand everything very intuitively and I’m so comfortable with shaders now. I’ve bought 60+ courses on Udemy; and I quit most of them after a couple videos. This one has me hooked on my chair until I finish everything! Coding along to this course is fun and Nik’s challenges feel very rewarding to either solve or understand through his crystal clear explanation!”
Two new URP videos for Unity
I’ve been working with the URP team at Unity 3D since September 2021. The initial project was an e-book, a guide for those making the transition from the Built-in render pipeline (BRP) to the newish Universal Render Pipeline (URP) it is due for release around Easter 2022, to link to the launch of Unity 2021.2, LTS. To help launch the e-book I’ve completed two videos. You can see an early version of these by following this link. The GitHub repo is here.
If you want to see more about using URP to create shaders check out my Unity shader course, you’ll find a discount link on this page.
Merry Christmas and a Happy New Year
I’d like to thank all my students for a great year. I hope my courses helped with your career or helped you understand often difficult concepts. In the new year watch out for
- URP Shaders and Shader Graph added to my Learn Unity Shaders from Scratch course
- A complete revamp of Create a 3D multi-player course with Three.JS and Socket.IO
- A new course about using Google’s for quick, multi-platform AR
- A new course on using Unity’s Universal Render Pipeline (URP). I’ve just completed the e-book Built-in to URP Migration Guide for Unity, so expect a few less known tips and tricks in this course direct from Unity’s URP team.
- A complete revamp of Create a 3D Car Racing Game with THREE.js and CANNON.js
- A complete revamp of Create a 3D RPG Game With THREE.js
That’s my aim for 2022.
If there is a course you’d like me to add to my TO DO list then contact me [email protected] or via my Facebook groups or Twitter @NikLever
Here’s links to all my courses at the lowest price you’ll find them from today until the 28th. Or use the code XMAS21
Merry Christmas and a Happy New Year
JavaScript in 12 Easy Lessons (FREE COURSE)
https://www.udemy.com/course/javascript-in-12-easy-lessons/?referralCode=086EC53154E29AD37EA1
The Beginners Guide to 3D Web Game Development with ThreeJS
https://www.udemy.com/course/beginners-3d-web-game-development-with-threejs/?couponCode=XMAS21
Learn to Write Unity Compute Shaders
https://www.udemy.com/course/compute-shaders/?couponCode=XMAS21
Learn to create WebXR, VR and AR, experiences using Three.JS
https://www.udemy.com/course/learn-webxr/?couponCode=XMAS21
Learn Unity Shaders from Scratch
https://www.udemy.com/course/learn-unity-shaders-from-scratch/?couponCode=XMAS21
Learn GLSL Shaders from Scratch
https://www.udemy.com/course/learn-glsl-shaders-from-scratch/?couponCode=XMAS21
Create a 3D multi-player game using THREE.js and Socket.IO
https://www.udemy.com/course/create-a-3d-multi-player-game-using-threejs-and-socketio/?couponCode=XMAS21
Create HTML5 Games Using Adobe Animate
https://www.udemy.com/course/create-html5-games-using-adobe-animate/?couponCode=XMAS21
Create a 3D Car Racing Game with THREE.js and CANNON.js
https://www.udemy.com/course/create-a-3d-car-racing-game-with-threejs-and-cannonjs/?couponCode=XMAS21
Create a 3D RPG Game With THREE.js
https://www.udemy.com/course/create-a-3d-rpg-game-with-threejs/?couponCode=XMAS21
HTML5 Game Development : Beginner to Pro
https://www.udemy.com/course/html5-game-development-beginner-to-pro/?couponCode=XMAS21
JavaScript in 12 Easy Lessons
Pleased to announce that my first FREE course is now live on Udemy. https://www.udemy.com/course/javascript-in-12-easy-lessons It is a Beginners Guide to JavaScript and will help some of my ThreeJS and HTML5 Game Development students.
- Variables
- Strings
- Arrays
- Objects
- Classes
- Functions
- Conditions
- Loops
- Modules
- Math
- Scope
- JSON
I hope you like it.
Added a Blur ThreeJS post-processing pass to my GLSL shader course
JavaScript in 12 easy lessons – e-book
Pleased to report that my first e-book ‘JavaScript in 12 easy lessons’, will be available soon. #codenewbie #webdeveloper
Tutorial Tuesdays
Here’s a link to my latest Tutorial Tuesday free YouTube video. Subscribe to get a new tutorial every Tuesday.