While it is relatively easy to draw complex static objects, animation is considerably harder. The processing power and memory size of the BBC machine limit the quality of animated images that can be produced. To achieve a fully--animated picture, a series of views of the scene must be rapidly displayed in sequence. This requires a large amount of processing to be done. Despite this, it is possible to derive good effects by exploiting the ability to change the palette of logical-physical colour relationships.
One way of producing movement is to continuously alter the picture that is being displayed. The following program uses this technique to simulate a kaleidoscope. This does not produce a smoothly-animated image, but the pattern produced is animated in the sense that it is always in a state of f1ux. The program also demonstrates that simply redrawing a pattern is not fast enough to produce true animation.
In a mechanical kaleidoscope coloured flakes are randomly shaken up, and a symmetrical pattern is produced by reflecting these in two mirrors. This program generates three random points that form the edges of a triangle, and then rotates and reflects the triangle to produce a similar effect to that produced by the mirrors.
KALEIDO
0 REM Kaleidoscope
20 MODE2
30 VDU5
40 VDU29,640;520;
50 REPEAT
60 FORL%=12TO500STEP20
70 GCOL0,RND(8)-1
80 X%=RND(L%):Y%=RND(X%)
90 X1%=RND(L%):Y1%=RND(X1%)
100 X2%=RND(L%):Y2%=RND(X2%)
110 MOVEX%,Y%:MOVEX1%,Y1%:PLOT85,X2%,Y2%
120 MOVE-X%,Y%:MOVE-X1%,Y1%:PLOT85,-X2%,Y2%
130 MOVEX%,-Y%:MOVEX1%,-Y1%:PLOT85,X2%,-Y2%
140 MOVE-X%,-Y%:MOVE-X1%,-Y1%:PLOT85,-X2%,-Y2%
150 MOVEY%,X%:MOVEY1%,X1%:PLOT85,Y2%,X2%
160 MOVE-Y%,X%:MOVE-Y1%,X1%:PLOT85,-Y2%,X2%
170 MOVEY%,-X%:MOVEY1%,-X1%:PLOT85,Y2%,-X2%
180 MOVE-Y%,-X%:MOVE-Y1%,-X1%:PLOT85,-Y2%,-X2%
190 NEXT L%
200 UNTIL FALSE
Description of program
20 16-colour mode (actually, only 8 non-flashing colours). 30 Remove text cursor. 40 Define the centre of the kaleidoscope to be at the origin - here this is just off-centre of the screen. 60 L% controls the size of the kaleidoscope. This loop makes the pattern grow outwards. Select a colour at random, including black. 80-100 Choose the corners of the initial triangle. 110-180 Fill in the initial triangle with 5 other rotations and reflections of it. 190 Start again.
Drawing or redrawing an object is a relatively slow process, but palette changes can alter the appearance of an object very rapidly. If a single object is drawn with a number of different colours you can give the illusion of motion simply by changing the palette, and this avoids the need to redraw each view of the object. A similar technique is commonly used in neon signs that appear to move by changing the coloured lights that are turned on.
Animation by palette changes alone is most easily applied to a rotating object such as a beach ball, where the rotating object does not 'change shape' but stays within the confines of its original outline as it turns.
In programs that use rapid palette changes 'you may notice that the display is subject to dark bands and flicker. This is because the palette changes are not synchronised to the video scan time. To avoid this you could wait for vertical sync before changing the palette. This can be done using the operating system call *FXl9 which exists in release 1.0 of the MOS.
Here is a short program that uses palette changes to rotate a flat spiral as it is being drawn. The spiral grows outwards from the centre of the screen, rotating as it expands. The pattern drawn is in fact an ellipse, and this gives the impression of a 3-dimensional spinning disc. SPIRAL1
SPIRAL1
0 REM Flat Spiral
20 MODE1
30 VDU5
40 C%=1:F%=RND(5)
50 VDU29,640;512;
60 MOVE0,0
70 FORA=0TO300STEP0.2
80 GCOL0,1+(3.8*A)MOD3
90 DRAW3*A*SIN(A),2*A*COS(A)
100 FORI%=1TO3
110 VDU19,I%,(C%+I%)MOD3+F%;0;
120 NEXT
130 C%=(C%+1)MOD3
140 NEXT
150 GOTO 20
Description of program
40 C% keeps track of the current state of the palette. F% determines which physical colours will appear. 50 Put the origin in the centre of the screen. 70 The variable A determines the angle around the spiral and the size. 100-120 Change the colours of the arms as we draw around the spiral. The factor 3.8 makes the arms reasonably straight. 100-120 Change the palette to give the impression of movement by moving each of the physical-logical colour relationships on one step. 130 Alter C% so that next time the palette is changed the colours will move on one step. 150 Start again.
This program produces a curious spiral pattern by rotating squares that gradually increase in size. When the pattern has been completed a moving effect is produced by changing the palette.
ROTSQ
0 REM Rotating Square
20 MODE1
30 VDU5
40 VDU29,640;512;
50 C%=1
60 FORI%=0TO900 STEP 12
70 A=I%/200
80 X%=I%*SIN(A)
90 Y%=I%*COS(A)
100 MOVEX%,Y%
110 DRAW-Y%,X%:DRAW-X%,-Y%:DRAWY%,-X%:
DRAWX%,Y%
120 GCOL0,C%
130 C%=(C%+1)MOD3+1
140 NEXT
150 F%=3
160 REPEAT
170 FORJ%=1TO3
180 VDU19,J%,(J%+C%)MOD3+F%;0;
190 NEXT
200 C%=(C%+1)MOD3+1
210 DELAY=INKEY(10)
220 UNTIL FALSE
Description of program
20 4-colour mode. 30 Remove text cursor. 40 Put the origin in the centre of the screen. 50 Hold the the current logical colour. 60 The size of the squares is determined by I%. 70 A is the angle through which each square is rotated. 80-90 Calculate the coordinates of one corner. 100-110 Draw a rotated square. 120 Select colour. 130 Choose the colour of the next square. 140 On leaving this loop the pattern has been drawn. All that follows is the palette changes which give the impression of animation. 150 F% determines which three physical colours will be displayed. 170-190 Change each colour to the one next to it. 200 Select the next colour. 210 Cause a short delay. (Pressing any key will cancel the delay.)
Animation using palette changes becomes smoother as more logical colours are used. Here all the non-flashing colours are used to fill a spiral, which is then rotated when any key is pressed. The spiral is filled using rings of triangles that alternately point inwards and outwards, so that adjacent rings mesh together.
SPIRAL2
0 REM Spiral
20 MODE2
30 VDU29,640;512;23;9;0;0;0;
40 MOVE0,0
50 MOVE0,0
60 Z=512
70 A%=180
80 P=8
90 DIMA(480):FORQ=0TO480:A(Q)=SINRADQ
:NEXT
100 R%=1
110 VDU5
120 REPEAT
130 R%=R%-1:IFR%=0 R%=6
140 FORB%=0TO5
150 FORA%=B%TOB%+359STEP6
160 GCOL0,R%:R%=R%+1:IFR%>6 R%=1
170 PLOT&55,A(A%+90)*Z+1,A(A%)*Z+1
180 MOVEA(A%+93)*(Z-72),A(A%+3)*(Z-72)
190 NEXT
200 Z=Z-P
210 NEXT
220 UNTILZ<=120
230 FORI%=0TO7:VDU19,I%,0;0;:NEXT
240 A%=GET
250 DIM A$(7)
260 FORZ=1TO6:FORY=1TO6
270 A$(Z)=CHR$19+CHR$Y+CHR$((Y+Z-1)MOD
6+1)+CHR$0+CHR$0+CHR$0+A$(Z):NEXT
280 NEXT
290 FORQ%=1TO6:N%=TIME+4:REPEATUNTILTI
ME>N%:PRINTA$(Q%);:NEXT
300 GOTO290
Description of program
30 Set up the origin at the centre of the screen and turn interlace off. 90 Compile a table of sine values to save time later on. 110 Turn cursor off. 120 This outer loop, in conjunction with the loop starting at line 140, decrements the radius of the circles drawn by the inner loop (lines 150-190), thus making the spiral grow inwards. 150-190 This inner loop draws the circle of triangles. 200-220 Close outer loop 230 Make the screen go black. 240 Wait for a key to be pressed. 250-280 Set up string array A$ to change the palette. 290-300 Change the palette using predefined array.
Here is a program that simulates the rotating fans inside a jet engine. The fan blades are coloured red, white and blue, and are drawn to give a perspective view of the fan. Three fans are drawn, and then rotated. The central fan appears to rotate in the opposite direction to the other two; this is because when this fan is drawn it is coloured in the opposite direction to the outer fans.
ROTFAN
0 REM Rotating fan
20 MODE1
30 VDU19,2,4;0;
40 VDU5
50 X%=740:Y%=612:S%=400:C%=1:N%=TRUE
60 FOR FAN=1 TO 3
70 N%=NOT N%
80 X%=X%-100:Y%=Y%-100:S%=S%-50
90 FORA=1.25*PI TO PI/4-PI/35 STEP -P
I/35
100 C%=(C%+1)MOD3
110 IF N% THEN CT%=2-C% ELSE CT%=C%
120 PROCSIDE(X%,Y%,S%,A,CT%+1)
130 PROCSIDE(X%,Y%,S%,2.5*PI-A,3-CT%)
140 NEXT A,FAN
150 C%=1
160 REPEAT
170 FORI%=1 TO 3
180 J%=(C%+I%)MOD3 +1
190 IFJ%=2 THEN J%=4
200 IF J%=3 THEN J%=7
210 VDU19,I%,J%;0;
220 NEXT
230 C%=C%+1
240 DELAY=INKEY(12)
250 UNTIL FALSE
260 DEFPROCSIDE(X%,Y%,S%,A,C%)
270 X1%=S%*COSA:Y1%=S%*SINA
280 D%=S%/3
290 VDU29,X%;Y%;
300 GCOL0,C%
310 MOVE0,0:PLOT0,X1%,Y1%:PLOT81,D%,D%
320 PLOT0,-X1%,-Y1%:PLOT85,0,0
330 ENDPROC
Description of program
30 Redefine the palette to make logical colour 2 appear as dark blue. 50 Position the centre of the current fan at the point (X%, Y% ) . S% gives the radius, C% controls the colour of the blades, and N% affects the order in which the colours are altered and thus the directions in which the fans will rotate. 60 Draw a fan each time round this loop. 70 Toggle N% so that adjacent fan will rotate in opposite directions. 80 Alter X%,Y% and S% so that the fans appear to approach the observer and get smaller towards the front. 90 Draw a fan with two vanes for each value of A. 100 Select the colour of the next vane. 110 Alter the order in which colours are selected depending on the value of N%, 120-130 Draw two vanes. This ensures that the closer vanes obscure the more distant ones.
On leaving these loops the entire picture has been drawn, and all that follows is concerned with palette changes.
150 C% keeps track of the state of the palette. 160 Move all the logical-physical colour relationships on one step each time around this loop. 170 I% runs through all the logical colours for this mode. 180 J% is the next physical colour to select, 190-200 Alter J% so that the colours dark blue and white appear. 210 Change the palette for each value of I%. 230 Update C% so thegt the colours will move on one step. 240 Wait 12 centi--seconds. 250 Carry on forever. 260 PROCSIDE draws a single vane of the fan, which resembles a page of an open book, and takes the following parameters: X%,Y% gives position of the centre of the fan. S% is the radius of the fan. A is the angle of the vane. C% is the logical colour of the vane. 280 (Xl%,Yl%) is the point on the front edge of the vane. 290 D% is used to draw to the back the vane. 310-320 Put the origin at (X%,Y%).
This program draws a ring of multicoloured beach balls. These are then rotated by palette changes. The procedure PROCEALL draws a single ball. Since it takes quite a long time to draw the entire ring it might be best to alter the program to draw and rotate a single ball first. This will avoid delays if the palette-changing code does not work the first time you run it.
BEACHBA
0 REM Beach Balls
20 MODE 1
30 VDU 5
40 S%=100
50 FOR T=0 TO PI-PI/6 STEP PI/6
60 S%=S%+10
70 PROCBALL(S%,640+500*SIN(T),512+150*COS(T),1)
80 NEXT
90 S%=100
100 FOR T=-PI/6 TO -PI STEP -PI/6
110 S%=S%+10
120 PROCBALL(S%,640+500*SIN(T),512+150*COS(T),1)
130 NEXT
140 REPEAT
150 FOR F=1 TO 6 STEP 0.02
160 FOR I%=1 TO 3
170 VDU 19,I%,(C%+I%)MOD3+F;0;
180 NEXT
190 C%=(C%+1)MOD3
200 A=INKEY(10)
210 NEXT
220 UNTIL FALSE
230 END
Description of program
40 S% gives the radius of the ball. 50-80 Draw the balls on the right-hand side of the ring, increasing the size of the balls as they come towards the viewer. 90-130 Draw the balls on the left-hand side of the ring, starting with the most distant ball as before. 140 Now rotate the balls forever. 150 Determine which physical colours will appear in the ball. This loop makes the balls change colour after rotating for a while. 160-210 Rotate the balls using palette changes.
PROCEALL
The ball is drawn by running round and round an ellipse that gradually gets thinner and thinner. The impression of depth results from the way in which the differently-coloured ellipses are overlayed to resemble the segments of a beach ball. The procedure uses the following parameters:
SIZE% gives the radius of the ball.
(X%,Y%) is the position of the centre of the ball.
C% is the first colour to be used. This affects the direction in which the ball will rotate when the palette changes begin.
240 DEFPROCBALL(SIZE%,X%,Y%,C%)
250 VDU 29,X%;Y%;
260 MOVE 0,0
270 MOVE0,SIZE%
280 FOR A=0 TO 60.4 STEP 0.2
290 SA=SIN(A)
300 Q%=1+(1+A/(PI*2))MOD3
310 GCOL 0,Q%
320 IF SA<0 THEN GCOL 0,4-Q%
330 X%=SIZE%*SA*COS(A/40)
340 PLOT 85,X%,SIZE%*COS(A)
350 PLOT 85,X%,0
360 NEXT
370 ENDPROC
Description of PROCBALL
250 Put the origin at the centre of the ball. 260 Move to the first point on the shrinking ellipse path. 280 Sweep round and round the ellipse incrementing the angle A. 290 Save SIN(A) as SA so that this is only calculated once.
The idea behind 'instant plotting' is to use' palette changes to obscure the next view while it is being drawn. Then by altering the palette it is possible to swap instantly from one frame to the next.
The simple approach of using a different logical colour for the next view is complicated by the fact that in each frame the object being drawn will probably overlap with the previous view. To overcome this the next view can be drawn using the graphics action OR, while the palette changes take care of the added complication of overlapping parts that this introduces.
The various stages in the method are illustrated in the diagrams that follow.
This program demonstrates how the 'instant plotting' technique can be used to produce a remarkably effective animated view. The program shows a box tumbling towards you.
BOX
0 REM Tumbling box
20 MODE1
30 VDU29,640;512;
40 VDU5
50 COL%=RND(7)
60 VDU19,3,COL%;0;19,1,COL%;0;
70 C%=1:A=4
80 GCOL0,C%:PROCBOX(A,A*10)
90 PROCBOX(A,A*10)
100 VDU19,C%,COL%;0;19,3-C%,0;0;
110 REPEATA=A+0.1
120 C%=C%EOR3
130 GCOL1,C%:PROCBOX(A,A*10)
140 VDU19,C%,COL%;0;19,3-C%,0;0;
150 GCOL2,C%:PROCBOX(A-0.1,10*(A-0.1))
160 UNTIL FALSE
Description of program
50 Determine the physical colour of the moving box. 60 Make logical colours 3 and I appear as physical colour COL%. 70 C% determines the physical colour to use. A gives the size and orientation of the box. 80-90 Draw the first view of the box. 100 Ensure the next view will not appear while it is being drawn. 110 Each time around this loop a new box is drawn and the previous view is undrawn. 120 Toggle the value of C% between I and 2. OR the new box. 140 Show the new view and obscure the old one. 150 Remove the old box by ANDing with logical colour C%. 160 Carry on forever.
PROCBOX
This draws a wire-frame view of a box. The position and orientation of the box are determined by the value of AN. S% gives the size of the box. The box is constructed by first drawing the 'front' face, and then drawing an identically-shaped 'back' face running up and down the connecting edges as this is done.
Description of PROCBOX
280 Draw one face. 210 Draw an edge joining the 'front' and 'back' faces. 220-240 Draw three lines of the 'back' face with back-front connecting edges. 250 Draw the final line of the back face.
Here, four lines are used to represent a majestic condor soaring above the Andes. The image is convincing because of the way in which these simple lines are smoothly-animated to capture the motion of the bird's wings. The various wing positions used in this animation are shown below:
The background landscape is built out of random lines. These give the impression of dark peaks rising from a seething mass of vegetation.
CONDOR
0 REM Condor
20 MODE1
30 VDU5
40 PROCANDES
50 C%=1:L%=FALSE
60 ANGLE=0
70 REPEAT
80 ANGLE=ANGLE+0.2
90 C%=C%EOR3:GCOL1,C%
100 OX%=640+500*COS(ANGLE/12)
110 OY%=712+200*SIN(ANGLE/12)
120 X%=(OY%-1030)/4:Y%=X%*COS(ANGLE)
130 A%=X%*1.5:B%=A%*COS(ANGLE-0.4)
140 PROCBIRD(X%,Y%,A%,B%,OX%,OY%)
150 VDU19,C%,2;0;19,3-C%,0;0;
160 IF L% THEN GCOL2,C%:PROCBIRD(X1%,Y
1%,A1%,B1%,OX1%,OY1%) ELSE L%=TRUE
170 X1%=X%:Y1%=Y%
180 A1%=A%:B1%=B%
190 OX1%=OX%:OY1%=OY%
200 UNTIL FALSE
340 ENDPROC
Description of program
50 L% is used to decide whether there is an old view of the bird that has to be undrawn. ANGLE determines both the wing position and the bird's location. 100-110 Calculate the new position of the bird. 120-130 Calculate the new wing positions. 140 Draw the new bird. 150 Flip to view the new bird. 160 Undraw the old bird, unless this is the first time around the loop and there is no old bird to undraw. 170-190 Make the new bird the old bird.
PROCANDES
210 DEFPROCANDES
220 GCOL0,3
230 VDU19,3,2;0;
240 MOVE0,0:DRAW1279,0:DRAW1276,1020:D
RAW0,1020:DRAW0,0
250 FORJ%=-50 TO 100 STEP 4
260 MOVE0,J%
270 FORI%=0TO130
280 PLOT1,10,RND(25)-12
290 NEXT I%,J%
300 ENDPROC
Description of PROCANDES
220 Logical colour 3 is not altered by the animation palette changes. 240 Draw a frame around the screen. 250 For each value of J% we draw a random jagged line across the screen. 270-290 Draw a wiggly line from left to right.
PROCBIRD
310 DEFPROCBIRD(X%,Y%,A%,B%,OX%,OY%)
320 VDU29,OX%;OY%;
330 MOVE-A%,B%:DRAW-X%,Y%:DRAW0,0:DRAWX%,Y%:DRAW
A%,B%
Description of PROCBIRD
310 PROCEIRD takes the following parameters: OX% and OY% define the origin for the bird A% and B% are the ends of the wings X% and Y% are the elbows, or 'bends' in the wings
This program draws a weird pattern that looks a bit like a microscopic bug that pollutes the water supply. The program picks a random physical colour for the parts of successive views of the bug that overlap.
PLANK
0 REM Plankton
20 MODE1
30 VDU5
40 DIM S(121)
50 I%=-2
60 FORA=0TO 2*PI STEP PI/30
70 I%=I%+2
80 S(I%)=400*COS(A)
90 S(I%+1)=400*SIN(A)
100 NEXT
110 C%=1:L%=FALSE:COL%=RND(7)
120 VDU19,2,COL%;0;19,3,RND(7);0;
130 REPEAT
140 FOR J%=0 TO 118 STEP 2
150 C%=C%EOR3:GCOL1,C%
160 PROCPAT(J%)
170 VDU19,C%,COL%;0;19,3-C%,0;0;
180 IF L% THEN GCOL2,C%:PROCPAT(J%-2)
ELSE L%=TRUE
190 NEXT
200 UNTIL FALSE
Description of program
40 The array S will hold a table of coordinates. 50-100 Save the coordinates that are calculated from the slow trig functions SIN and COS in the array S. 140 J% has the same effect as an angle that rotates once as J% goes from 0 to 118. 160 Draw the new pattern. 180 Remove the old pattern.
PROCPAT
This draws the micro-organism in an orientation determined by J%.
PROCPAT
210 DEFPROCPAT(J%)
220 FORI%=0TO500 STEP 20
230 J%=(J%+2)MOD120
240 X%=S(J%):Y%=S(J%+1)
250 VDU29,400+I%;512;
260 MOVE X%,-Y%:DRAW0,0:DRAW X%,Y%
270 NEXT
280 ENDPROC
Description of PROCPAT
220 I% runs along the backbone.
230 This puts the legs at different angles. 240 Look up the (X%,Y%) position from the value of J%. 250 Move the origin. 260 Draw a pair of 'legs'.