468索引2920f5bc
tools-only2026-10-26查看 1143复制 1182
一个球在绘图区域内弹跳的 MicroSim，带有用于更改速度的控件。
📘如何使用这个技能
- 1复制技能内容·点击上方「Copy SKILL.md」复制全部内容，或 Download 下载到本地
- 2打开你的 AI 客户端·支持 Claude Code、Trae、Cursor、ChatGPT、DeepSeek、Kimi 等任意 AI 助手
- 3粘贴为系统提示/知识文件·Claude Code：放入 .claude/skills/ 目录；普通对话：作为首条消息发送并说「请严格按这份技能文档执行」
- 4直接提出你的需求·AI 会按技能定义的工作流、格式和约束来处理，无需再解释背景
💡 提示：技能生效后，每次对话只需一句需求，AI 会按 SKILL.md 的流程执行。
SKILL.md1339 chars
---
title: Bouncing Ball
description: A MicroSim of a ball bouncing within the drawing region with a control for changing the speed.
image: /sims/bouncing-ball/bouncing-ball.png
og:image: /sims/bouncing-ball/bouncing-ball.png
twitter:image: /sims/bouncing-ball/bouncing-ball.png
social:
cards: false
---
# 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.