geometryCloneTemplate

지오메트리 대시 클론 코딩 템플릿

실행 방법

index.html 파일 하나로 게임 전체가 구성되어 있습니다.

# 아무 HTTP 서버로 실행 (file:// 직접 열기는 안됨)
python3 -m http.server 8080
# 브라우저에서 http://localhost:8080 접속

파일 구조

index.html   ← 게임 전체 (HTML + CSS + JS 한 파일)
sound/       ← BGM·효과음 mp3 파일들
img/         ← 참고 이미지

index.html 구조 (수정 가이드)

위치	내용
<style> 태그	화면 디자인(색상·버튼·HUD)
/* mapGen.js */ 섹션	맵 생성 알고리즘, 장애물 패턴, 난이도
/* screens.js */ 섹션	시작·캐릭터선택·클리어·실패 화면 HTML
/* game.js */ 섹션	게임 루프, 물리, 충돌, 렌더링, 오디오

지오메트리 대시란?

사용자는 캐릭터를 선택해 아케이드 게임을 진행.

• 클론 코딩할때 비트/도트로 모든 맵과 캐릭터를 제작해서 저작권 문제없이 진행.
• 브금과 효과음은 /sound 참고
• 캐릭터마다 스테이지는 총 4개

가능한 캐릭터

• 기본캐릭(사각형): 점프 가능(모바일: 사용자 화면 클릭, PC: 스페이스 누르면)
• 우주선: 위로만 올라감(모바일: 사용자 화면 꾹 누름, PC, 스페이스 길게 누름)

맵 - 플레이 화면

캐릭터를 선택하면 순차적으로 스테이지를 제공함. 스테이지 안에 장애물과 플랫폼(점프 발판, 가속/감속 등 기능이 있고 화살표로 기능 표현)이 랜덤하게 나옴. 대신 사용자가 깰 수 있는 길이 있어야해 어느정도의 맵제작 알고리즘은 필요함. 반복해서 시도하는 중에는 맵이 바뀌지 않고, 다음 단계로 넘어가면 맵이 바뀜. 진행 중에는 상단 진행률바가 진행되야함.

성공/실패

맵 끝까지 가면 클리어. 맵마다 클리어하면 해당 맵을 몇번 시도했는지와 걸린 시간이 나옴. 실패하면 몇퍼센트까지 왔는지 알려주고, 해당 맵을 다시 진행할건지 물어봄.