목록 · 가이드
클로드로 인기 게임앱 만들기
탭 한 번으로 쌓는 '도도리 타워' 제작기
클로드 코드에 세 번 부탁해서 앱 장터의 인기 게임 같은 원터치 쌓기 게임 한 편을 만들었습니다. 이름은 도도리 타워입니다. 파일 하나 822줄이고, 설치 없이 휴대폰 브라우저에서 바로 돕니다. 아래는 무엇을 부탁했고 클로드가 무엇을 만들었는지, 그 과정 전부입니다.
- 준비물클로드 코드(또는 클로드 앱)와 "탭 한 번으로 하는 게임" 이라는 한 줄
- 하는 일부탁 세 번. 규칙과 손맛, 매일 오게 하는 장치, 친구와 같이 하는 방
- 얻는 것오늘의 탑·무한 모드·다 같이 모드가 든 게임 파일 하나
- 사람 몫직접 해 보고 손맛을 고르는 일. 규칙을 정하는 것도 사람입니다
부탁은 세 번이지만 한 번에 여러 가지가 들어갔습니다. 첫 부탁에 앞의 세 칸, 둘째 부탁에 넷째 칸, 셋째 부탁에 다섯째 칸이 들어갔고, 올리기는 세 번 모두 따라붙었습니다.
누가, 어디에 쓰면 좋은가
이 과정은 코드를 짜 본 적이 없어도 게임 한 편을 내놓고 싶은 분께 맞춰 적었습니다. 큰 게임이 아니라 한 판에 30초, 규칙이 한 줄인 게임입니다.
맞지 않는 경우도 있습니다. 3D 액션이나 캐릭터가 많은 게임, 결제와 계정이 들어가는 게임은 이 글의 범위 밖입니다. 앱 장터에 정식으로 올리려면 앱 포장과 심사가 따로 필요합니다.
왜 쌓기 게임인가
앱 장터 인기 순위에 자주 오르는 원터치 게임들을 보면 공통점이 네 가지로 보입니다. 규칙은 한 줄이고, 한 판은 짧고, 점수로 자랑하고, 내일 다시 올 이유가 있습니다. 쌓기 게임은 넷을 모두 갖춘 장르입니다. 움직이는 블록을 탭해 멈추고, 어긋난 만큼 잘려 나가며, 블록이 없어지면 끝납니다.
클로드에게 맡기기에도 알맞습니다. 그림 파일 없이 도형과 색으로 그릴 수 있고, 소리도 파일 없이 만들 수 있어서 결과가 파일 하나로 끝납니다. 사람은 해 보고 "이 손맛이 맞다" 만 고르면 됩니다.
게임 한 편, 여섯 단계
부탁은 클로드 코드에서 했습니다. 아래 나 칸의 부탁은 실제 작업 기록(커밋 세 건)을 바탕으로 다시 정리한 것이고, 클로드가 만든 것 칸은 게임 코드에서 확인한 사실입니다. 부탁문 원문은 끝의 복사용 부탁문에 있습니다.
장르와 규칙 한 줄
탭 한 번으로 하는 게임의 규칙과 화면"움직이는 블록을 탭해서 내려놓습니다. 어긋난 만큼 잘리고, 딱 맞추면 퍼펙트입니다."
블록은 좌우로 번갈아 150만큼 오가고, 층이 오를수록 빨라집니다. 화면은 캔버스에 비스듬히 내려다보는 등각 방식으로 그렸습니다. 블록 색은 층마다 조금씩 돌고, 하늘색도 높이에 따라 천천히 바뀝니다.
손맛: 퍼펙트와 소리와 진동
한 판 더 하고 싶게 만드는 되돌림- 오차 5 안쪽이면 퍼펙트. 퍼펙트가 이어질수록 음이 한 칸씩 올라갑니다
- 퍼펙트가 4번 이어지면 잘려 나간 블록이 6씩 되살아납니다
- 소리는 브라우저 안의 Web Audio 로 합성했습니다. 소리 파일은 하나도 없습니다
- 휴대폰은 퍼펙트에 짧게, 실패에 세 번 끊어 떨립니다. 실패하면 화면이 흔들립니다
사람이 고를 곳입니다. 퍼펙트 폭(5)과 되살아나는 조건(4번)은 직접 해 보며 정하십시오. 너무 너그러우면 금방 지루해지고, 너무 빡빡하면 첫 판에 떠납니다.
매일 오게: 오늘의 탑과 결과 공유
날마다 모두에게 같은 탑, 단톡방에 붙일 결과 문구오늘의 탑: 한국 시간 날짜로 난수를 정해, 그날은 누구에게나 같은 탑이 나옵니다. 층마다 출발 방향과 속도가 그 난수를 따릅니다. 자정이 지나면 새 탑이 열립니다.
결과 공유: 결과가 먼저, 링크는 맨 끝입니다. 단톡방 미리보기에서 숫자가 먼저 보이게 하려는 것입니다.
도도리 타워 오늘의 탑 9월 28일 🏗️ 24층 · 퍼펙트 19번 · 최대 콤보 4 🟨🟨🟨🟨🟨 나보다 높이 쌓을 수 있습니까?무한 모드는 판마다 다른 탑입니다. 기록은 이 휴대폰에만 남깁니다.
같이 하게: 다 같이 모드
2~6명이 탑 하나를 번갈아 쌓는 대결처음에는 휴대폰 한 대를 돌려 가며 하는 방식이었습니다. 차례마다 자기 색 블록이 나오고, 이름을 적고, 순위표와 공유 문구가 붙었습니다.
이 방식은 다음 부탁에서 각자 휴대폰으로 들어오는 방식으로 바뀌었습니다. 휴대폰 한 대를 돌리면 한자리에 모여야만 할 수 있기 때문으로 보입니다.
첫 판이 정답은 아닙니다. 이 단계의 방식은 바로 다음 부탁에서 바뀌었습니다. 게임은 해 봐야 알 수 있어서, 바꿀 각오로 빨리 만들어 보는 편이 빠릅니다.
온라인 방: 방 코드·QR·초대 링크
각자 휴대폰으로 들어와 실시간으로 같이 쌓는 방- 방은 사이트의 다른 미니게임이 쓰던 방 장치(room.js)를 그대로 다시 썼습니다
- 모든 휴대폰이 같은 난수로 탑을 똑같이 계산하고, 차례인 사람이 탭한 위치만 방에 알립니다
- 방장 휴대폰이 심판입니다. 나간 사람과 20초 동안 누르지 않은 사람은 탈락입니다
- 일곱 번째로 들어온 사람부터는 관전합니다. "한 판 더" 는 방장만 누릅니다
- 방에 들어갈 때만 실시간 연결(Supabase)과 QR 코드 도구를 불러옵니다. 혼자 모드는 외부 스크립트 없이 돕니다
올리기: 주소와 검색
games.worlddrop.app/tower.html 한 주소게임 모음 맨 앞에 카드를 넣고, 게임 주소를 Vercel 설정에 연결하고, 사이트맵에 한 줄을 더했습니다. 검색 엔진이 읽는 구조화 데이터에는 게임 이름과 인원(1~6명)을 적었습니다.
완성한 게임 화면
휴대폰 390px 화면에서 찍었습니다. 첫 화면에서 모드를 고르고, 탭으로 쌓고, 끝나면 기록과 공유 단추가 나옵니다.
숫자로 본 도도리 타워
게임 파일과 작업 기록에서 센 숫자입니다.
바쁘시면 이 여섯 줄만
클로드 코드나 클로드 앱의 한 대화에 차례로 넣으면 됩니다. 다만 이 여섯 줄은 요약입니다. 결과를 가르는 조건(외부 라이브러리 없이, 한국 시간 기준, 차례인 사람만 탭)을 다 붙인 원문은 회원에게 열어 드립니다.
- 탭 한 번으로 하는 쌓기 게임을 파일 하나로. 그림·라이브러리 없이
- 퍼펙트·연속 퍼펙트·실패마다 소리, 진동, 화면 반응을 다르게
- 한국 시간 날짜로 모두에게 같은 "오늘의 탑", 결과가 먼저 나오는 공유 문구
- 탑 하나를 번갈아 쌓고 떨어뜨리면 탈락하는 다 같이 모드
- 방 코드·QR 로 각자 휴대폰에서 들어오는 온라인 방, 차례인 사람만 탭
- 모음 화면 카드, 게임 주소, 사이트맵, 구조화 데이터
- 조건을 다 붙인 부탁문 원문 6개
- 단계마다 한 번 더 물을 질문 6개
- 게임 이름과 장르만 바꾸면 그대로 도는 빈칸
복사용 부탁문 여섯 개
형광 칠한 대괄호만 내 게임으로 바꾸고 1번부터 차례로 붙여 넣으십시오. 매 단계 뒤에 직접 해 보고, 마음에 안 드는 곳을 한 줄로 말하면 됩니다.
부탁문 원문은 회원에게 열어 드립니다
과정과 완성 화면, 여섯 줄 요약은 누구나 보실 수 있습니다. 복사 단추가 달린 원문은 로그인하시면 나옵니다. 가입은 무료이고 결제 수단을 받지 않습니다.
- 여섯 단계 부탁문 원문. 누르면 복사됩니다
- 단계마다 한 번 더 물을 질문 여섯 개
- 게임 이름과 장르만 바꾸면 그대로 도는 빈칸
이미 회원이시면 로그인하십시오. 읽던 자리로 돌아옵니다.
[게임 이름]이라는 원터치 [장르] 게임을 휴대폰 브라우저용 HTML 파일 하나로 만들어 주십시오. 규칙은 한 줄입니다. [규칙 한 줄]. 그림 파일과 외부 라이브러리는 쓰지 말고, 도형과 색으로 캔버스에 그려 주십시오. 한 판은 30초 안팎이 되게, 층이 오를수록 조금씩 빨라지게 해 주십시오. 첫 화면에는 제목, 한 줄 설명, 시작 단추만 두십시오.
처음 해 보는 사람이 첫 판에서 몇 층쯤 쌓을지 어림하고, 너무 어렵거나 쉬우면 속도를 고쳐 주십시오.
딱 맞췄을 때 기분이 좋아야 합니다. 거의 맞춘 경우를 퍼펙트로 쳐 주고, 퍼펙트가 이어질수록 소리의 음을 한 칸씩 올려 주십시오. 퍼펙트가 몇 번 이어지면 잘려 나간 블록이 조금 되살아나게 해 주십시오. 소리는 파일 없이 Web Audio 로 만들고, 휴대폰은 퍼펙트와 실패에 다른 길이로 진동하게 해 주십시오. 실패하면 화면을 짧게 흔들어 주십시오. 소리 끄는 단추도 두십시오.
퍼펙트 폭과 되살아나는 조건을 지금 값과 반값, 두 배로 바꿔 볼 수 있게 맨 위에 숫자로 모아 주십시오.
내일 다시 올 이유를 만들어 주십시오. 한국 시간 날짜로 난수를 정해, 그날은 누구에게나 같은 탑이 나오는 "오늘의 탑" 모드를 넣어 주십시오. 판마다 다른 무한 모드도 따로 두십시오. 끝나면 결과를 단톡방에 붙일 공유 문구를 만들어 주십시오. 결과 숫자가 먼저, 링크는 맨 끝에 두고, 휴대폰은 공유 창을, PC 는 복사를 쓰게 해 주십시오. 기록은 이 기기에만 저장하십시오.
공유 문구를 단톡방 미리보기에서 첫 두 줄만 보인다고 치고 다시 다듬어 주십시오.
[인원]명이 탑 하나를 차례로 쌓는 다 같이 모드를 넣어 주십시오. 차례마다 그 사람 색의 블록이 나오고, 떨어뜨린 사람이 탈락하고, 마지막 한 명이 이깁니다. 차례가 바뀔 때 누구 차례인지 크게 보여 주고, 끝나면 순위표와 공유 문구를 보여 주십시오.
이 방식으로 실제 모임에서 해 본다고 치고, 가장 먼저 불편할 곳 하나를 짚어 주십시오.
다 같이 모드를 온라인 방으로 바꿔 주십시오. 방 코드, QR, 초대 링크로 각자 휴대폰에서 들어옵니다. 모든 휴대폰이 같은 난수로 탑을 똑같이 계산하고, 차례인 사람이 탭한 위치만 방에 알려 주십시오. 차례인 휴대폰에서만 탭이 먹히고 나머지는 실시간으로 지켜봅니다. 방장이 심판을 보고, 나간 사람과 [초]초 동안 누르지 않은 사람은 탈락입니다. 실시간 연결은 [Supabase Realtime]을 쓰고, 혼자 하는 모드는 외부 스크립트 없이 그대로 두십시오.
인터넷이 잠깐 끊긴 사람이 다시 들어오면 어떻게 되는지 설명하고, 게임이 멈추지 않게 고쳐 주십시오.
이 게임을 [내 사이트]에 올려 주십시오. 게임 모음 화면에 카드를 넣고, [게임 주소]로 바로 열리게 하고, 사이트맵에 더하고, 검색 엔진이 읽는 구조화 데이터(VideoGame)에 이름·설명·인원을 적어 주십시오. 공유했을 때 보일 제목·설명·대표 이미지도 넣어 주십시오.
올린 주소를 휴대폰 화면 크기로 열어 첫 화면과 끝 화면을 찍어 보여 주십시오.
자주 묻는 질문
코딩을 몰라도 클로드로 게임을 만들 수 있나요?
이 글 정도의 게임이라면 됩니다. 도도리 타워의 작업 기록(커밋 세 건)은 모두 클로드 코드 세션에서 나왔습니다. 사람이 할 일은 부탁하고, 해 보고, 고칠 곳을 한 줄로 말하는 것입니다. 다만 무엇이 재미있는지는 직접 해 봐야 알 수 있습니다.
클로드 코드와 클로드 앱 가운데 무엇을 쓰나요?
파일 하나로 끝나는 1~3단계는 클로드 앱의 아티팩트로도 됩니다. 만든 게임을 바로 해 볼 수 있습니다. 온라인 방과 사이트 올리기(5~6단계)는 파일 여러 개와 설정을 다뤄서 클로드 코드가 편합니다. 둘의 차이는 클로드 코워크·코드·아티팩트 사용법에 있습니다.
앱 장터(앱스토어·플레이스토어)에 올릴 수 있나요?
이 글의 결과는 웹 게임입니다. 앱 장터에 올리려면 웹 게임을 앱으로 포장하는 과정과 장터 심사가 따로 필요합니다. 먼저 웹 주소로 반응을 본 뒤 포장하는 순서를 권합니다.
오늘의 탑은 어떻게 모두에게 같은 탑이 나오나요?
한국 시간 날짜(예: 2026-09-28)를 숫자로 바꿔 난수의 씨앗으로 씁니다. 씨앗이 같으면 난수열이 같아서, 층마다 출발 방향과 속도가 모두에게 똑같이 나옵니다. 서버가 없어도 됩니다.
온라인 방에는 서버가 필요한가요?
필요합니다. 도도리 타워는 Supabase 의 실시간 기능(Broadcast·Presence)을 씁니다. 방과 사람을 데이터베이스에 저장하지 않고, 방에 있는 동안만 신호를 주고받습니다. 혼자 하는 모드는 서버 없이 돕니다.
매장 이벤트용으로 색과 이름을 바꿔도 되나요?
됩니다. 1번 부탁의 게임 이름과 규칙을 바꾸고, 2번 뒤에 "블록 색을 [브랜드 색]으로" 한 줄을 더하십시오. 경품을 걸 때는 "오늘의 탑" 결과 화면을 캡처해 보여 주는 방식이 가장 간단합니다.
챗GPT 나 제미나이에서도 되나요?
부탁문은 한국어 문장이라 다른 모델에서도 됩니다. 다만 결과 파일을 직접 열어 보고 고치는 흐름은 클로드 코드처럼 파일을 다루는 도구가 편합니다. 도구 고르는 법은 스킬·MCP·플러그인 차이에 있습니다.