Season 01 - 08 충돌! 경계! 그리고 작은 위기!

⚠️ Season 01 - 08 충돌! 경계! 그리고 작은 위기!

“멈춘다는 건 끝이 아니라 신호야 — 부딪힘에서 시작되는 진짜 게임 로직”

코딩스타랩 교실, 어제 만든 파란 박스가 오늘도 모니터 속을 질주하고 있었다.
딕은 이미 세상을 구하는 영웅처럼 키보드를 두드리고 있었다.
“간다! 오른쪽! 왼쪽! 부아아악—!!”

세이는 걱정스러운 얼굴로 말했다.
“딕… 그렇게 세게 누르면… 뭐가 부러질 것 같은데?”

딕은 자신만만했다.
“괜찮아! 나의 컨트롤 능력은… 으악—!”

그리고 그 순간. 파란 박스가 화면 오른쪽 끝으로 “푹!” 하고 부딪혔다.
더는 움직이지 않았다.

딕: “어… 왜 안 움직여…? 나 박았어…?”

리온은 침착하게 말했다.
“맞아. 네가 ‘충돌’을 만든 거야.”

세이는 흥미로운 얼굴로 모니터를 바라보았다.
“충돌… 그러니까 부딪히는 거구나.”

리온이 고개를 끄덕였다.
“오늘은 충돌(collision)과 경계(boundary)를 배울 거야.”

🧱 1. 화면도 ‘공간’이다

리온은 칠판에 화면 모양을 그렸다.
왼쪽 끝엔 0, 오른쪽 끝엔 400이라는 숫자가 적혔다.

“우리가 흔히 보는 2D 화면도 하나의 공간이야. 그리고 이 공간에는 ‘경계’가 있어.”

딕은 이해하려고 노력하는 표정이었다.
“그럼… 밖으로 못 나가는 거네?”

리온: “맞아. 게임 오브젝트도 벽을 무시하고 지나갈 수 없어.”


if (x > 400) {
  x = 400;
}

세이: “벽을 넘지 않게 하려면… 이렇게 막아주는 거구나.”

딕은 자기 잘못을 인정했다.
“…나 너무 세게 누른 건가?”

세이가 웃었다.
“아니야. 그건 테스트였어. 아주 중요한 실험.”

리온은 엄숙하게 선언했다.
“딕의 충돌은… 훌륭한 발견이야.”

딕은 갑자기 어깨가 으쓱해졌다.
“그렇지! 나는 천재였던 거야!”

💥 2. 충돌은 위험이자 정보다

리온이 말했다.
“충돌은 단순히 ‘멈춤’이 아니야. 그 순간 게임은 정보를 얻어.”

세이가 고개를 갸웃했다.
“정보?”

리온: “예를 들어…”


if (x <= 0) {
  console.log("왼쪽 벽 충돌!");
}

if (x >= 400) {
  console.log("오른쪽 벽 충돌!");
}

딕은 눈이 번쩍였다.
“와! 부딪힌 방향을 알 수 있는 거네?”

세이는 천천히 말했다.
“그러면… 충돌이 나쁘기만 한 건 아니네. 무언가를 알려주는 거니까.”

리온은 미소 지었다.
“맞아. 충돌은 개발자에게 ‘상황’을 알려주는 중요한 순간이야.”

🏃 3. 충돌 + 반응 = ‘위기 연출’

딕이 말했다.
“게임에서는 충돌하면… 뭐가 일어나?”

리온: “여러 반응을 줄 수 있어.”

속도 감소
튕겨 나오기
체력 감소
효과음
애니메이션
게임 오버

세이는 감탄했다.
“와… 충돌 하나로 이야기가 바뀌는구나.”

리온은 작게 웃었다.
“그래. 위기는 스토리를 만든다.”

딕: “그럼 나 아까 부딪힌 것도… 스토리였던 거네?”

세이: “응. 너 때문에 에피소드가 생겼어.”

딕은 자랑스러워하며 가슴을 폈다.
“역시… 나는 사건의 중심이야.”

🚧 4. 경계를 넘지 않게 하는 법

리온은 실제로 경계 제한 코드를 완성했다.


let x = 0;

document.addEventListener("keydown", (event) => {
  if (event.key === "ArrowRight") x += 10;
  if (event.key === "ArrowLeft") x -= 10;

  // 경계 제한
  if (x < 0) x = 0;
  if (x > 400) x = 400;

  box.style.left = x + "px";
});

세이는 미소를 지었다.
“이제 도망 못 가네?”

딕은 파란 박스를 보며 말했다.
“그래도 나는 자유롭게 달리고 싶었는데…”

리온: “게임은 규칙이 있어야 재미있어.”

세이: “맞아. 규칙이 있어야 ‘도전’이 생겨.”

딕은 생각하다가 고개를 끄덕였다.
“…그래. 인정.”

🎯 5. 오늘의 위기, 오늘의 배움

딕은 아직도 파란 박스를 바라보고 있었다.
“아까 진짜 놀랐어… 화면 밖으로 사라지는 줄 알았어.”

세이: “근데 덕분에 좋은 걸 배웠잖아.”

리온은 오늘의 핵심을 요약했다.
충돌 = 막힘
막힘 = 정보
정보 = 새로운 규칙
새로운 규칙 = 더 재밌는 게임

딕은 활짝 웃었다.
“그럼 더 박아볼게! 더 박고 더 튕기고 더 난리 치면… 더 배울 수 있겠네!”

세이: “그건… 조금만 자제하려고 해…”

리온은 다음 칸에 새 문구를 적었다.
“Season 01 - 09 속도! 가속! 감속! 움직임의 물리 법칙으로 가자!”

세이: “드디어… 속도네.”

딕: “우아아아아악!!!! 달려아아아아!!”

🌍 English Summary (≈500 words)

Season 01 - 08: “Collision, Boundary, and a Small Crisis!”
In this mission, the trio discovers how collision and boundaries work in games. Dick accidentally crashes the moving box into the edge of the screen, triggering their first “crisis.” Leon explains that collision isn’t just an obstacle but a form of information — a moment where the game detects what has happened. Sei realizes that boundaries make challenges meaningful, and Dick learns that limits create fun. They implement left/right screen limits, detect collision points, and explore how reaction logic builds tension in gameplay. This episode marks their first real encounter with game physics and storytelling through failure and response. MAKE · PLAY · DREAM.

#코딩스타랩 #충돌 #경계 #게임기초 #자바스크립트 #초등코딩 #중등코딩 #리온세이딕 #게임물리 #collision #boundary

Coding Star Lab

Season 01 - 08 충돌! 경계! 그리고 작은 위기!