js13kGames 2026 참가 후기 - PRISM HORN

js13kGames 2026

2022년부터 매년 참가했던 js13kGames에 이번에도 참가하게 되었습니다.

js13kGames는 HTML, CSS, JavaScript로 만든 게임을 ZIP 파일 기준 13KiB 안에 넣어서 제출하는 게임잼입니다. 이번이 다섯 번째 참가이니 좀 수월하지 않을까 생각했지만… 역시나 게임 하나를 끝까지 만드는 건 쉽지 않았습니다. 그리고 왜 이런 걸 시작하면 회사 업무도 갑자기 많아지며 야근 같은 게 같이 밀려오는 느낌이네요.

지금까지 만든 참가작은 이렇습니다.

• 2022 - Death Scythe
• 2023 - 13C Defense
• 2024 - 13 Maze
• 2025 - Grass Tower Defense

이번 테마는 Unicorns and Rainbows, 유니콘과 무지개였습니다. 역시 한국인인 저에겐 그닥 와닿지 않는 테마였습니다.

테마를 보고 처음 떠오른 건 유니콘 뿔에서 무지개 레이저를 쏘는 게임이었습니다. 다른 아이디어를 오래 고민하기보다는 이번에는 떠오른 걸 바로 만들어 보기로 했습니다.

그렇게 만든 게임이 PRISM HORN입니다.

화면 아래에 있는 유니콘은 움직이지 않고, 뿔의 방향과 레이저 색을 바꿔서 위에서 내려오는 적을 막는 게임입니다. 적과 같은 색으로 공격해야 하고 적이 아래 방어선까지 내려오면 실드가 줄어듭니다.

제출 페이지는 js13kGames - PRISM HORN입니다.

처음 만든 건 별로 재미가 없었다

처음에는 유니콘 뿔에서 빨강, 노랑, 초록, 파랑, 보라색 레이저가 한꺼번에 다섯 갈래로 나가게 만들었습니다.

화면은 화려했습니다. 테마에도 잘 맞는 것 같았습니다. 그런데 직접 해보니 그냥 뿔을 좌우로 흔들기만 하면 됐습니다. 어차피 모든 색이 계속 나가고 있으니 색을 고를 이유도 없고, 어느 적을 먼저 잡을지 고민할 필요도 없었습니다.

보기엔 게임 같은데 해보면 별로 할 게 없는 상태였습니다.

결국 다섯 레이저를 없애고 한 번에 한 색만 쏘게 바꿨습니다. 숫자 키나 Q/E로 색을 바꾸고, 방향을 맞춘 다음 발사해야 합니다. 조준하는 방향이 안 보이면 너무 답답해서 얇은 조준선도 추가했습니다.

다섯 갈래 레이저가 훨씬 화려하긴 했지만, 한 색씩 고르도록 바꾸고 나서야 게임을 하는 느낌이 났습니다.

가까이 온 적을 못 맞히는 문제

유니콘은 고정 포대라서 이동할 수 없습니다. 그래서 뿔만 좌우로 회전하게 만들었는데, 처음에는 뿔이 몸을 뚫고 돌아가지 않도록 각도를 꽤 좁게 제한했습니다.

그런데 적이 화면 가장자리로 내려오면 방어선에 닿기 전인데도 공격할 방법이 없었습니다. 뿔이 더 이상 돌아가지 않으니 그냥 실드가 깎이는 걸 보고 있어야 했습니다.

각도 제한을 넓히면 뿔이 머리에 어색하게 붙는 문제가 있었고, 제한을 유지하면 플레이하는 입장에서 억울해졌습니다. 결국 뿔 아래쪽을 둥글게 만들고 회전 범위를 넓혔습니다. 방어선 가까이 내려온 적에는 조준 판정도 조금 보정했습니다.

게임이 어려운 것과 조작상 잡을 수 없는 것은 다른 문제라서 이 부분은 꽤 여러 번 수정했습니다.

유니콘이 아니라 돼지처럼 보였다

그래픽은 별도 이미지 없이 Canvas 도형으로 그렸습니다.

처음 만든 유니콘은 얼굴이 너무 둥글고 코가 짧아서 계속 돼지처럼 보였습니다. 귀 위치도 바꿔보고 얼굴을 조금 길게 만들고, 주둥이와 콧등도 나눠서 그렸습니다. 거의 노가다였네요. 좌표 계산 같은 것에 약하기 때문에 수정하고 눈으로 보고 수정하고 눈으로 보는 노가다였습니다.

뿔은 게임에서 가장 중요한 부분이라 여러 색의 마디를 넣고, 발사할 때 빛나도록 만들었습니다. 회전해도 덜 어색하도록 밑부분에는 둥근 회전축도 추가했습니다.

이미지를 넣으면 더 예쁘게 만들 수 있었겠지만 용량을 생각하면 도형으로 그리는 편이 나을 것 같았습니다. 대신 코드를 줄일 때마다 유니콘의 귀나 뿔이 사라질까 봐 계속 확인해야 했습니다.

로그라이크 강화를 넣어보기

적의 색을 맞춰 쏘는 것만 계속 반복하다 보니 금방 단조로워졌습니다. 그래서 적을 잡아 경험치를 얻고, 레벨업하면 세 가지 강화 중 하나를 선택하는 로그라이크 방식을 넣었습니다.

처음에는 발사 속도 증가나 공격 범위 증가처럼 숫자만 바뀌는 강화가 대부분이었습니다. 실제로는 강해졌는데 플레이할 때 티가 잘 안 났습니다.

그래서 화면에서 바로 보이는 능력을 추가했습니다.

