# Bouncing Ball

> Place the following line in your website to include this in your course.

- Skill: `tools-only/bouncing-ball` (Agent Skill, multi-file: 3 files)
- Install (CLI): `npx skillmds@latest add tools-only/bouncing-ball`
- Raw SKILL.md: https://api.skillmd.com/api/skills/tools-only/bouncing-ball/raw
- Safety review: pending (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: tools-only (https://skillmd.com/u/tools-only)
- Updated: 2026-09-29
- Page: https://skillmd.com/skills/tools-only/bouncing-ball

---

# Bouncing Ball

<iframe src="main.html" height="432px" scrolling="no"></iframe>

[Run the Bouncing Ball MicroSim Fullscreen](./main.html){ .md-button .md-button--primary }
<br/>
[Edit the Bouncing Ball MicroSim with the p5.js editor](https://editor.p5js.org/dmccreary/sketches/icpiK4UjE)

Place the following line in your website to include this in your course.

```html
<iframe src="https://dmccreary.github.io/microsims/sims/bouncing-ball/main.html" height="432px" scrolling="no"></iframe>
```

The bouncing ball is the "Hello World!" of the Educational MicroSims.
It contains the key elements that shows the power of the width-responsive MicroSims
graphics with movement and user interaction.  When we design MicroSims, we also
want clearly-visible user interface elements in the control area that can control
the running of our simulations.  This version contains a slider to control the speed of the ball's movement.

## Lesson Plan

Here we would place the text for how the Bouncing Ball might be used in a classroom setting.