Home / Commodore 64 / Phase 0 / Lesson 6
Lesson 6 of 64

Simple Animation

What you'll learn:

  • Use cursor control and spaces to position characters on screen.
  • Combine loops with timed delays to create visible movement.
  • Use `TI` for frame-accurate timing and `TI$` for clock display.
  • Build a bouncing text animation that respects the screen edges.
9% Complete

Lesson 6 – Simple Animation

The C64’s screen is your stage. With a few tricks—clearing, positioning, delaying—you can coax text to dance across it. Today you’ll build a bouncing character that sets the foundation for future sprite work.

[📷 suggested: screenshot of a * bouncing left-to-right]


The One-Minute Tour

  • CHR$(147) clears the screen; CHR$(19) homes the cursor.
  • SPC(n) prints spaces to move horizontally.
  • Short FOR...NEXT loops act as delays so motion is visible.
  • Update a position variable each frame, flipping direction at the edges.

Example Program

NEW
10 PRINT CHR$(147)
20 X=0 : D=1
30 PRINT CHR$(19); : PRINT SPC(X); "*"
40 FOR T=1 TO 120: NEXT T
50 X = X + D
60 IF X=0 OR X=38 THEN D = -D
70 GOTO 30

Sample output: a star glides across the top row, bounces off the borders, and repeats.

Line 30 homes the cursor and prints the character at column X.
Line 40 is a brief pause so your eyes track the movement.
Line 60 flips direction when the star hits either edge.

Tip: The C64 text display is 40 characters wide, with columns numbered 0 through 39. Leaving the final column free avoids printing off-screen.


Experiment Section

  • Slow it down: increase the delay loop upper bound to 200.
  • Speed it up: change the delay to FOR T=1 TO 60.
  • Move diagonally: add a Y variable and print blank lines with FOR R=1 TO Y: PRINT : NEXT.
  • Change the character: swap "*" for "@" or a string like "C64".
  • Leave a trail by removing the clear step (PRINT CHR$(19);).

[🎥 suggested: clip showing variations—different speeds, diagonal motion, trails]


Frame-Accurate Timing with TI

The FOR T=1 TO 120 delay works, but it’s crude—run it on a faster C64 and the animation speeds up. The system timer (TI) ticks precisely 60 times per second (jiffies), giving you frame-perfect delays.

NEW
10 PRINT CHR$(147)
20 X=0 : D=1
30 PRINT CHR$(19); : PRINT SPC(X); "*"
40 T0=TI : T1=T0+2
50 IF TI<T1 THEN 50
60 X = X + D
70 IF X=0 OR X=38 THEN D = -D
80 GOTO 30

Line 40 records the current jiffy count, then adds 2 for a delay (2/60ths of a second). Line 50 waits until TI reaches that target. Now your animation runs at the same speed on any C64.

Tip: TI$ returns the time as a formatted string ("HHMMSS"). Great for displaying a game clock:

PRINT "TIME: ";LEFT$(TI$,2);":";MID$(TI$,3,2);":";RIGHT$(TI$,2)

Use TI for delays and frame timing; use TI$ for readable clocks and countdowns.


Concept Expansion

This text-based animation mimics what you’ll later do with sprites: update position, draw, wait a frame, repeat. In future lessons you’ll write directly to screen memory ($0400) or use hardware sprites to achieve smoother motion without clearing text.


Game Integration

  • Title screens: animate a flashing “PRESS FIRE” prompt.
  • HUD effects: bounce arrows around a menu selection.
  • Simple enemies: make ASCII ghosts patrol the screen before you introduce sprites.
  • Transitions: wipe the screen by sliding symbols left to right.

From the Vault

  • Inside the VIC-II — understand the video chip that ultimately draws every character you animate.

Quick Reference

REM Screen animation essentials
PRINT CHR$(147)        : REM clear screen
PRINT CHR$(19);        : REM home cursor
PRINT SPC(X); "*"      : REM draw at column X
FOR T=1 TO 120: NEXT T : REM frame delay (crude)
T0=TI : T1=T0+3 : IF TI<T1 THEN GOTO previous_line : REM precise delay (3 jiffies)
PRINT "TIME: ";LEFT$(TI$,2);":";MID$(TI$,3,2) : REM formatted clock
IF X=0 OR X=38 THEN D=-D
  • Use semicolons after PRINT to avoid automatic newlines.
  • Delay loops consume CPU but are fine for early experiments.
  • TI counts jiffies (1/60 second); TI$ returns "HHMMSS" format.
  • For frame-perfect timing, always use TI instead of FOR loops.

What You’ve Learnt

  • Clearing, homing, and spacing give you precise control over text placement.
  • Loop-based delays turn instant updates into perceivable motion.
  • The TI system timer provides frame-accurate delays; TI$ displays formatted time.
  • Tracking position and direction variables lets you build bouncing animations.
  • You now have the building blocks for text-based effects and prototypes before moving to sprites.

Next lesson: Sound Off — use POKE and the SID to add bleeps and bloops to your animations.