Welcome to programming creatively – A general programming video tutorials endeavour.
As of 25th March 2022 this site has just been made live. Source code is included on each tutorial page below the video (excluding the RCS Teaser series).
Detailed explanations accompanied with diagrams will be added in due course.
Embedded systems tutorials are to be added later.
Your physics (gameplay) routines reside and run in the main loop on the CPU side, and your game’s characters such as the main player, enemies, spaceships, aliens, etc, are all created by using 3D modelling software such as Blender or Maya...
Those models are then imported into your game, making them ready for processing via the graphics rendering pipeline. Your main loop then executes the physics routines, and then calls upon the OpenGL API to render your models with the assistance of your graphics card.
Although the rendering pipeline consists of several stages, you’re only required to access the vertex shader and the fragment shader stages in order to produce a perfectly functional game.
The following program performs translation and rotation transformations via the GLM maths library; it generates both perspective and orthographic shadows that remain true to the light positions as they animate around the scene, and it also takes advantage of GLFW’s keyboard, mouse and joystick user input. The only shaders it uses are the vertex shader and the fragment shader...
3D computer graphics is visual by its very nature, and so it’s not surprising that visualisations help enormously with conceptual understanding. Take skyboxes for example... understanding why they work is a conceptual challenge – can a skybox be created by printing onto big sheets of rigid cardboard? Or do they require graphics programming?
Skyboxes are often rendered by using OpenGL’s built-in cubemap sampler functionality, but you can simply just import a 3D model cube instead, that already has the 6 images applied, and then render the cube like a normal model. Or you can render a sphere which is even easier… or even a full-screen quad for maximum efficiency.
The following video demonstrates CSS Flexbox in considerable detail. Relatively speaking flexbox is one of the modern (introduced in 2009) alternatives to using "floats" (and other techniques) for creating responsive layouts. We dive into all the details of how flexbox works, looking at many different examples.
CSS Grid became widely supported by all browsers from Spring 2017. Some programmers were reluctant to learn this new major specification because of having already learnt flexbox, which itself works great for creating responsive layouts... so do we really need grid?