• 일정 시간마다 자동으로 공격하는 색 포털
• 레이저가 두 갈래, 세 갈래로 나가는 강화
• 하나의 레이저에 여러 색을 섞는 강화
• 공격 속도, 공격 범위, 감속, 실드 강화
• 특정 강화끼리 조합했을 때 생기는 시너지

강화를 고른 뒤 포털이 생기거나, 레이저가 갈라지거나, 여러 색을 동시에 공격할 수 있게 되니 그제야 로그라이크 게임처럼 이번 판이 강해지고 있다는 느낌이 났습니다.

강화 카드도 완전히 무작위로만 나오게 했더니 공격 강화가 하나도 안 나오는 판이 있었습니다. 현재는 공격 관련 카드가 적어도 한 장 나오고, 실드가 낮으면 회복 카드가 조금 더 잘 나오도록 보정했습니다.

적이 겹치고 화면이 복잡해졌다

적을 무작위 위치에 계속 생성했더니 같은 자리에 여러 마리가 겹치는 일이 많았습니다. 색도 다르고 모양도 다른 적이 포개져 있으니 어떤 색으로 공격해야 할지도 알아보기 어려웠습니다.

일반 적은 화면에 보이지 않는 일곱 개 차선 중 비어 있는 곳을 찾아서 나오게 바꿨습니다. 대신 중간중간 같은 색 세 마리가 세로로 나오거나, 다섯 색이 나란히 나오는 대형은 따로 넣었습니다.

무작위 적이 겹치는 건 알아보기 힘들었지만, 일부러 나란히 나온 적을 한 번에 맞히는 건 재미가 있었습니다. 같은 현상처럼 보여도 하나는 실수였고 하나는 콤보를 만들기 위한 패턴이었습니다.

난이도를 올리는 것도 생각보다 어려웠습니다. 적 속도와 생성 속도, 엘리트 확률을 전부 같이 올렸더니 중간부터 갑자기 감당할 수 없을 정도로 어려워졌습니다. 지금은 화면에 나올 수 있는 적 수에 제한을 두고, 보스를 잡은 뒤에는 잠깐 적이 나오지 않는 시간을 넣었습니다.

보스

첫 번째 보스는 색 보호막을 순서대로 공격하는 방법을 알려주는 보스입니다. 화면 가운데로 천천히 내려오고, 현재 보호막과 같은 색으로 공격해야 합니다.

처음 만든 보스는 너무 느린데 보호막은 적어서, 화면 위에서 한참 내려오다가 금방 죽었습니다. 첫 보스는 설명용으로 조금 여유를 두고, 두 번째 보스부터는 좌우로 빠르게 움직이면서 내려오도록 바꿨습니다. 뒤로 갈수록 보호막 수도 늘어납니다.

보스를 잡으면 일반 레벨업보다 강한 보상 중 하나를 고를 수 있습니다. 보스가 너무 약하면 보상이 공짜처럼 느껴지고, 너무 빠르면 색을 바꾸기도 전에 끝나서 이 부분은 제출 전까지 조금 더 조절할 것 같습니다.

소리와 13KiB

이미지와 음원 파일은 사용하지 않았습니다. 그래픽은 Canvas 2D로 그리고, 배경음과 효과음은 Web Audio API의 오실레이터로 만들었습니다.

예전 참가작에서는 mp3 효과음을 넣고 용량을 줄이느라 음질이 이상해졌던 기억이 있습니다. 이번에는 음원 파일이 없으니 그 문제는 없었지만, 코드로 만든 배경음이 너무 작아서 한동안 소리가 거의 안 들리는 문제가 있었습니다.

개발할 때는 읽을 수 있는 game.js로 작업하고 제출 파일을 만들 때 Terser로 압축했습니다. 기능을 하나 넣고 압축하고, 몇 바이트 넘으면 문구나 중복 코드를 줄이고 다시 압축하는 일을 계속 반복했습니다.

현재 ZIP 파일은 13,304바이트입니다. 13KiB 제한이 13,312바이트이니 남은 용량은 8바이트이긴 한데, 매번 이미지를 쓰다가 안 쓰니 용량에 대해서는 좀 넉넉한 느낌이네요.

매년 이미지 해상도를 내리고 코드 줄이고 별걸 다 했던 기억이 나네요.

후기

처음에는 유니콘 뿔에서 무지개 레이저가 나가면 테마에도 잘 맞고 만들기도 간단하겠다는 생각으로 시작했습니다.

하지만 다섯 색 레이저를 한꺼번에 쏘니 재미가 없었고, 색을 하나씩 고르도록 바꾸니 이번에는 너무 어려웠습니다. 강화를 많이 넣으니 게임 방식이 사라졌고, 적을 많이 넣으니 화면이 안 보였습니다. 하나를 고치면 다른 문제가 생겨서 계속 만들었다기보다는 조절했다는 표현이 더 맞는 것 같습니다.

그래도 과거 참가작들보다는 메인 화면, 게임오버, 보스, 레벨업 같은 기본적인 흐름은 더 갖춘 게임이 된 것 같습니다.

Canvas로 유니콘을 그리는 것도 생각보다 재미있었고, 13KiB 안에서 어디까지 넣을 수 있는지 계속 시험해 보는 과정도 재미있었습니다.

100등 안에 들어가서 굿즈를 받는 게 목표인데 과연 어찌 될까요. ㅎㅎ

개인적으로 예전 굿즈 중 js13kGames 배지가 가방에서 떨어져서 잃어버린 후로 애타게 다시 받고 싶은데… 작년에는 주사위… 이제 배지는 굿즈로 오지 않는 건지… 잃어버린 배지가 더 그립습니다.