Season 01 - 10 중력! 점프! 떨어짐!

🪂 Season 01 - 10 중력! 점프! 떨어짐!

“뛰어오르는 순간은 짧고, 내려오는 순간은 길다 — 그래서 게임은 더 재밌어진다!”

코딩스타랩 교실. 오늘은 시작도 전에 난리가 났다. 딕이 의자에 올라가서 외쳤다.
“오늘은 점프한다!!! 나도 점프!!! 게임도 점프!!! 다 같이 점프!!!!”

세이가 급히 말했다.
“딕! 떨어지면… 아파!”

딕은 내려오다 진짜로 발목을 삐끗했다.
“으억… 이게… 중력인가…?”

리온은 아주 침착하게 말했다.
“맞아. 지금 네 몸이 정확히 오늘 주제야.”

세이는 걱정과 웃음 사이에서 말했다.
“…딕아, 이번 회차는 너네 몸으로 설명할 필요 없어.”

리온은 칠판에 크게 적었다.
gravity (중력)

🌍 1. 중력은 ‘떨어지려는 힘’

리온은 손에 작은 고무공을 들고 있었다. 그는 조용히 공을 떨어뜨렸다. 툭— 바닥에 닿는 소리가 교실에 울렸다.

“중력은 늘 아래로 끌어당겨.”

딕은 크게 고개를 끄덕였다.
“맞아… 아까 내 발도 아래로… 바로… 내려갔어…”

세이는 부드럽게 말했다.
“떨어지는 건 아프지만… 그게 자연이야.”

리온은 중력 코드를 칠판에 적었다.


let y = 0;
let gravity = 1;  // 중력

function update() {
  y = y + gravity; // 계속 아래로 끌림
}

딕: “와… 이러면 계속 떨어지네?”

리온: “그래서 중력엔 ‘바닥’이 필요해.”

🧱 2. 바닥은 ‘멈추게 만드는 경계’

세이: “그럼 끝없이 떨어지는 건 아니네?”

리온은 아래 코드를 적었다.


let ground = 300;

if (y > ground) {
  y = ground; // 바닥에서 멈춤
}

딕은 생각했다.
“아… 그래서 내가 딱 멈춘 거구나…”

세이는 의자를 가리키며 말했다.
“너는... 바닥과 충돌을 배운 거야.”

리온: “맞아. 중력 + 충돌 = 현실적인 움직임.”

🦘 3. 점프는 ‘반대 방향으로 힘을 주는 것’

딕은 손을 번쩍 들었다.
“중력은 떨어지는 힘이잖아?! 그럼 점프는 떨어지지 않게 하는 힘?!”

리온: “거의 맞아. 점프는 중력의 반대 방향으로 ‘순간적인 힘’을 주는 거지.”

세이: “순간적으로 위로…?”

리온은 코드를 적었다.


if (jumpKeyPressed) {
  yVelocity = -15; // 위로 튀어 오름
}

딕은 감탄했다.
“마이너스면… 위로?!”

리온: “그래. 좌표계에서는 위쪽이 마이너스야.”

세이: “그럼 점프하는 동안은 중력과 싸우는 거네.”

리온: “맞아. 하지만 중력이 결국 이기지.”

딕: “그게… 현실적이네…”

🪂 4. 떨어짐은 ‘중력의 승리’

리온은 손가락으로 작은 곡선을 그렸다.
위로 올라갔다 내려오는 포물선.


yVelocity += gravity; // 다시 아래로 끌림
y += yVelocity;

세이는 아름답다는 듯 말했다.
“점프는… 상승이 짧고, 하강이 길어. 인생 같다…”

딕: “그렇지! 나도 올라갈 땐 ‘우와아!!’ 했는데 내려올 때는 ‘히이익…’ 했어.”

리온: “중력은 늘 아래로 끌어. 그래서 점프는 잠깐이야.”

🦅 5. 모든 걸 합쳐서 — 진짜 점프 구현!

리온은 오늘의 결론이 적힌 최종 코드를 보여줬다.


let y = 300;
let yVelocity = 0;
let gravity = 1;
let jumpPower = -15;

document.addEventListener("keydown", (e) => {
  if (e.key === " ") {      // 스페이스바
    if (y === 300) {        // 바닥에 있을 때만
      yVelocity = jumpPower;
    }
  }
});

function update() {
  yVelocity += gravity;
  y += yVelocity;

  if (y > 300) {            // 바닥 충돌
    y = 300;
    yVelocity = 0;
  }

  box.style.top = y + "px";
  requestAnimationFrame(update);
}

update();

딕은 벌떡 일어났다.
“오오오!!! 진짜 뛴다!!! 파란 박스가 진짜 뛴다고!!!”

세이는 살짝 웃었다.
“근데 네가 뛰는 것보다 안정적이네…”

리온은 조용히 말했다.
“게임의 점프는 짧고, 정확하고, 아름답지.”

딕: “나도 그렇게 뛰고 싶어…”

세이는 딕을 보며 말했다.
“너는 그냥 조심해서 내려와.”

그리고 리온은 다음 칸에 적었다.
“Season 01 - 11 애니메이션! 타이밍! 그리고 ‘진짜 게임 느낌’ 만들기!”

딕: “좋아!!! 점프 다음은… 모션이지!!!”

세이: “드디어 화면이 살아서 움직이는 거야…”

리온: “진짜 게임 느낌을 만들어보자.”

🌍 English Summary (≈500 words)

Season 01 - 10: “Gravity, Jump, and Fall!”
In this episode, the trio learns how gravity pulls objects down, how a jump creates a brief moment of upward force, and how falling is the natural result of gravity overcoming that force. They implement gravity, ground collision, velocity, jump power, and falling behavior in JavaScript. Dick becomes the first “gravity tester,” Sei makes emotional connections, and Leon explains the physics behind movement. This marks their first complete vertical motion system — the foundation of platformer games and advanced physics. MAKE · PLAY · DREAM.

#코딩스타랩 #점프 #중력 #떨어짐 #게임물리 #초등코딩 #중등코딩 #리온세이딕 #gravity #javascript기초 #platformer

Coding Star Lab

Season 01 - 10 중력! 점프! 떨어짐!