2D

Pixel art before it was cool

Graphics in 2D is made up of raster images. On older systems (SNES) it was split into two separate parts, backgrounds and sprites. These two ways of handling things in hardware lead to a number of basic ways of doing things that still remain even if it all draws the same way now.

Backgrounds

In the dark ages of game development the computers had two problems, they where slow and had no memory. That made it hard as a common way to optimize something is to transfer resources between memory or cpu time. To minimze the speed issue many game devices supported background fields that could be scrolled on the display around in hardware. So one could make the whole world in one big wide data buffer and then simply scroll the view along as the player walked to the right. With sprites drawing the moving things like monsters and enemies there was no need to spend CPU time changing the background. More background layers was added and could scroll seperate from each other to make the world even more fun with mountains in the distance and bushes in front of the player.

The downside of all this was the memory usage. A big background did eat memory even if only a few bits was used as the color for a single pixel. To lower the memory usage the background could avoid describing the color of a single pixel and instead describe a block of pixels. These small blocks or tiles was something like 16x16 pixels and could be stored once and then reused all over the background. A background with 16x16 blocks that was 1024x1024 pixels would only consume 4Kb instead of 1Mb.

Tile based

Sprites

Sprites are images that can be moved around on the screen and it was originally supported by the hardware. The good thing about them was that they did not disturbed the background and some hardware also supported collision detection. There was a limit to how many sprites could be used at the same time in hardware but clever coding could work around some of these limits. One way was to move the sprites around as each line of the screen was drawn. When the amount of memory increased software sprites could be used to save the background the sprite covered and then draw it back when the sprite was moved. These days there is no problem redrawing all the sprites each frame.

Blitter

Effects

The effects 2D list a number of special effects that can be used in 2D.

Reference

Fast 2D rendering on GPU - 2020

3 Techniques for Dynamically Colored UI Graphics - 2020

Quadrant-Sizing for Efficient UI Rendering - 2020

Perceptually Smooth Multi-Color Linear Gradients Progressing in Circles - 2020

Graveyard Keeper: How the graphics effects are made - 2018

2d graphics in Rust discussion - A look at GPU memory management - 2018

8 Bit & '8 Bitish' Graphics-Outside the Box - 2016

Advanced Visual Effects in 2D Games - 2015