If this is your first time reading computer graphics then terms like OpenGL and Shaders might be new to you. To explain it, I would use the following diagram:
The above image is an image of the rendering pipeline. Rendering refers to the process of producing a 2D image from a 3D scene description. So, whenever we display any scene on our computer screen, the scene undergoes above steps in background before we see the final pixels on our screen. So, to control the different parts of this pipeline we use APIs (application programming interfaces) like OpenGL and to control what happens in the arrows (Refer above image), we use something called as “shaders”.
Officially, OpenGL is a family of cross-platform computer graphics APIs that are used to interact with the GPU for rendering. The main advantage of OpenGL is that it is cross-platform (runs on most Operating Systems like Linux, Windows, Mac OSX) and is implemented in most Nvidia and AMD GPUs. There are several versions of the API, and there are implementations, or “bindings” for several different programming languages like C++, Java, Python etc (For the full list refer to this link). Versions of OpenGL for embedded systems such as mobile phones are known as OpenGL ES and versions for use on Web pages are called WebGL. Most CS courses on computer graphics expect students to learn OpenGL or some variant of it as a part of the course.
Besides OpenGL, there are other APIs for rendering like DirectX and Vulkan. DirectX, developed by Microsoft is also supported by almost all Nvidia and AMD GPUs but it isn’t cross-platform and runs only on Windows OS. Vulkan is another API developed by Khronos Group (the same group that maintains OpenGL). It is more recent (the first version of Vulkan was released in 2016) and the main motivation behind Vulkan was to give programmers and game designers more low-level access to hardware/GPU to boost performance and efficiency. This of course comes at a cost of significant up-front work (i.e. more coding and programming effort) on the developer’s part. As per Khronos the Vulkan API, which will complement (and in some cases replace) OpenGL and OpenGL ES.
The main advantage of using these APIs is that a user gets to control almost each and every part of the rendering pipeline and perform necessary optimizations. In the long run, it is always useful to learn atleast one of these APIs (hence most CS courses on computer graphics expect students to learn OpenGL or some variant of it as a part of the course). But, a new user can always use other tools like three.js (a wrapper around WebGL granting high level access), Unity3D (game engine) etc to significantly reduce programming effort. For example to create a Facebook 3D post of rotating earth you literally require 0 lines of code if you use threejs:
Creating @facebook 3D posts with https://t.co/jLTyKERwDZ pic.twitter.com/joZJ5jB4Ly— Ricardo Cabello (@mrdoob) February 23, 2018
In comparison to this, if you are using C++ version of OpenGL, just to create a rotating Earth, you will need to include a few libraries, link everything, place the camera, light source, sphere and assign texture. Though this might take a lot more time, it gives you more control.
Hence, in the subsequent subsections I list various resources for OpenGL. Since knowing the tools are also important, my next post is about these tools.
In my first post, I had listed some books for learning computer graphics. Usually, some of those books also cover OpenGL. Realtime Rendering has an awesome and updated graphics page with most recent books on Computer Graphics and programming. I would recommend going to their page if you are looking to buy a book on some part of graphics.
One of the most popular books on OpenGL is OpenGL SuperBible.
- Siggraph 2013 video on “Introduction to OpenGL” Programming.
- Sonar Systems: Nice set of tutorials on Modern OpneGL 3.0+ (Windows as well as Mac environment setup explained). Covers even advance topics like Obj loading etc.
- MakingGamesWithBen: Tutorials on OpenGL 2D game development.
- thebennybox: Tutorials on OpenGL development.
- ThinMatrix: Tutorials on OpenGL-3D game development in Java.
Some of the websites with tutorials on OpenGL (Reference: Awesome page of OpenGL)
- Learn OpenGL by Joey de Vries
- Learning Modern 3D Graphics Programming by Jason L. McKesson
- Light House 3D by Light House 3D
- Modern OpenGL by Tom Dalling
- OpenGL Examples by Norbert Nopper
- OpenGL Step by Step by Etay Meiri
- OpenGL Tutorial by Alexander Overvoorde
- OpenGL Tutorial by Anton Gerdelan
- OpenGL Tutorial by Bonder Wu
- OpenGL Tutorial by Song Ho Ahn
Knowing what libraries to use is also important. It can help save the time spent exploring random libraries with limited support. Some of the widely used OpenGL libraries are (Reference: Awesome page of OpenGL):
- assimp - Portable library to import 3D models in a uniform manner.
- Bullet - It provides state of the art collision detection, soft body and rigid body dynamics.
- freeGLUT - Mature library that allows to create/manage windows containing OpenGL contexts.
- GLFW - Modern library for creating/interact windows with OpenGL contexts.
- GLFM - Supplies an OpenGL ES context and input events for mobile devices and the web.
- glm - Mathematics library for graphics software based on the GLSL specifications.
- Magnum - It is a 2D/3D graphics engine for modern OpenGL.
- MathFu - C++ math library developed primarily for games focused on simplicity and efficiency.
- Newton - It is a cross-platform life-like physics.
- OGLplus - Collection of libraries which implement an object-oriented facade over OpenGL.
- SDL - Designed to provide low level access to multimedia and graphics hardware.
- SFML - Simple interface to ease the development of games and multimedia applications.
- SOIL - Tiny C library used primarily for uploading textures into OpenGL. (see SOIL2)
- Pangolin - Lightweight portable rapid development library for managing OpenGL display / interaction and abstracting video input.
OpenGL Profile Loaders
If you have been using OpenGL, you might have come across terms like OpenGL core or OpenGL extensions etc and it might be confusing when to use say GLEW or say gl3w and when not to use. The answer depends on your Operating System. Core OpenGL functions refer to features which were introduces as a part of the OpenGL specification i.e. (a specific version of OpenGL) whereas extensions are functions that provide extended functionality which the core of OpenGL does not provide.
So, OpenGL functions (core or extension) must be loaded at runtime, dynamically, whenever the function in question is not part of the platform’s original OpenGL ABI (application binary interface):
- For Windows the ABI covers OpenGL-1.1
- For Linux the ABI covers OpenGL-1.2
- For MacOS X, the OpenGL version available and the ABI version with it is defined by the OS version.
So, this leads to the following rules:
- In Windows you’re going to need a function loader for pretty much everything, except single textured, shaderless, fixed function drawing; it may be possible to load further functionality, but this is not a given.
- In Linux you’re going to need a function loader for pretty much everything, except basic multitextured with just the basic texenv modes, shaderless, fixed function drawing; it may be possible to load further functionality, but this is not a given.
- In Mac OSX you don’t need a function loader at all, but the OpenGL features you can use are strictly determined by the OS version, either you have it, or you don’t.
The above comments were part of a stackoverflow post. For more details please refer it.
A list of profile loaders are (Reference: Awesome page of OpenGL):
- gl3w - Simple OpenGL core profile loader.
- glad - Multi profile loader-generator based on the official specs.
- glbindify - Commmand line tool to generate C bindings for OpenGL, wgl, and glX.
- glbinding - Profile loader leveraging C++11 features to provide type safety.
- GLEW - Mature cross-platform library to load OpenGL extensions.
- glLoadGen - Multi profile loader-generator written in Lua.
For documentation and API information, the place to go to is the official page on OpenGL by Khronos Group. It contains various useful links like cheat sheets, wiki etc.
As I had explained in the first section shader helps you control what happens in the arrows. By definition, a shader is a user-defined program designed to run on some stage of a graphics processor. Its purpose is to execute one of the programmable stages of the rendering pipeline. The word “Shader” comes from the word “Shading” which is a technique for producing appropriate levels of color, light etc in an image.
OpenGL shaders are written in OpenGL Shading Langugage. There are also other shading languages which are used by different tools like CG, Metal, DirectX etc. But, the difference is usually just a change in syntax. The general concepts of shader programming is the same across shaders. So, if you know how to program in say GLSL, it would be easy to convert it to a CG shader.
In OpenGL shading language there are 5 types of shaders:
- Vertex Shaders:
- Tessellation Control and Evaluation Shaders:
GL_TESS_EVALUATION_SHADER. (requires GL 4.0 or ARB_tessellation_shader)
- Geometry Shaders:
- Fragment Shaders:
- Compute Shaders:
GL_COMPUTE_SHADER. (requires GL 4.3 or ARB_compute_shader)
Compute Shaders are a bit different in the sense that they are programs that run on the graphics card outside of the normal rendering pipeline. They can be used for massively parallel GPGPU algorithms, or to accelerate parts of game rendering. Usually, for starters it is best to learn vertex and fragment shaders.
There is a myth among programmers that shaders are painful to write. This is both true and false. Usually, what makes shaders painful is the fact shaders are difficult to debug and shader programming is different from conventional programming. It is creative and parallel, but once you get a hang of it, it can be a lot of fun and it is cool to see the actual effects of your program. What I mean is that, though it can be tedious, it can be really satisfying to see the final effects. For example:
The two examples above are fragment shaders from shadertoy (more details in the next subsection). It may be possible that when you pressed the run button, the page may have lagged or got stuck. This is because these shaders try to run on your web browser by utilizing your PC’s graphic cards. So, if you don’t have GPU and have a weak integrated graphics card, the browser might have crashed.
Learning Shader Programming
Like I had mentioned before, realtime rendering’s book page is really good and contains a nice collection of computer graphics related to books. So, if you are looking to learn a specific shader language, you should look up corresponding book on that page.
Websites and Tutorials
If you would like to learn fragment shaders, there are a lot of websites with tutorials on it like The Book on Shaders. The really cool part of a fragment shader is that, with just one quad (rectangle), you can do really cool stuff.
- Shadertoy is a WebGL based shader sharing platform. It has a really huge collection of fragment shaders. It was created by Pol Jeremias and Inigo Quilez from Pixar Animation Studios. The website makes it really easy to write shaders and link other stuff like keyboard inpur, sound, microphone input etc.
If you are new to shaders, I would highly recommend going through the following video by Pol Jeremias:
I had attended a similar session at Siggraph Asia 2017. It is a really nice tutorial on fragment shaders and assumes that you have zero background knowledge.
- Inigo Quilez’s Website: Inigo Quilez’s website has some really nice experiments, tutorials, code on doing different effects using shaders.
comments powered by Disqus