NEON CIRCUIT
코너가 이어지는 도로에서 가속과 부스트를 조절하는 레이싱 게임입니다. 화면의 속도감과 실제 주행 계산이 어떻게 나뉘는지 소스로 살펴봅니다.
읽어볼 코드 가속·코너 곡률·부스트·랩 판정
AI TOOLS LAB · WEB GAME SOURCES
게임 한 편을 열면,
코드가 보입니다.
작은 고전풍 게임으로 배우는 웹 개발.
실제 화면을 살펴보고, 소스를 내려받아 나만의 규칙으로 바꿔보세요.
READ → RUN → REMIX
어떤 코드를 열어볼까요?
카드는 실제 게임 캔버스 이미지입니다.
동네북 · 골목 대모험
작은 캐릭터가 골목을 달리며 장애물을 넘고 코인을 모으는 러너입니다. 자동 이동과 두 번의 점프만으로 플레이를 구성하는 방법을 읽어봅니다.
읽어볼 코드 자동 이동·2단 점프·코인과 장애물 배치
BOMB GRID
상자를 부수며 탈출 경로를 만드는 폭탄 미로 게임입니다. 격자 이동, 십자 폭발과 연쇄 반응이 작은 규칙에서 어떻게 만들어지는지 살펴봅니다.
읽어볼 코드 격자 충돌·폭발 범위·연쇄 반응
BUBBLE HOP
발판을 오르내리며 적을 비눗방울에 가두는 플랫폼 게임입니다. 이동·점프·포획을 분리해 작은 액션 규칙을 조합하는 방식을 살펴봅니다.
읽어볼 코드 플랫폼 배치·점프·포획 상태 전환
IRON OUTPOST
적 전차를 막으면서 기지를 지키는 방어 게임입니다. 캐릭터의 생존과 기지의 생존을 다른 상태로 관리하는 설계를 코드로 읽어봅니다.
읽어볼 코드 포탄·격자 이동·기지와 전차의 별도 내구도
NEON CLASH
옥상에서 두 캐릭터가 맞붙는 대전 액션입니다. 공격의 준비·판정·회복 시간을 분리해 손맛과 빈틈을 만드는 방법을 소스로 살펴봅니다.
읽어볼 코드 공격 타이밍·타격 범위·라운드 상태
NEON MAZE
빛 조각을 모으며 추격자를 피하는 미로 게임입니다. 칸 단위 이동, 경로 연결과 여러 추격 성향을 분리해 읽는 학습 자료입니다.
읽어볼 코드 미로 연결·선입력·수집 상태·추격 성향
PRISM BREAK
패들로 공을 받아 벽돌을 지우는 게임입니다. 공이 닿은 위치에 따라 반사 방향이 달라지는 원리와 벽돌 내구도를 함께 살펴봅니다.
읽어볼 코드 공 반사·패들 위치·벽돌 내구도·콤보
PRISM POP
같은 색 버블을 연결하고 천장과 끊어진 묶음을 떨어뜨리는 퍼즐입니다. 육각형 이웃 관계와 연결 탐색을 실제 게임 소스로 배워봅니다.
읽어볼 코드 육각 이웃·같은 색 연결·천장 연결 검사
STAR SWARM
편대를 이루는 적을 피하고 격파하는 우주 슈팅 게임입니다. 적 생성, 대기·돌진 상태와 웨이브 전환을 나누어 읽을 수 있습니다.
읽어볼 코드 적 편대·등장 간격·돌진 상태·웨이브
읽고, 내려받고, 하나씩 바꾸세요.
- 설명 읽기조작법과 파일 역할, 게임별 설계 포인트를 확인합니다.
- 로컬에서 실행ZIP을 풀고 README의 정적 서버 명령으로 엽니다.
- 한 가지씩 수정속도·배치·규칙을 하나씩 바꾸며 차이를 비교합니다.
이 페이지에서는 게임을 실행하지 않습니다. 별도 API 키나 npm 설치 없이 내려받은 파일로 시작할 수 있으며, 로컬 서버 실행 도구는 필요합니다.
다운로드 자료의 이용 범위
이 ZIP에 포함된 AI Tools Lab 제작 소스와 게임 에셋은 개인·상업 목적으로 사용, 복제, 수정, 재배포할 수 있습니다. 저작권 소유권이 양도되는 것은 아닙니다. 이 허락은 AI Tools Lab 사이트의 다른 콘텐츠에는 적용되지 않습니다. 포함되지 않은 외부 폰트·상표 등 제3자 자료는 각 권리자의 조건을 따릅니다.
개별 ZIP에는 실행 가능한 소스, 게임 에셋, 한국어 README, 이용 안내와 파일 체크섬이 들어 있습니다. 전체 묶음에는 동일한 개별 ZIP 10개가 담겨 있습니다.
게임의 기본 실행을 로컬 브라우저에서 확인했습니다. 모든 기기·스테이지의 동작을 보증하는 자료는 아닙니다. 오류·개선 의견 보내기 →