Do you want to learn modern OpenGL from the scratch and you have no idea where to start? Then you're in the right place !
This series covers step-by-step learning of OpenGL 4 and later. There is no deprecated OpenGL stuff involved and the minimum OpenGL context used in the tutorials is 4.4.
As a fundamental library to handle basic stuff like windows creation, I decided to stick with GLFW Library, seems to be most widely used and is properly maintained.
All the tutorials in this series are hosted in their own repository on GitHub, so simply clone this repository and open for example Visual Studio Solution packed within and build them right away :
Now here in this tutorial it gets interesting ! We finally make our first 3D scene!
Not only that, we will also learn, how to calculate Frames Per Second (FPS) value and then adjust all the animation values (rotation angle in the case of this tutorial), so that animation is smooth and consistent, no matter how much FPS you have!
This tutorial brings you very nice camera, which is controlled by mouse and WSAD keys, just as in most FPS games . Finally, you can move freely around the scene and you can even fly .
The scene is same as in the previous tutorial, but now you may look on it from above .
This tutorial will teach, how to apply texture to geometry. Texture is an image you can cover object with, however there is more to it than meets they eye .
You will also learn about different ways how to filter textures, that means, what ways to use, when you look at the object from big distance, small distance and so on. The OpenGL object responsible for doing this is called Sampler and we will discuss them in this article as well.
The tutorial itself renders 10 different houses, each of which has different texture filters applied, so that you can immediately see, what difference it makes, if you use different filters.
And there is also a little bonus in this tutorial ! If you pass through any of the houses, you will set the filtering for ground as well! Then you will really see, what difference it makes if you apply different filtering techniques .
It's almost Christmas time and this is my Christmas present for you! In this tutorial, you will learn, what is multitexturing - that is applying multiple textures on the same objects at once.
And because it's the most wonderful time of the year, I have decided to create a nice, Christmas themed scene, where you walk through a village with several houses on a snow-covered pavement .
Have you ever wondered, how to create 2D game panel, containing your current hitpoints, ammo or how much armor you have? Well now you can learn that! But because it's Christmas time, we won't show any ammo, nor armor or hitpoints, but a Christmas tree with snowflake instead .
In this tutorial, we will learn, how to do rendering in 2D over the scene using orthographic projection. This is pretty common in computer games to create menus or HUDs (head-up displays). We will build on foundation of this tutorial to create fonts later .
The same scene? Again? Third time? You should come up with something new!
Maybe that's what you think, when you see the thumbnail, but worry not! There is so much new stuff in this tutorial, although the result is same. But code is much more systematic and cleaner than it was! In this tutorial, we simply look back on what we've done and try to improve our code. You might have seen, that the code has been getting a bit too much copy-pasty lately and the initialization / render functions have gotten way too long.
I have introduced lots of new things in this tutorial and it took definitely longest to program. Basically every object has now its manager, so that you can access it from anywhere. Furthermore, managers clean objects nicely, so we don't forget to remove any shader program! Just read the article and see the changes for yourself .
In this tutorial, we will explore another way of rendering objects - Indexed Rendering. Long story short - you just generate a list of vertices and then tell OpenGL, which vertices form faces and mesh using indices .
To demonstrate it, I have chosen torus as a nice example, where indexed rendering might be used. In the scene, you can see 10 icy pyramids with tori on top .
In this tutorial we will learn, how to output text using OpenGL and FreeType Project - a free library for font rendering. We will learn, how to build and render fonts from TrueType fonts and store the characters in the texture atlas .
Finally we are able to output anything that we want anywhere on the screen, not just set the window title with all information as it was until now !
After two weeks, I came up with another tutorial, although this one is rather short and pretty easy, so I would say it's a chilltorial . It's about blending and how can we use it (wisely) to make objects on our scene transparent .
You will finally understand, what is blending, source buffer, destination buffer, alpha and several blending calculations that exist. This is just a first part however, later on, I want to cover more interesting topics, like Order Independent Transparency .
Finally it's all getting exciting! We will incorporate normals of vectors to calculate more realistic colors of objects! In this tutorial, we will actually learn Phong Shading .
But wait, there's more! This tutorial explains in detail what is ambient light and diffuse light and how to use them. You can play around with variety of keys in this tutorial to observe different behavior when using different settings!
You can create day, dawn or nightly scene effect just by setting the correct parameters .
In this tutorial, we will discover a new type of shader - Geometry Shader. Long story short, geometry shader is able to generate additional geometry out of input data .
We will make use of geometry shader to display normals of our objects. Now you can see, that the normals are transformed properly and lighting calculations are correct. You can also play with the length of the normals to create interesting visual artefacts .
Things are getting pretty exciting now! In this tutorial, we will learn what is heightmap and how to generate random terrain using heightmap and hill algorithm! Hill algorithm is very simple algorithm to generate random terrain and as you can see in the screenshot, the result is pretty impressive! You can also keep regenerating the random terrain by pressing 'R' button (just wanted to make tutorial more cool ).
In this tutorial, we continue with extending our Heightmap class. We add support for loading a heightmap from a grayscale image, which represents height. This way, you can provide whichever terrain you like!
Moreover, you will learn here how to create effect of skies around us using Skybox. Very simple concept, but very powerful results (see for yourself) !
The last tutorial from the heightmap series, where you can learn, how to map multiple textures onto terrain and how to smoothly transition between them! I've made it in a very dynamic way, so that you can define arbitrary number of textures and arbitrary level of transitions!
The final effect is pretty neat and it makes our terrain looks really nice now! It's a bit stupid, that the skybox is desert and on top of my terrain there is snow, but whatever, I just wanted to demonstrate the effect .
After 6 weeks, I'm bringing you another tutorial and now things get really interesting, as this one is about 3D model loading from file using Assimp library! It's an open source library capable of loading practically all of the most common 3D file formats .
This tutorial took me a bit longer to write, because I had some troubles setting it up in a same convenient way as others (my goal is that you just clone repository and that's it), but here it was a bit more complicated. For now, I have included a script called download_prerequisities.bat, that you have to run in order to compile the tutorials locally yourself (it downloads pre-built Assimp libraries, as they're quite huge).
Anyway, scene contains of a simple terrain using our heightmap coupled with two house models loaded from files .
In this tutorial, you will learn how to implement a fog. Fog is a very cool effect, that is pretty simple to implement, but having it in games with swamps or some mysterious parts of the worlds really helps to build the atmosphere .
There are three fog equations described here - linear, which does not look that realistic honestly, exponential and exponentional squared (exp2). You can switch between those equastions using 'F' key and you can also adjust parameters of the fog, so play around to understand it better .
A specular highlight is nice addition to our lighting arsenal. It's that bright spot of light that appears on shiny objects when illuminated. And in this tutorial, there are sci-fi future tori that have it and rotate nicely .
With specular highlight, you can really persuade the viewer that the object is shiny. With just a diffuse shading, it won't look that good at all. You can turn the highlight on and off and see for yourself .
In this tutorial you can learn how to generate cylinder and sphere mesh! Cylinder is relatively easy, it's a simple shape. Sphere is a bit more complex shape to generate, but in the end it all nails down to playing with sines / cosines again .
I was thinking how to demonstrate these two objects and then it hit me - I will create a super simple solar system representation ! And where would I use a cylinder? Let's create a futuristic space station, that's almost as big as planet Earth . So I have really put a lot of effort into this tutorial, you can see it's a bit more entertaining than previous ones.
You can also play around with keys - you can stop objects in the space, change the mesh quality of spheres (to see how the different numbers give differently smooth results) and also see the normals of generated objects. Enjoy .
Finally our scenes get a lot of kick of realism! This tutorial teaches you have to implement basic point lights and what settings do they have to control it .
The scene consists of 4 tori objects, 4 barns and 2 point lights moving around a bit. You can play with point light properties and also with ambient light to get an idea how the point lights affect the scene during "day" and during "night". Just see for yourself .
Until now, we've been using uniforms to set some variables of the shader programs. But it's a very common case, that some variables (even big sets of them) are re-used among multiple shader programs and setting them everywhere would be a lot of work.
And that's where uniform buffer objects come to rescue us. Set data once, re-use everywhere ! Not only we save a lot of GL calls, we also make our code and data a lot more organized. In this tutorial, we're using multiple point lights, that are used both in main shader program and in heightmap shader program. The data of point lights are set in the UBO and reused among the shader programs .
You can add new point lights with Space key and reset them with 'R' key .
Christmas is at the doorstep again and you will get an early present from me - a new tutorial ! This one is Christmas-themed, because it contains winter scene with a snow falling and a fire burning. But wait, there's more! You can move the fire around and put it anywhere around the world !
How was this achieved? Using particle systems implemented with help of transform feedback! It's a cool OpenGL feature that lets you record what you've drawn. This feature can be used for managing thousands of particles on GPU effectively. I have implemented two different particle systems - one for fire and one for snow, but both are conceptually same .
I hope you'll enjoy this Christmas 2020 present and you'll learn a valuable knowledge .
This tutorial is going to be a bit more relaxing than the one before ! Here we're going to implement an orbit camera using spherical coordinates! We will also learn, how to render wireframe models.
Orbit camera is usually found in model editors or many CAD softwares. It's very practical for observing one object from different angles, much more practical than FPS camera for some purposes. My (first) implementation of the orbit camera might not be perfect, but it serves the purpose well .
One day, I would like to upgrade it with quaternions, but not sure, when this day will come .
Another chilltorial (because it's easy) is here . In this one, we will learn what is occlusion query and how to utilize to spare rendering of objects, that are 100% not visible and we can safely ignore rendering them .
The idea is following - you try to render object's occluder, for example bounding box that covers whole object. Rendering of box is relatively cheap and if the rendered box is not visible at all, then also original object can't be visible!
After two chill tutorials, I bring you something more complex - picking of objects in 3D space using color picking method! You will learn an interesting technique and you will expand your OpenGL knowledge a lot!
Why exactly? Because to implement 3D color picking, you will immerse into the world of OpenGL framebuffers and renderbuffers, you will learn why they exist and how can they be used. Learning about framebuffers opens a whole new world of possibilities in 3D graphics (you will also see it in the coming tutorials) .