After — Preposition Programming

Fig. 1 Event sequence — scatter effects begin once the collision occurs

Try it — drag, click, or tap inside the figure.

Open in p5 Web Editor Fork and experiment with this sketch

Concept

AFTER means following a reference event. Trigger secondary effects once the primary event has occurred.

Translation strategy

Ways to express after in code:

Event trigger: Detect collision or arrival, then change phase
Consequences: Spawn particles, sounds, or state changes afterward
Phases: Separate logic for before, during, and after the event

Key p5.js methods

Key methods

Detection
• dist() — impact threshold
• atan2(), cos(), sin() — scatter directions

Particles
• Arrays; update velocity while impact.hasHappened

Pointer input
• mousePressed() — start motion or set a target
• mouseX, mouseY — click position

Code pattern

Code pattern

1. Setup projectile and impact point
let shot = { x: 50, y: 150, moving: false };
let impact = { x: 200, y: 150, happened: false };

2. Move until collision
if (dist(shot.x, shot.y, impact.x, impact.y) < threshold) {
impact.happened = true;
}

3. Run after-effects
if (impact.happened) { /* spawn / move particles */ }

4. Damp particle velocity over time
particle.vx *= 0.98; particle.vy *= 0.98;