Skip to content
SlashClone
Made by@gameforge

Game juice pass

@gameforge/game-juice-pass

Make a working game feel good: an ordered juice pass that adds screen shake, hit stop, particles, squash and stretch, easing, score popups, flashes, and tiny Web Audio sounds to the moments that matter, each behind a config value and a reduced-motion setting. Ships dependency-free canvas snippets.

SkillOtherv1.0.0 (latest)
Activity
New: be the first to try it
  1. 1---
  2. 2name: game-juice-pass
  3. 3description: Run a juice pass on a working game so it feels good to play, adding screen shake, hit stop, particles, squash and stretch, easing, score popups, flashes, and simple sound effects to the game's key moments, tuned through config. Use when the user says "make it feel better", "add juice", "game feel", "it works but it's boring", "add screen shake", or "polish pass", for HTML5 canvas, JavaScript, or TypeScript games.
  4. 4license: MIT
  5. 5---
  6. 6
  7. 7# Game juice pass
  8. 8
  9. 9Juice is feedback: the game answering every player action with motion, light, and sound. Done well it turns a correct game into a fun one. Done badly it is noise. This kit adds it in a fixed order, to the moments that matter, with every effect tunable and switchable.
  10. 11The snippets in `references/juice-snippets.js` are plain canvas JavaScript with no dependencies. Read that file before editing the game, and copy only what is needed.
  11. 13## Inputs
  12. 151. **The game files**, usually `game/index.html` or `src/`. Ask if there are several candidates.
  13. 162. **The feel they want** in a word or two: punchy, floaty, cozy, chaotic. Default: punchy but readable.
  14. 173. **Sound**: on or off by default? Default: on, with a mute key (M) and a tap target.
  15. 19## Steps
  16. 211. **Read the game and list its key moments** in a table: the player action or event, where it happens in code, and current feedback (usually none). Typical moments: start, jump or move, pickup, hit, near miss, combo, death, new best.
  17. 222. **Pick at most 6 moments** and show the plan before editing: moment, effects, strength. Biggest feedback goes to the rarest, most important events (death, new best). Frequent events (every step) get the smallest.
  18. 233. **Add effects in this order**, checking the game still runs after each:
  19. 24 1. Easing on anything that moves on its own (menus, popups, camera).
  20. 25 2. Squash and stretch on the player for jump and land.
  21. 26 3. Particles on pickup and hit.
  22. 27 4. Score popups on points.
  23. 28 5. Screen shake on big impacts only (trauma model, not random each frame).
  24. 29 6. Hit stop of 0.03 to 0.08 seconds on the hardest hits.
  25. 30 7. Flash on damage.
  26. 31 8. Sound: one blip per key moment, created after the first user input.
  27. 324. **Put every number in a `JUICE` config object** next to the game's existing config, with a comment per value. Add `JUICE.enabled` and respect `prefers-reduced-motion` by scaling shake and flashes down.
  28. 335. **Keep the simulation honest**: effects must not change hitboxes, scoring, or timing, except hit stop, which pauses the update step while drawing continues. Use `dt` for every effect.
  29. 346. **Report** with the table below and suggest the user plays 2 minutes with `JUICE.enabled` true and then false to feel the difference.
  30. 36## Output
  31. 38```markdown
  32. 39| Moment | Before | Added | Tune with |
  33. 40| ------ | ------ | ----- | --------- |
  34. 41| Pickup | score +1 | particles, popup "+1", blip | JUICE.pickupParticles |
  35. 42| Hit | game over | shake 0.6, hit stop 0.06 s, flash, low blip | JUICE.shake, JUICE.hitStop |
  36. 43| Land | nothing | squash 0.25 | JUICE.squash |
  37. 45Toggle: JUICE.enabled. Reduced motion: shake max 3 px, no flashes. Mute: M key.
  38. 46```
  39. 48## Guardrails
  40. 50- Never add external libraries, image files, or audio files. Everything stays in code so a single-file game stays one file.
  41. 51- Change feel, not rules. If a fix needs a gameplay change (hitbox, speed), propose it separately.
  42. 52- No flashing faster than 3 times per second, and keep full-screen flashes below 0.4 opacity, to stay safe for photosensitive players.
  43. 53- Audio starts only after a user gesture and always has a mute.
  44. 54- Edit only the game files listed in Inputs. Show the plan from step 2 and wait for a yes before editing.