メニュー
Draw the early-stage Dino scene with Canvas API using simple primitives. Use when students are at render-focused stages and need help with canvas setup, coordinate placement, draw order, and minimal readable edits in main.js.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Implement compact collision detection, score updates, and game-state transitions for the Dino teaching repo. Use when students are adding obstacles/game-over behavior and need minimal, stage-aligned logic in main.js.
Debug the smallest likely cause first while using frequent Git checkpoints in this teaching repo. Use when students need to isolate bugs, keep diffs small, verify fixes, and preserve readable commit history during Codex-assisted iteration.
Add beginner-friendly jump physics and a minimal frame loop to the Dino teaching project. Use when students need stage-2 style help for input handling, gravity, landing clamps, and requestAnimationFrame without overengineering.
Run and verify this static HTML/CSS/JS teaching repo in WSL with minimal setup. Use when students need to confirm environment basics (git/python3/shell), launch local preview, fix path or static-serving issues, and keep stage-0 changes minimal.
| name | canvas-rendering-basics |
| description | Draw the early-stage Dino scene with Canvas API using simple primitives. Use when students are at render-focused stages and need help with canvas setup, coordinate placement, draw order, and minimal readable edits in main.js. |
Guidance for drawing the initial world (ground + placeholder dino) using simple Canvas API calls.
Rendering is the first visible milestone and foundation for later movement/collision.
main.jsindex.html (canvas sizing)style.css (container display)getContext("2d") fails due wrong canvas idcanvas and ctx are not null"Stage 1 render only. Improve dino drawing with minimal edits in main.js and explain how to verify positions in canvas."