Skip to content
Game 14 Unit 2 of 32 1 hr learning time

Designing UDGs

Graph paper to binary — sketch an 8x8 sprite, convert rows to BIN, define the player ship.

6% of Blockstorm

The first unit showed how to POKE bytes into UDG memory. This unit introduces the design workflow — the process of turning a sketch into binary data. You will design the player ship for Blockstorm: a wedge shape pointing upward, recognisable as a spaceship even at 8x8 pixels.

The Program

5 REM === DESIGNING UDGs ===
10 BORDER 0: PAPER 0: INK 7: CLS
20 REM Define UDG I: player ship
30 FOR i = 0 TO 7
40 READ a
50 POKE USR "I" + i, a
60 NEXT i
70 DATA 16, 56, 56, 124, 254, 254, 130, 0
80 REM Define UDG E: bullet
90 FOR i = 0 TO 7
100 READ a
110 POKE USR "E" + i, a
120 NEXT i
130 DATA 16, 56, 16, 16, 0, 0, 0, 0
140 PRINT AT 3, 10; BRIGHT 1; "BLOCKSTORM"
150 PRINT AT 6, 2; INK 6; "Designing UDGs on paper"
160 PRINT AT 8, 4; INK 7; "Player ship: "; CHR$ 152
170 PRINT AT 10, 4; INK 7; "Bullet:      "; CHR$ 148
180 PRINT AT 13, 2; INK 6; "Each 1 in binary = pixel on"
190 PRINT AT 14, 2; INK 6; "Each 0 in binary = pixel off"
200 PRINT AT 16, 2; INK 7; "Row 1: 00010000 = 16"
210 PRINT AT 17, 2; INK 7; "Row 2: 00111000 = 56"
220 PRINT AT 20, 6; INK 7; "Press any key"
230 PAUSE 0

How It Works

Lines 20-50 define UDG I (the player ship) using DATA and a FOR/NEXT loop. Each DATA value is a binary number representing one row of the 8x8 grid. The loop reads each value and POKEs it into the correct memory address.

Line 60 displays the ship at the centre of the screen. CHR$ 152 is UDG I (144 + 8 = 152, since I is the ninth letter).

The Design Workflow

Designing a UDG follows three steps:

Step 1: Sketch on graph paper. Draw an 8x8 grid. Fill in squares to form your shape. For the player ship, the design looks like this:

. . . 1 . . . .    Row 0: BIN 00010000 = 16
. . 1 1 1 . . .    Row 1: BIN 00111000 = 56
. . 1 1 1 . . .    Row 2: BIN 00111000 = 56
. 1 1 1 1 1 . .    Row 3: BIN 01111100 = 124
1 1 1 1 1 1 1 .    Row 4: BIN 11111110 = 254
1 1 1 1 1 1 1 .    Row 5: BIN 11111110 = 254
1 . . . . . 1 .    Row 6: BIN 10000010 = 130
. . . . . . . .    Row 7: BIN 00000000 = 0

Step 2: Convert to binary. Each filled square becomes a 1. Each empty square becomes a 0. Read left to right to get the eight-bit binary number for that row.

Step 3: Write DATA statements. List the eight values in order. The POKE loop does the rest.

Character Codes

The 21 UDGs map to character codes 144 through 164:

UDGCodeCHR$
A144CHR$ 144
B145CHR$ 145
I152CHR$ 152
U164CHR$ 164

You will use CHR$ with these codes throughout Blockstorm to display every custom graphic.

Try This

Design the bullet. The player bullet should be a small upward-pointing shape — perhaps a single dot with a line below it. Sketch it on graph paper, convert to binary, and POKE it into UDG E (USR “E”). Display it with CHR$ 148.

Compare shapes. Display the ship and bullet side by side. Do they look like they belong together? Good UDG design creates a consistent visual style across all characters.