Tech News
← Back to articles

ZX Spectrum graphics magic

read original related products more articles

Hey friends! (Or just curious readers peeking under the hood of good old retro games).

My previous article on calculating angles with integers was well-received. Several people wrote to me, some asked questions, others offered their own algorithm variations, and it turns out there are quite a few ZX Spectrum programming enthusiasts – it’s fascinating, and that’s what all this is for!

In my new article, I wanted to talk in detail about drawing lines and other primitives on the Speccy, but I suddenly realized that some might not be familiar with how the Speccy’s screen is structured at all, and without that, it’s absolutely impossible to move forward. It’s like trying to build a house without knowing what a brick is made of or how to lay it!

So, let’s break down this, frankly, complex topic. We’ll figure out how the classic Spectrum draws things on the screen, and of course, we’ll draw something simple but enlightening! Get your virtual oscilloscopes and soldering irons ready (or just your emulators)!

Part 1: Screen Secrets: Why the Speccy Draws the Way It Does

So, when we turn on our beloved Speccy, we see that magical black window in a white frame, with red lines flashing across it, and then everything turns white with text at the bottom. If we switch the screen background to black (for example, in BASIC with the command "PAPER 0: INK 7"), we’ll see a black field measuring 256 pixels horizontally and 192 pixels vertically. This is our main "canvas" for creativity!

It seems simple enough, right? It’s just a pixel grid, like in Paint! If you want to draw a dot at coordinates (X, Y), you just access the "cell" with those coordinates in video memory, put the desired color there, and you’re done.

But here’s the Spectrum’s first trick! Its video memory isn’t as straightforward as you might think. It’s divided into two large parts:

Pixel Area: This stores data on whether each specific pixel is on or off. "On" (value "1") means it’s drawn with the INK color; "off" (value "0") means it’s drawn with the PAPER color. Each pixel is represented by just one bit! Attribute Area: This stores data on which INK color, which PAPER color, and what effects (BRIGHT/FLASH) will be used for a group of pixels.

The most important point: this "group of pixels" isn’t a single pixel! It’s a block measuring 8 pixels horizontally and 8 pixels vertically. So, the entire 256×192 screen is divided into a grid of such attribute blocks: 256 / 8 = 32 blocks horizontally and 192 / 8 = 24 blocks vertically. A total of 32 * 24 = 768 attribute blocks. In some literature, these "blocks" might be called "characters" or "squares."

... continue reading