The vault · 16
Build the Bouncing Ball, Twenty Years Later
The old depot taught animation with a shape, a timer and eleven lines of code. This is that lesson, rebuilt exactly, with the physics, the twips and the modern afterlife the original page never mentioned.
Some lessons become institutions. The bouncing ball was one of them: a known fixture of tutorial sites in the late nineties and early two-thousands, including this domain, where it lived at /tutorials/creating-a-simple-bouncing-ball-application in both its .asp and .htm editions. The premise was irresistible. In a single sitting a beginner could make something move, and movement on a computer screen felt like the real thing, the stuff games were made of.
01The build, exactly as the era wrote it
Open a new Standard EXE project in VB6. Drop a Shape control on the form (the original lesson used a circle, because circles were one click in the properties window). Drop a Timer control anywhere; its position is irrelevant because it is invisible at runtime. Then fill in the two procedures below.
The whole engine, two procedures
FORM1.FRMOption Explicit
' Velocity of the ball, in twips per tick.
Private dx As Single, dy As Single
Private Sub Form_Load()
dx = 240: dy = 180 ' gentle diagonal drift
Timer1.Interval = 20 ' roughly 50 frames per second
WindowState = vbMaximized ' give the ball a room to live in
End Sub
Private Sub Timer1_Timer()
With Shape1
.Move .Left + dx, .Top + dy
' Bounce off the left and right walls.
If .Left <= 0 Or .Left + .Width >= ScaleWidth Then dx = -dx
' Bounce off the ceiling and the floor.
If .Top <= 0 Or .Top + .Height >= ScaleHeight Then dy = -dy
End With
End SubPress F5 and the ball glides on its eternal diagonal, reflecting off every wall with two sign flips. That is the entire tutorial. Everything else the original page added, speed sliders, colour buttons, was the same trick wearing different hats.
02What the original never told you
Three quiet ideas are packed into those lines, and naming them is what turns a copy-paste into an education.
- State lives between events.
dxanddyare module-level on purpose: the ball has to remember its direction between ticks. This is the first place a beginner meets state that outlives a procedure, the concept object-oriented folks would later dress up as encapsulation. - Reflection is negation. Reversing a component of velocity is one character of arithmetic. The physics is a lie (no energy loss, no angle of incidence), but it is a beautiful first lie, and replacing it with real reflection maths is a natural exercise.
- Twips, not pixels. Classic VB measured forms in twips (1440 per logical inch), so the numbers above are resolution-independent in a way beginners learned to appreciate the first time their form looked tiny on a colleague's monitor.
A fourth idea is threaded through the lesson and easy to miss: the timer tick is the application's heartbeat, and everything the program does, it does between ticks. Event-driven programming, covered properly in the IDE tour, starts exactly here.
03Where the ball rolls today
The lesson ports cleanly to the present. In VB.NET the Shape becomes a PictureBox or a WPF Ellipse, the Timer survives under the same name in the toolbox, and twips give way to device-independent pixels, but the two procedures keep their shape. In twinBASIC, the modern descendant of the classic toolchain traced in the community guide, the original code runs almost unmodified, Form_Load, Timer1_Timer and all, which is its own kind of lesson about how forward compatible the VB mental model turned out to be.
Want the natural follow-up exercises, in the order the old site would have assigned them? Add a second ball and detect ball-to-ball collisions; replace the timer with a game loop; add gravity so dy grows each tick and the ball settles into a bounce that decays. Each exercise is one honest step from the code above, which is precisely why this tutorial survived when a thousand fancier ones did not.
Continue through the depot
