Skip to main content
All guides

Make Hits Feel Heavy: Adding Game Juice to a Web Game with an AI Agent

Screen shake, hit-stop, flashes and damage numbers, and how to get a coding agent to wire them in without making the game feel sluggish.

"Juice" is the feedback that makes an action feel good: the camera kicks, the enemy flashes white, the game freezes for a few frames, numbers fly out. Agents rarely add it on their own, and when they do they tend to overdo it. A skill fixes both problems by shipping tuned code and rules.

The four layers

  1. Screen shake from trauma. Each hit adds trauma (0–1). Shake strength is trauma squared, and trauma decays every frame, so small hits barely move the camera and big ones stack.
  2. Hit-stop. Freeze game logic for 70–160 ms on heavy hits. Above about 200 ms it feels like lag.
  3. Flash and squash. Draw the target pure white for one or two frames and squash it briefly in the hit direction.
  4. Particles and numbers. Sparks at the hit point and a damage number that pops and floats.

The rule of thumb: light hits should be frequent, fast and cheap. Save hit-stop and screen flashes for heavy hits and kills.

With the hit-juice skill

Install it (see the install guide), then ask your agent:

Use the hit-juice skill. Wire it into our damage function: normal attacks are light, charged attacks heavy, crits crit, final blows kill.

The skill tells the agent to find your main loop and damage function first, then add roughly this:

const juice = createJuice();
function loop(raw) {
  const dt = juice.step(raw); // dt is 0 during hit-stop
  update(dt);
  juice.applyCamera(ctx, W, H);
  drawWorld();
  juice.drawFx(ctx);
  ctx.restore();
  juice.drawOverlay(ctx, W, H);
}
// in the damage function
juice.hit(x, y, 'heavy', { entity: enemy, dirX: 1, damage: 42 });

Check it

  • Attack ten times in a row: no console errors, and the game never feels frozen.
  • Turn on reduced motion in your OS: the camera should not shake.
  • Try a phone-sized window (390×844): the particle cap drops automatically on low-end devices.

Try the live demo on the hit-juice page.

hit-juice