PRISM BREAK

공을 받는 위치가 다음 경로를 만듭니다

PRISM BREAK는 아래로 떨어지는 공을 패들로 받아 벽돌을 없애는 게임입니다. 공을 패들의 중앙에서 받는지 가장자리에서 받는지에 따라 다음 반사 방향이 달라집니다. 단순히 공 밑으로 이동하는 것에서 한 걸음 더 나아가 다음 경로를 만드는 조작입니다.

벽돌에는 내구도가 있고 연속 파괴는 콤보와 점수에 연결됩니다. 한 번 맞아도 남는 벽돌과 바로 없어지는 벽돌을 구분해서 보면 렌더링과 규칙이 어떻게 연결되는지 이해하기 쉽습니다.

엔진을 읽는 순서

dist/engine.mjs는 게임 상태, 공·패들·벽돌과 충돌을 담당합니다. app.mjs는 마우스와 키보드 입력, 화면 그리기를 맡고 HTML·CSS는 정보판과 배치를 구성합니다.

move()는 패들을 움직이고 launch()는 준비 상태에서 공을 발사합니다. step()은 시간이 흐를 때의 움직임과 충돌을 계산합니다. 같은 버튼도 준비·진행·일시정지 상태에 따라 다른 역할을 한다는 점부터 확인하세요.

숫자 하나만으로 속도를 읽지 않기

발사 속도는 325 + this.level * 35로 계산됩니다. 그 속도가 x·y 성분으로 나뉘어 공의 방향을 만듭니다. 한 축의 속도만 무작정 높이면 전체 속도뿐 아니라 각도까지 달라집니다.

벽돌의 남은 개수는 아직 내구도가 있는 항목을 세어 표시합니다. 화면 숫자만 줄이는 대신 실제 벽돌 상태를 바꿔야 그리기와 클리어 조건이 일치합니다.

직접 바꿔볼 과제: 천천히 읽는 반사각

1. launch()의 기본 속도를 조금 낮춰 패들의 중앙과 양끝에서 받는 상황을 비교합니다.
2. 다른 조건은 유지하고 공의 다음 경로를 기록합니다.
3. 속도를 원래대로 돌린 뒤 벽돌 배열이나 내구도 변화에 도전합니다.

수정할 때는 진행 중인 판을 그대로 비교하지 말고 재시작한 같은 스테이지에서 출발하는 편이 좋습니다. 이전 공의 위치와 콤보가 비교를 흐리지 않도록 하기 위해서입니다.

실행 환경에서 확인할 것

공이 벽돌 모서리를 지날 때, 패들 끝에 닿을 때, 마지막 벽돌을 지울 때를 나누어 확인합니다. 웹 글꼴은 외부 Google Fonts를 요청하지만 게임 소스 자체는 ZIP 안에 있습니다. 글꼴 연결이 되지 않는 상황과 게임 로직 오류를 혼동하지 않도록 대체 글꼴에서도 조작을 확인하세요.

python3 -m http.server 8080 --bind 127.0.0.1 --directory dist