<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>Vibe Coding on To the Moon</title><link>https://junstellar.github.io/tags/vibe-coding/</link><description>Recent content in Vibe Coding on To the Moon</description><generator>Hugo -- gohugo.io</generator><language>ko-kr</language><lastBuildDate>Mon, 10 Aug 2026 09:00:00 +0900</lastBuildDate><atom:link href="https://junstellar.github.io/tags/vibe-coding/index.xml" rel="self" type="application/rss+xml"/><item><title>AI로 게임 만들기 #8 — 심해 1,200m까지 내려가서 물고기 27종 도감 채우기 (공개빌드 #8)</title><link>https://junstellar.github.io/p/ai-game-lab-build-8/</link><pubDate>Mon, 10 Aug 2026 09:00:00 +0900</pubDate><guid>https://junstellar.github.io/p/ai-game-lab-build-8/</guid><description>&lt;img src="https://junstellar.github.io/p/ai-game-lab-build-8/deep-fishing-poster.webp" alt="Featured image of post AI로 게임 만들기 #8 — 심해 1,200m까지 내려가서 물고기 27종 도감 채우기 (공개빌드 #8)" /&gt;&lt;p&gt;&lt;a class="link" href="https://junstellar.github.io/p/ai-game-lab-build-7/" &gt;지난 편&lt;/a&gt;의 조차장에 이어, 여덟 번째 게임은 &lt;strong&gt;심해 낚시&lt;/strong&gt;입니다. 수면에서 &lt;strong&gt;1,200m 심연까지&lt;/strong&gt; 내려가 물고기를 낚고, &lt;strong&gt;27종 도감&lt;/strong&gt;을 채우는 게임이에요.&lt;/p&gt;
&lt;p&gt;게임 랩에 처음 생긴 **&amp;ldquo;모으는 재미&amp;rdquo;**입니다. 앞의 게임들은 판이 끝나면 기록만 남는데, 이건 잡은 물고기가 &lt;strong&gt;영구히 쌓여요.&lt;/strong&gt;&lt;/p&gt;
&lt;video autoplay loop muted playsinline preload="metadata" poster="/p/ai-game-lab-build-8/deep-fishing-poster.webp" style="width:100%;max-width:420px;display:block;margin:1.2rem auto;border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.25)"&gt;
 &lt;source src="https://junstellar.github.io/p/ai-game-lab-build-8/deep-fishing-play.mp4" type="video/mp4"&gt;
&lt;/video&gt;
&lt;p&gt;👉 &lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/deep-fishing/" &gt;심해 낚시 직접 하러 가기&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;h2 id="어떤-게임이냐면"&gt;어떤 게임이냐면
&lt;/h2&gt;&lt;p&gt;탭 세 번이면 한 마리입니다.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;① &lt;strong&gt;깊이 정하기&lt;/strong&gt; — 움직이는 막대를 탭. 깊을수록 희귀하고 어렵습니다&lt;/li&gt;
&lt;li&gt;② &lt;strong&gt;챔질&lt;/strong&gt; — 물고기가 다가와 미끼를 &lt;strong&gt;툭툭 건드리다가&lt;/strong&gt;(가짜) &lt;strong&gt;확 무는 순간&lt;/strong&gt; 탭&lt;/li&gt;
&lt;li&gt;③ &lt;strong&gt;파이팅&lt;/strong&gt; — 누르면 감기고, 떼면 풀립니다. &lt;strong&gt;장력을 초록 구간에&lt;/strong&gt; 두세요&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;한 판은 캐스팅 12번. &lt;strong&gt;멸치부터 🐉크라켄까지 27종&lt;/strong&gt;이 있고, 가운데를 잘 유지할수록 &lt;strong&gt;정확도 보너스&lt;/strong&gt;(최대 +85%)가 붙습니다.&lt;/p&gt;
&lt;p&gt;&lt;img alt="도감 — 잡은 물고기는 컬러, 못 잡은 건 실루엣" class="gallery-image" data-flex-basis="138px" data-flex-grow="57" height="1252" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-8/deep-fishing-dex.webp" width="720"&gt;&lt;/p&gt;
&lt;h2 id="물고기-27종은-comfyui로-직접-그렸다"&gt;물고기 27종은 ComfyUI로 직접 그렸다
&lt;/h2&gt;&lt;p&gt;&lt;a class="link" href="https://junstellar.github.io/p/claude-local-image-generation/" &gt;예전에 노트북에 설치해둔 &lt;strong&gt;ComfyUI&lt;/strong&gt;&lt;/a&gt;로 27종을 전부 뽑았습니다. 이번에도 생성이 끝이 아니었어요 — 고래상어는 흰 배경 박스를 달고 나오고, 가오리는 모래바닥까지 딸려왔고, 방어는 두 마리가 겹쳐 나왔습니다.&lt;/p&gt;
&lt;p&gt;배경색을 자동 감지해 투명 처리하고, 물체에 딱 맞게 다시 자르고, 그래도 안 되는 건 프롬프트를 바꿔 다시 뽑았어요. &lt;strong&gt;ComfyUI가 그려준 걸 게임에 맞게 다듬는 게 절반의 일&lt;/strong&gt;이라는 게 이번에도 확인됐습니다.&lt;/p&gt;
&lt;h2 id="첫-버전은-허공에-대고-챔질하는-것-같았다"&gt;첫 버전은 허공에 대고 챔질하는 것 같았다
&lt;/h2&gt;&lt;p&gt;일단 돌아가게 만들어놓고 직접 해봤는데, 이상했습니다. 화면엔 &lt;strong&gt;줄 하나만 덩그러니&lt;/strong&gt; 있고, 아무것도 안 보이는데 &amp;ldquo;지금 탭!&amp;ldquo;이라는 글자만 떴거든요. 뭘 보고 채라는 건지 알 수가 없었어요.&lt;/p&gt;
&lt;p&gt;그래서 &lt;strong&gt;물고기를 실제로 보여주기로&lt;/strong&gt; 했습니다.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;물고기가 &lt;strong&gt;옆에서 헤엄쳐 다가오고&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;미끼를 &lt;strong&gt;툭툭 건드립니다&lt;/strong&gt;(찌가 살짝 흔들림 = 가짜 입질)&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;확 무는 순간&lt;/strong&gt; 찌가 쑥 들어가고 물보라가 터집니다&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;이러니 &amp;ldquo;너무 일찍 채면 실패&amp;quot;라는 규칙이 &lt;strong&gt;눈으로 납득되는 규칙&lt;/strong&gt;이 됐어요. 가짜와 진짜를 구분하는 게 실력이 되고요.&lt;/p&gt;
&lt;h2 id="물고기에-검은-배경이-붙은-것-같았는데-재보니-아니었다"&gt;물고기에 검은 배경이 붙은 것 같았는데, 재보니 아니었다
&lt;/h2&gt;&lt;p&gt;계속 해보니 어떤 물고기는 &lt;strong&gt;검은 배경이 붙어 있는 것처럼&lt;/strong&gt; 보였습니다. 배경 제거가 덜 됐나 싶었죠. 그래서 27종을 전부 계측해봤습니다.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;배경이 남은 스프라이트는 하나도 없었습니다.&lt;/strong&gt; 제가 짚은 원인이 틀렸던 거예요.&lt;/p&gt;
&lt;p&gt;진짜 원인은 따로 있었습니다. &lt;strong&gt;물고기와 물의 밝기가 너무 비슷했던 겁니다.&lt;/strong&gt;&lt;/p&gt;
&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;물고기&lt;/th&gt;
					&lt;th&gt;물고기 밝기&lt;/th&gt;
					&lt;th&gt;그 깊이의 물 밝기&lt;/th&gt;
					&lt;th&gt;차이&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;바다거북&lt;/td&gt;
					&lt;td&gt;127&lt;/td&gt;
					&lt;td&gt;130&lt;/td&gt;
					&lt;td&gt;&lt;strong&gt;3&lt;/strong&gt;&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;흡혈오징어&lt;/td&gt;
					&lt;td&gt;45&lt;/td&gt;
					&lt;td&gt;20&lt;/td&gt;
					&lt;td&gt;25&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;심해는 물 밝기가 20 아래인데 심해어도 어둡습니다. &lt;strong&gt;검은 배경에 검은 물체&lt;/strong&gt;였던 거죠.&lt;/p&gt;
&lt;p&gt;그래서 &lt;strong&gt;바늘에 심해 랜턴&lt;/strong&gt;을 달았습니다. 미끼 주변을 비추니 물고기가 보이고, 심해 낚시 분위기도 살았어요. 물고기 외곽에 은은한 발광 테두리도 더했고요.&lt;/p&gt;

 &lt;blockquote&gt;
 &lt;p&gt;감으로 스프라이트를 다시 뽑았으면 시간만 날렸을 겁니다. 재보니 문제는 완전히 다른 곳에 있었어요.&lt;/p&gt;

 &lt;/blockquote&gt;
&lt;h2 id="줄은-그대로인데-물고기만-올라갔다"&gt;줄은 그대로인데 물고기만 올라갔다
&lt;/h2&gt;&lt;p&gt;끌어올릴 때 뭔가 따로 노는 느낌이라 코드를 열어봤더니, 줄 끝이 화면 중앙에 &lt;strong&gt;고정&lt;/strong&gt;돼 있었습니다. 물고기만 위로 움직이니 둘이 분리돼 보인 거예요.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;줄 끝을 &lt;strong&gt;물고기 입에 고정&lt;/strong&gt;했습니다. 올라오면 줄도 같이 짧아져요&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;장력에 따라 줄 모양이 변합니다&lt;/strong&gt; — 팽팽하면 직선, 느슨하면 축 처진 곡선, 한계 근처면 &lt;strong&gt;붉게 굵어짐&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;끌어올린 만큼 &lt;strong&gt;깊이 숫자도 줄고&lt;/strong&gt;, 덤으로 &lt;strong&gt;물이 밝아집니다&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;img alt="잡은 순간 — 정확도 보너스까지" class="gallery-image" data-flex-basis="138px" data-flex-grow="57" height="1252" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-8/deep-fishing-catch.webp" width="720"&gt;&lt;/p&gt;
&lt;h2 id="그래도-뭔가-계속-아쉬웠다--세-번째-진단"&gt;그래도 뭔가 계속 아쉬웠다 — 세 번째 진단
&lt;/h2&gt;&lt;p&gt;여기까지 고쳤는데도 뭔가 계속 아쉬웠습니다. 이번엔 감으로 짚지 않고 &lt;strong&gt;처음부터 코드를 뒤졌어요.&lt;/strong&gt; 세 가지가 나왔습니다.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;① 물고기가 헤엄치지 않았다.&lt;/strong&gt; 코드에 &lt;strong&gt;회전이 단 한 곳도 없었습니다.&lt;/strong&gt; 정지 이미지가 미끄러져 다니는 상태였죠. 헤엄칠 때 몸을 기울이고 발버둥칠 때 몸을 확 트는 것만 넣었는데 완전히 달라졌습니다.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;② 심해로 가는 여정이 없었다.&lt;/strong&gt; 하강 코드가 이랬어요.&lt;/p&gt;
&lt;div class="highlight"&gt;&lt;div class="chroma"&gt;
&lt;table class="lntable"&gt;&lt;tr&gt;&lt;td class="lntd"&gt;
&lt;pre tabindex="0" class="chroma"&gt;&lt;code&gt;&lt;span class="lnt"&gt;1
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;
&lt;td class="lntd"&gt;
&lt;pre tabindex="0" class="chroma"&gt;&lt;code class="language-js" data-lang="js"&gt;&lt;span class="line"&gt;&lt;span class="cl"&gt;&lt;span class="nx"&gt;curDepth&lt;/span&gt; &lt;span class="o"&gt;+=&lt;/span&gt; &lt;span class="nb"&gt;Math&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;max&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;3&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;targetDepth&lt;/span&gt;&lt;span class="o"&gt;*&lt;/span&gt;&lt;span class="mf"&gt;0.012&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;// 항상 1.4초
&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;p&gt;&lt;strong&gt;100m든 1,200m든 하강 시간이 똑같았습니다.&lt;/strong&gt; 심해 낚시인데 심해로 가는 느낌이 0이었죠. 깊이 비례 하강(최대 3.5초)으로 바꾸고, 배경이 위로 흐르게 하고, &lt;strong&gt;&lt;code&gt;200m 황혼대&lt;/code&gt; &lt;code&gt;500m 심해층&lt;/code&gt; &lt;code&gt;900m 심연&lt;/code&gt;&lt;/strong&gt; 이정표가 스쳐 지나가게 했습니다.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;③ 줄이 허공에서 시작했다.&lt;/strong&gt; 배도 수면도 없었어요. &lt;strong&gt;배와 물결&lt;/strong&gt;을 넣고 줄이 배에서 내려오게 했습니다. 깊어지면 수면이 어둠 속으로 사라지고, 끌어올리면 다시 나타나요.&lt;/p&gt;
&lt;p&gt;&lt;img alt="내려가는 중 — 구간 이정표가 스쳐 지나간다" class="gallery-image" data-flex-basis="164px" data-flex-grow="68" height="1050" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-8/deep-fishing-descent.webp" width="720"&gt;&lt;/p&gt;
&lt;h2 id="크기가-무게를-말해준다"&gt;크기가 무게를 말해준다
&lt;/h2&gt;&lt;p&gt;물고기 크기를 &lt;strong&gt;희귀도&lt;/strong&gt; 기준으로 잡았더니 &lt;strong&gt;1kg 복어가 900kg 고래상어만 하게&lt;/strong&gt; 보였습니다. 무게(로그) 기준으로 바꾸고, &lt;strong&gt;입질 전에 무게를 미리 굴려서&lt;/strong&gt; 보이는 크기와 실제 잡는 무게를 일치시켰어요. 이제 화면만 봐도 대물인지 잔챙이인지 압니다.&lt;/p&gt;
&lt;h2 id="밀당을-넣었다가-게임을-망칠-뻔했다"&gt;밀당을 넣었다가 게임을 망칠 뻔했다
&lt;/h2&gt;&lt;p&gt;마지막에 &lt;strong&gt;물고기가 아래로 파고드는 순간&lt;/strong&gt;(손을 떼고 버텨야 하는)을 넣었습니다. 그런데 시뮬레이션을 돌려보니:&lt;/p&gt;
&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;&lt;/th&gt;
					&lt;th&gt;넣기 전&lt;/th&gt;
					&lt;th&gt;넣은 직후&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;포획률&lt;/td&gt;
					&lt;td&gt;83%&lt;/td&gt;
					&lt;td&gt;&lt;strong&gt;33%&lt;/strong&gt;&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;&lt;strong&gt;포획률이 반토막 났고&lt;/strong&gt; 파이팅이 교착에 빠져 아예 안 끝나는 경우까지 생겼습니다. 저항력·진행도 손실·발동 횟수를 모두 낮춰 되돌렸어요. 지금은 긴장감만 주고 난이도는 그대로입니다.&lt;/p&gt;
&lt;p&gt;이번에도 &lt;strong&gt;&amp;ldquo;재미있을 것 같아서&amp;rdquo; 넣은 기능이 게임을 망가뜨릴 뻔한 걸 숫자가 잡아줬습니다.&lt;/strong&gt;&lt;/p&gt;
&lt;h2 id="이제-게임-랩이-8개"&gt;이제 게임 랩이 8개
&lt;/h2&gt;&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;&lt;/th&gt;
					&lt;th&gt;게임&lt;/th&gt;
					&lt;th&gt;성격&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;🎨&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/guess-image/" &gt;AI 그림 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;머리 (퀴즈)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🟩&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/hangul-word/" &gt;한글 단어 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;습관 (데일리)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🍰&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/stack-tower/" &gt;디저트 탑 쌓기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;손맛 (아케이드)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🕹️&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/dodge/" &gt;낙하 회피&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;반사신경 (액션)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🗑️&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/paper-hoop/" &gt;종이 농구&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;조준 (물리)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🪐&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/space-merge/" &gt;우주 진화&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;최고점 (병합 퍼즐)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🚂&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/shunting/" &gt;조차장&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;논리 (3D 퍼즐)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🎣&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/deep-fishing/" &gt;심해 낚시&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;&lt;strong&gt;수집 (도감)&lt;/strong&gt;&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;h2 id="이번-편에서-배운-것"&gt;이번 편에서 배운 것
&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;&amp;ldquo;뭔가 어색하다&amp;quot;는 느낌은 그 자체로는 정보가 아닙니다. 하지만 그 아래엔 항상 구체적인 원인이 있어요.&lt;/strong&gt; 이번엔 세 번에 걸쳐 파고들었고, 그때마다 코드에서 원인을 찾았습니다 — 회전이 없었고, 하강 시간이 고정이었고, 줄 끝 좌표가 고정이었죠. 전부 &lt;strong&gt;한두 줄짜리 원인&lt;/strong&gt;이었습니다.&lt;/p&gt;
&lt;p&gt;그리고 한 번은 &lt;strong&gt;제가 짚은 원인이 틀렸어요.&lt;/strong&gt; &amp;ldquo;배경 제거가 실패했나?&amp;rdquo; 싶었는데 재보니 대비 문제였습니다. 고치기 전에 재보는 게 훨씬 빨랐습니다.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/deep-fishing/" &gt;심해 낚시 한 판&lt;/a&gt;&lt;/strong&gt; 해보시고 몇 종이나 잡았는지 알려주세요. 저는 아직 &lt;strong&gt;크라켄&lt;/strong&gt;을 못 봤습니다. 🐉&lt;/p&gt;
&lt;p&gt;&lt;em&gt;다음 편엔 아홉 번째 게임을 들고 오겠습니다.&lt;/em&gt;&lt;/p&gt;</description></item><item><title>AI로 게임 만들기 #6 — 먼지에서 은하까지, 합쳐서 진화시키는 퍼즐 (공개빌드 #6)</title><link>https://junstellar.github.io/p/ai-game-lab-build-6/</link><pubDate>Mon, 03 Aug 2026 09:00:00 +0900</pubDate><guid>https://junstellar.github.io/p/ai-game-lab-build-6/</guid><description>&lt;p&gt;&lt;a class="link" href="https://junstellar.github.io/p/ai-game-lab-build-5/" &gt;지난 편&lt;/a&gt;의 종이 농구에 이어, 여섯 번째 게임은 &lt;strong&gt;우주 진화&lt;/strong&gt;입니다. 같은 천체끼리 합치면 한 단계씩 진화하는 낙하 퍼즐이에요. ✨먼지에서 시작해서 🌌은하까지 갑니다.&lt;/p&gt;
&lt;p&gt;이번 편의 진짜 이야기는 게임 자체보다 &lt;strong&gt;&amp;ldquo;너무 쉽다&amp;quot;는 피드백을 어떻게 잡았나&lt;/strong&gt;입니다. 결론부터 말하면, 감으로 고치지 않고 &lt;strong&gt;시뮬레이션을 돌렸어요.&lt;/strong&gt;&lt;/p&gt;
&lt;video autoplay loop muted playsinline preload="metadata" poster="/p/ai-game-lab-build-6/space-merge-play-poster.webp" style="width:100%;max-width:420px;display:block;margin:1.2rem auto;border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.25)"&gt;
 &lt;source src="https://junstellar.github.io/p/ai-game-lab-build-6/space-merge-play.mp4" type="video/mp4"&gt;
&lt;/video&gt;
&lt;p&gt;👉 &lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/space-merge/" &gt;우주 진화 직접 하러 가기&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;h2 id="어떤-게임이냐면"&gt;어떤 게임이냐면
&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;탭해서 천체를 떨어뜨리면&lt;/strong&gt;, 같은 것끼리 닿을 때 &lt;strong&gt;합쳐지며 진화&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;✨먼지 → ☄️운석 → 소행성 → 🌑달 → 화성 → 🌍지구 → 목성 → 🪐토성 → 갈색왜성 → ⭐항성 → 🌌&lt;strong&gt;은하&lt;/strong&gt; (11단계)&lt;/li&gt;
&lt;li&gt;연달아 합치면 &lt;strong&gt;🔥ON FIRE&lt;/strong&gt;(2배 점수), &lt;strong&gt;보관(HOLD)&lt;/strong&gt; 한 칸에 넣어뒀다 나중에 쓰기&lt;/li&gt;
&lt;li&gt;통 위로 넘치면 끝. 📅&lt;strong&gt;데일리 챌린지&lt;/strong&gt;는 그날 모두 같은 순서로 나옵니다&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;img alt="ON FIRE — 연쇄로 합치면 2배 점수" class="gallery-image" data-flex-basis="157px" data-flex-grow="65" height="1095" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-6/space-merge-fire.webp" width="720"&gt;&lt;/p&gt;
&lt;h2 id="천체는-우리-집-그래픽카드가-그렸다"&gt;천체는 우리 집 그래픽카드가 그렸다
&lt;/h2&gt;&lt;p&gt;11종 전부 &lt;a class="link" href="https://junstellar.github.io/p/claude-local-image-generation/" &gt;예전에 깔아둔 ComfyUI&lt;/a&gt;로 뽑았습니다. 그런데 생성만으로 끝이 아니었어요:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;배경이 회색인 이미지가 섞여 있어서, 원형으로 자르니 &lt;strong&gt;천체 주위에 회색 접시&lt;/strong&gt;가 생김 → 배경색을 자동 감지해 &lt;strong&gt;투명 처리&lt;/strong&gt;하고 물체에 딱 맞게 다시 크롭&lt;/li&gt;
&lt;li&gt;달이 &lt;strong&gt;초승달처럼 그림자&lt;/strong&gt;가 져서 혼자 어색함 → &amp;ldquo;정면 균일 조명&amp;quot;으로 다시 생성 (세 번 만에 성공)&lt;/li&gt;
&lt;li&gt;화성이 한 장에 &lt;strong&gt;네 개&lt;/strong&gt; 들어가 있기도 했고, 목성은 배경 불꽃까지 딸려와서 더 확대해 잘라냄&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;AI가 그려준 걸 그대로 쓰는 게 아니라, &lt;strong&gt;게임에 맞게 다듬는 작업이 절반&lt;/strong&gt;이더라고요.&lt;/p&gt;
&lt;h2 id="너무-쉽다--감이-아니라-숫자로-잡기"&gt;&amp;ldquo;너무 쉽다&amp;rdquo; — 감이 아니라 숫자로 잡기
&lt;/h2&gt;&lt;p&gt;처음 만들고 나서 &amp;ldquo;좀 쉬운데?&amp;ldquo;라는 얘기를 들었습니다. 예전 같으면 대충 값을 바꿔봤겠지만, 이번엔 &lt;strong&gt;게임을 자동으로 플레이시켜서 측정&lt;/strong&gt;했어요. 아무렇게나 던지는 플레이어와, 같은 천체 근처에 놓는 플레이어를 각각 여러 판 돌렸습니다.&lt;/p&gt;
&lt;p&gt;결과가 충격적이었어요:&lt;/p&gt;

 &lt;blockquote&gt;
 &lt;p&gt;&lt;strong&gt;아무렇게나 던져도 매판 9번째 단계까지 도달하고, 한 판이 156번이나 이어짐&lt;/strong&gt;&lt;/p&gt;

 &lt;/blockquote&gt;
&lt;p&gt;원인도 숫자로 나왔습니다. &lt;strong&gt;합칠 때마다 공간이 22%씩 남고 있었어요.&lt;/strong&gt; 반지름이 1.25배씩 커지게 해놨는데, 그러면 두 개(면적 2)가 합쳐져도 1.56밖에 안 되거든요. 즉 &lt;strong&gt;합칠수록 통이 비어서&lt;/strong&gt; 영원히 안 차는 구조였습니다. 면적이 유지되려면 √2 ≈ 1.41배여야 했어요.&lt;/p&gt;
&lt;h2 id="12가지-조합을-다-돌려보고-고름"&gt;12가지 조합을 다 돌려보고 고름
&lt;/h2&gt;&lt;p&gt;반지름·통 크기·낙하 분포를 조합한 &lt;strong&gt;12가지 설정을 전부 시뮬레이션&lt;/strong&gt;해서 제일 나은 걸 골랐습니다. 기준은 두 가지였어요 — &lt;em&gt;판이 너무 늘어지지 않을 것&lt;/em&gt;, 그리고 &lt;em&gt;잘하는 사람이 확실히 더 잘 나올 것&lt;/em&gt;.&lt;/p&gt;
&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;&lt;/th&gt;
					&lt;th&gt;무작위 플레이&lt;/th&gt;
					&lt;th&gt;도달 단계&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;처음&lt;/td&gt;
					&lt;td&gt;156번 만에 종료&lt;/td&gt;
					&lt;td&gt;9단계&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;&lt;strong&gt;고친 뒤&lt;/strong&gt;&lt;/td&gt;
					&lt;td&gt;&lt;strong&gt;63번&lt;/strong&gt;&lt;/td&gt;
					&lt;td&gt;&lt;strong&gt;6단계&lt;/strong&gt;&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;&lt;strong&gt;하드&lt;/strong&gt;&lt;/td&gt;
					&lt;td&gt;&lt;strong&gt;48번&lt;/strong&gt;&lt;/td&gt;
					&lt;td&gt;&lt;strong&gt;5단계&lt;/strong&gt;&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;중간에 재밌는 일도 있었어요. 하드에서 &amp;ldquo;전략적으로 두는 쪽이 아무렇게나 던지는 쪽보다 못하다&amp;quot;는 이상한 결과가 나왔거든요. 표본을 3판에서 8판으로 늘려 다시 돌리니 **그냥 운빨(노이즈)**이었습니다. 3판만 보고 튜닝했으면 엉뚱하게 고칠 뻔했어요.&lt;/p&gt;
&lt;h2 id="하드는-3개를-모아야-합쳐집니다"&gt;하드는 3개를 모아야 합쳐집니다
&lt;/h2&gt;&lt;p&gt;난이도를 이지/노멀/하드로 나눴는데, &lt;strong&gt;하드는 규칙 자체가 다릅니다&lt;/strong&gt; — 2개가 아니라 &lt;strong&gt;3개가 붙어야&lt;/strong&gt; 합쳐져요. 트리플 타운 같은 방식이죠. 이거 하나로 점수가 1/4로 떨어질 만큼 어려워집니다.&lt;/p&gt;
&lt;p&gt;구현은 맞닿은 같은 등급 천체들을 &lt;strong&gt;하나의 덩어리로 묶어서&lt;/strong&gt; 3개 이상이면 합치는 방식이라, 일렬이든 삼각형이든 붙어 있기만 하면 됩니다.&lt;/p&gt;
&lt;p&gt;&lt;img alt="게임 결과 화면 — 최고 단계와 기록" class="gallery-image" data-flex-basis="157px" data-flex-grow="65" height="1095" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-6/space-merge-result.webp" width="720"&gt;&lt;/p&gt;
&lt;h2 id="이번-편에서-배운-것"&gt;이번 편에서 배운 것
&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;&amp;ldquo;재미있나?&amp;ldquo;는 취향이지만, &amp;ldquo;너무 쉬운가?&amp;ldquo;는 측정할 수 있습니다.&lt;/strong&gt; 게임을 스스로 플레이하게 만들어 몇 판 돌려보면 숫자가 나오고, 그 숫자를 보고 고치면 훨씬 빠르고 정확해요. 이번엔 그 덕에 **&amp;ldquo;합칠수록 공간이 남는다&amp;rdquo;**는, 그냥 플레이해서는 절대 몰랐을 원인을 찾았습니다.&lt;/p&gt;
&lt;h2 id="이제-게임-랩이-6개"&gt;이제 게임 랩이 6개
&lt;/h2&gt;&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;&lt;/th&gt;
					&lt;th&gt;게임&lt;/th&gt;
					&lt;th&gt;성격&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;🎨&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/guess-image/" &gt;AI 그림 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;머리 (퀴즈)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🟩&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/hangul-word/" &gt;한글 단어 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;습관 (데일리)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🍰&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/stack-tower/" &gt;디저트 탑 쌓기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;손맛 (아케이드)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🕹️&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/dodge/" &gt;낙하 회피&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;반사신경 (액션)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🗑️&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/paper-hoop/" &gt;종이 농구&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;조준 (물리)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🪐&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/space-merge/" &gt;우주 진화&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;최고점 (병합 퍼즐)&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/space-merge/" &gt;우주 진화 한 판&lt;/a&gt;&lt;/strong&gt; 해보시고 어디까지 갔는지 알려주세요. 저는 아직 &lt;strong&gt;은하&lt;/strong&gt;를 못 봤습니다. 🌌&lt;/p&gt;
&lt;p&gt;&lt;em&gt;다음 편엔 일곱 번째 게임을 들고 오겠습니다.&lt;/em&gt;&lt;/p&gt;</description></item><item><title>AI로 게임 만들기 #5 — 휴지통에 종이 던지기, 근데 '진짜 게임처럼' (공개빌드 #5)</title><link>https://junstellar.github.io/p/ai-game-lab-build-5/</link><pubDate>Tue, 28 Jul 2026 09:00:00 +0900</pubDate><guid>https://junstellar.github.io/p/ai-game-lab-build-5/</guid><description>&lt;p&gt;&lt;a class="link" href="https://junstellar.github.io/p/ai-game-lab-build-4/" &gt;지난 편&lt;/a&gt;까지 게임 랩엔 네 개가 쌓였습니다 — 🎨 그림 퀴즈, 🟩 한글 워들, 🍰 디저트 탑, 🕹️ 낙하 회피. 다섯 번째는 &lt;strong&gt;종이 농구&lt;/strong&gt;예요. 근데 이번 편은 좀 다릅니다. 새 게임을 하나 더 늘리기보다, &lt;strong&gt;게임 하나를 &amp;ldquo;그냥 되는&amp;rdquo; 상태에서 &amp;ldquo;진짜 게임처럼&amp;quot;까지 다듬는 것&lt;/strong&gt;에 집중했거든요.&lt;/p&gt;
&lt;p&gt;말보다 보는 게 빠르니 &lt;strong&gt;플레이 영상&lt;/strong&gt;부터 👇&lt;/p&gt;
&lt;video autoplay loop muted playsinline preload="metadata" poster="/p/ai-game-lab-build-5/paper-hoop-play-poster.webp" style="width:100%;max-width:420px;display:block;margin:1.2rem auto;border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.25)"&gt;
 &lt;source src="https://junstellar.github.io/p/ai-game-lab-build-5/paper-hoop-play.mp4" type="video/mp4"&gt;
&lt;/video&gt;
&lt;p&gt;👉 &lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/paper-hoop/" &gt;종이 농구 직접 하러 가기&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;h2 id="어떤-게임이냐면"&gt;어떤 게임이냐면
&lt;/h2&gt;&lt;p&gt;3초컷입니다:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;구겨진 종이를 &lt;strong&gt;화면 아무 곳이나 당겼다 놓아&lt;/strong&gt; 휴지통에 골인 (공을 안 짚어도 돼요)&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;가운데로 쏙 = 스월(2점)&lt;/strong&gt;, 림이나 백보드 맞고 들어가면 &lt;strong&gt;뱅크(1점)&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;바람&lt;/strong&gt; 주의! 연속 골인하면 &lt;strong&gt;🔥 ON FIRE&lt;/strong&gt;(2배 점수)&lt;/li&gt;
&lt;li&gt;3번 놓치면 끝. 점수는 누적·최고 기록·연속 출석까지 다른 게임처럼 쌓여요&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id="처음엔-게임-같지가-않았다"&gt;처음엔 &amp;ldquo;게임 같지가 않았다&amp;rdquo;
&lt;/h2&gt;&lt;p&gt;솔직히 첫 버전은 별로였어요. 발사가 너무 빨라서 종이가 &lt;strong&gt;번쩍 사라지는&lt;/strong&gt; 수준이라 손맛이 0이었죠. 그래서:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;비행을 &lt;strong&gt;2배 느리게&lt;/strong&gt;(궤적·난이도는 그대로, 보이는 속도만)&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;잔상 꼬리&lt;/strong&gt; + 바닥 그림자 + 빗나가면 &lt;strong&gt;바닥에 튕기는&lt;/strong&gt; 마무리&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;이것만 넣었는데 바로 &amp;ldquo;오, 게임이네&amp;rdquo; 소리가 나왔습니다. &lt;strong&gt;완성도의 8할은 손맛&lt;/strong&gt;이더라고요.&lt;/p&gt;
&lt;h2 id="그다음-고퀄로-끝까지-밀어봤다"&gt;그다음 &amp;lsquo;고퀄&amp;rsquo;로 끝까지 밀어봤다
&lt;/h2&gt;&lt;p&gt;여기서 멈춰도 됐는데, 어디까지 되나 궁금해서 다 넣어봤어요:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;🔊 &lt;strong&gt;사운드&lt;/strong&gt; — 에셋 파일 &lt;strong&gt;0개&lt;/strong&gt;. WebAudio로 발사 &amp;ldquo;휘익&amp;rdquo;, 스월 &amp;ldquo;사악~&amp;rdquo;, 뱅크 &amp;ldquo;통-딩&amp;quot;을 &lt;strong&gt;코드로 합성&lt;/strong&gt;했습니다&lt;/li&gt;
&lt;li&gt;🏀 &lt;strong&gt;물리&lt;/strong&gt; — 좌우 림에 튕겨 덜덜거리는 &lt;strong&gt;in&amp;amp;out&lt;/strong&gt;, 뒤 &lt;strong&gt;백보드 뱅크샷&lt;/strong&gt;, 입구엔 &lt;strong&gt;천 네트가 출렁&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;🔥 &lt;strong&gt;ON FIRE&lt;/strong&gt; — 연속 골인으로 게이지가 차고, 만렙이면 &lt;strong&gt;공에 불붙고 2배&lt;/strong&gt; (NBA Jam 오마주)&lt;/li&gt;
&lt;li&gt;🎯 &lt;strong&gt;3점 라인&lt;/strong&gt; — 먼 통일수록 고득점. **백스핀(마그누스)**으로 궤적이 살짝 휘어요&lt;/li&gt;
&lt;li&gt;✨ 그 외 히트스톱·카메라 펀치줌·리본 잔상 같은 자잘한 &lt;strong&gt;연출 주스&lt;/strong&gt;까지&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id="우리-집-그래픽카드가-배경을-그렸다"&gt;우리 집 그래픽카드가 배경을 그렸다
&lt;/h2&gt;&lt;p&gt;제일 좋아하는 부분이에요. 배경 사무실 일러스트를 &lt;strong&gt;집에 있는 그래픽카드(ComfyUI/SDXL)로 직접 뽑아서&lt;/strong&gt; 깔았습니다. &lt;a class="link" href="https://junstellar.github.io/p/claude-local-image-generation/" &gt;예전에 노트북에 ComfyUI를 깔아둔 것&lt;/a&gt;을 이렇게 써먹네요. 브라우저에서 바로 돌아가는 가벼운 게임인데도 배경은 손그림풍이죠. 여기에 &lt;strong&gt;낮/밤 테마&lt;/strong&gt;까지 붙였어요.&lt;/p&gt;
&lt;p&gt;&lt;img alt="밤 테마 + ON FIRE — 불붙은 종이공" class="gallery-image" data-flex-basis="185px" data-flex-grow="77" height="930" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-5/paper-hoop-fire.webp" width="720"&gt;&lt;/p&gt;
&lt;h2 id="오래-붙잡는-장치들"&gt;오래 붙잡는 장치들
&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;📅 &lt;strong&gt;데일리 챌린지&lt;/strong&gt; — 날짜 시드라 그날은 &lt;strong&gt;모두 같은 통·바람&lt;/strong&gt;. &amp;ldquo;오늘 몇 점?&amp;rdquo; 공유용&lt;/li&gt;
&lt;li&gt;🏅 &lt;strong&gt;업적&lt;/strong&gt; · 🖼️ &lt;strong&gt;결과를 이미지 카드로 공유&lt;/strong&gt; · ▶️ &lt;strong&gt;베스트 샷 리플레이&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;♿ &lt;strong&gt;접근성&lt;/strong&gt; — 멀미 방지(모션 축소 존중), 색약 안전 파워 표시&lt;/li&gt;
&lt;/ul&gt;
&lt;h2 id="마지막에-배운-것-작은-ux가-게임을-살린다"&gt;마지막에 배운 것: 작은 UX가 게임을 살린다
&lt;/h2&gt;&lt;p&gt;다 만들고 플레이하다가 치명적인 걸 발견했어요. 슬링샷이 &lt;strong&gt;공(좌하단 구석) 기준&lt;/strong&gt;이라 뒤로 당길 공간이 없었던 거예요. 그래서 **&amp;ldquo;화면 아무 곳이나 짚고 상대적으로 당기기&amp;rdquo;**로 바꾸니 완전히 달라졌습니다. 화려한 기능 20개보다 &lt;strong&gt;이 한 줄짜리 조작 수정&lt;/strong&gt;이 체감이 훨씬 컸어요.&lt;/p&gt;
&lt;h2 id="이제-게임-랩이-5개"&gt;이제 게임 랩이 5개
&lt;/h2&gt;&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;&lt;/th&gt;
					&lt;th&gt;게임&lt;/th&gt;
					&lt;th&gt;성격&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;🎨&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/guess-image/" &gt;AI 그림 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;머리 (퀴즈)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🟩&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/hangul-word/" &gt;한글 단어 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;습관 (데일리)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🍰&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/stack-tower/" &gt;디저트 탑 쌓기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;손맛 (아케이드)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🕹️&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/dodge/" &gt;낙하 회피&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;반사신경 (액션)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🗑️&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/paper-hoop/" &gt;종이 농구&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;조준 (물리)&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;머리·습관·손맛·반사신경·조준 — &lt;a class="link" href="https://junstellar.github.io/games/" &gt;게임 랩&lt;/a&gt;이 5색이 됐습니다.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/paper-hoop/" &gt;종이 농구 한 판&lt;/a&gt;&lt;/strong&gt; 하고 몇 점인지 알려주세요. 스월로 3연속 넣으면 불붙습니다. 🔥&lt;/p&gt;
&lt;p&gt;&lt;em&gt;다음 편엔 여섯 번째 게임을 들고 오겠습니다.&lt;/em&gt;&lt;/p&gt;</description></item><item><title>AI로 게임 만들기 #4 — 쏟아지는 걸 피하는 '낙하 회피', 그리고 플레이 영상까지 (공개빌드 #4)</title><link>https://junstellar.github.io/p/ai-game-lab-build-4/</link><pubDate>Tue, 21 Jul 2026 09:00:00 +0900</pubDate><guid>https://junstellar.github.io/p/ai-game-lab-build-4/</guid><description>&lt;p&gt;&lt;a class="link" href="https://junstellar.github.io/p/ai-game-lab-build-3/" &gt;지난 편&lt;/a&gt;까지 게임 랩엔 세 개가 쌓였습니다 — 🎨 그림 퀴즈(머리), 🟩 한글 워들(습관), 🍰 디저트 탑(손맛). 딱 하나 비어 있던 게 &lt;strong&gt;순수 액션&lt;/strong&gt;이었어요. 그래서 네 번째는 반사신경으로 하는 게임 — &lt;strong&gt;낙하 회피&lt;/strong&gt;입니다.&lt;/p&gt;
&lt;p&gt;말로 설명하는 것보다 보는 게 빠르니, 이번엔 &lt;strong&gt;10초 플레이 영상&lt;/strong&gt;부터 올립니다 👇&lt;/p&gt;
&lt;video autoplay loop muted playsinline preload="metadata" poster="/p/ai-game-lab-build-4/dodge-play-poster.webp" style="width:100%;max-width:420px;display:block;margin:1.2rem auto;border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.25)"&gt;
 &lt;source src="https://junstellar.github.io/p/ai-game-lab-build-4/dodge-play.mp4" type="video/mp4"&gt;
&lt;/video&gt;
&lt;p&gt;👉 &lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/dodge/" &gt;낙하 회피 직접 하러 가기&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;h2 id="어떤-게임이냐면"&gt;어떤 게임이냐면
&lt;/h2&gt;&lt;p&gt;규칙은 3초컷입니다:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;🚀 로켓을 &lt;strong&gt;드래그(PC는 ← →)로 좌우&lt;/strong&gt; 이동&lt;/li&gt;
&lt;li&gt;위에서 쏟아지는 &lt;strong&gt;🪨 운석·💣 폭탄을 피하기&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;⭐ 별&lt;/strong&gt;을 먹으면 점수 폭발, &lt;strong&gt;💗 하트&lt;/strong&gt;를 먹으면 생명 회복(최대 5)&lt;/li&gt;
&lt;li&gt;하트 3개로 시작, 부딪히면 하나씩 깎이고 0이면 끝&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;갈수록 빨라집니다.&lt;/strong&gt; 점수 = 버틴 만큼 + 별&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;결과는 &lt;code&gt;🕹️ 낙하 회피 — N점!&lt;/code&gt;으로 공유되고, 최고 기록·연속 출석도 다른 게임들처럼 쌓여요. 조작이 한 손이라 폰에서 특히 잘 맞습니다.&lt;/p&gt;
&lt;h2 id="이번-편의-새로운-것--게임이-스스로-플레이하게-만들기"&gt;이번 편의 새로운 것 — 게임이 스스로 플레이하게 만들기
&lt;/h2&gt;&lt;p&gt;위 영상, 제가 직접 플레이한 게 아니라 &lt;strong&gt;게임이 자기 자신을 플레이한 걸 녹화&lt;/strong&gt;한 거예요. 이번에 처음 해본 건데 방법이 재밌었습니다:&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;게임에 &lt;strong&gt;간단한 회피 AI&lt;/strong&gt;를 붙였어요 — 매 순간 &amp;ldquo;제일 가까운 폭탄이 왼쪽에 있으면 오른쪽으로, 위험이 없으면 근처 별 쪽으로&amp;rdquo; 로켓을 움직이게&lt;/li&gt;
&lt;li&gt;그 상태로 게임을 돌리면서 &lt;strong&gt;캔버스 화면을 그대로 녹화&lt;/strong&gt;(브라우저의 화면 녹화 기능)&lt;/li&gt;
&lt;li&gt;나온 영상을 &lt;strong&gt;10초짜리 mp4&lt;/strong&gt;로 변환해서 이 글에 임베드&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;즉 &amp;ldquo;게임을 만든 김에, 그 게임한테 스스로 시연까지 시킨&amp;rdquo; 셈이에요. 앞으로 게임마다 이렇게 짧은 플레이 영상을 붙이면 글이 훨씬 생생해지겠더라고요.&lt;/p&gt;
&lt;h2 id="그리고-난이도-한-번-손봄"&gt;그리고 난이도 한 번 손봄
&lt;/h2&gt;&lt;p&gt;처음엔 좀 쉬웠어요(&amp;ldquo;이거 안 죽는데?&amp;rdquo;). 그래서 &lt;strong&gt;낙하 속도와 등장 빈도를 살짝 올려서&lt;/strong&gt;, 초반은 여유롭다가 중반부터 확 조여지게 바꿨습니다. 이런 자잘한 손맛 조정이 액션 게임에선 은근 중요하더라고요.&lt;/p&gt;
&lt;h2 id="이제-게임-랩이-4색-됐습니다"&gt;이제 게임 랩이 4색 됐습니다
&lt;/h2&gt;&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;&lt;/th&gt;
					&lt;th&gt;게임&lt;/th&gt;
					&lt;th&gt;성격&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;🎨&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/guess-image/" &gt;AI 그림 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;머리 (퀴즈)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🟩&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/hangul-word/" &gt;한글 단어 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;습관 (데일리)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🍰&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/stack-tower/" &gt;디저트 탑 쌓기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;손맛 (아케이드)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🕹️&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/dodge/" &gt;낙하 회피&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;반사신경 (액션)&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;머리·습관·손맛·반사신경 — 이제 어떤 기분에 들어와도 하나쯤 걸리는 &lt;a class="link" href="https://junstellar.github.io/games/" &gt;게임 랩&lt;/a&gt;이 됐습니다.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/dodge/" &gt;낙하 회피 한 판&lt;/a&gt;&lt;/strong&gt; 해보시고 몇 점 나오는지 알려주세요. 저는 별 먹으려다 폭탄에 자주 박습니다. 🚀&lt;/p&gt;
&lt;p&gt;&lt;em&gt;다음 편엔 다섯 번째 게임을 들고 오겠습니다.&lt;/em&gt;&lt;/p&gt;</description></item><item><title>AI로 게임 만들기 #3 — 원버튼 '디저트 탑 쌓기', 막대기가 마카롱이 되기까지 (공개빌드 #3)</title><link>https://junstellar.github.io/p/ai-game-lab-build-3/</link><pubDate>Thu, 16 Jul 2026 20:00:00 +0900</pubDate><guid>https://junstellar.github.io/p/ai-game-lab-build-3/</guid><description>&lt;p&gt;&lt;a class="link" href="https://junstellar.github.io/p/ai-game-lab-build-2/" &gt;지난 편&lt;/a&gt;까지 만든 두 게임(그림 퀴즈, 한글 워들)을 놓고 보니 공통점이 있더라고요 — &lt;strong&gt;둘 다 머리 쓰는 게임&lt;/strong&gt;입니다. 라이브러리에 퀴즈만 쌓이면 재미없죠. 그래서 세 번째는 완전히 반대로, 아무 생각 없이 순전히 &lt;strong&gt;손맛&lt;/strong&gt;으로 하는 게임을 만들었습니다. 결과물은… &lt;strong&gt;디저트 탑 쌓기&lt;/strong&gt;가 됐어요. 왜 &amp;ldquo;디저트&amp;quot;인지는 뒤에서 이야기하겠습니다.&lt;/p&gt;
&lt;p&gt;👉 &lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/stack-tower/" &gt;디저트 탑 쌓기 하러 가기&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;h2 id="탑-쌓기-장르가-뭐냐면"&gt;&amp;lsquo;탑 쌓기&amp;rsquo; 장르가 뭐냐면
&lt;/h2&gt;&lt;p&gt;모바일 게임 좀 해보셨으면 &amp;lsquo;Stack&amp;rsquo;류 게임을 기억하실 거예요. 규칙은 이게 전부입니다:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;블록이 &lt;strong&gt;좌우로 왔다 갔다&lt;/strong&gt; 움직인다 → &lt;strong&gt;탭하면 뚝&lt;/strong&gt; 떨어진다&lt;/li&gt;
&lt;li&gt;아래 블록과 &lt;strong&gt;겹친 부분만 남고&lt;/strong&gt;, 튀어나온 부분은 싹둑 잘려나간다&lt;/li&gt;
&lt;li&gt;블록이 점점 좁아지다가, 완전히 빗나가면 끝 — &lt;strong&gt;몇 층까지 쌓았나?&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;배우는 데 30초, 한 판에 30초. 그런데 &amp;ldquo;한 판만 더&amp;quot;가 끝없이 나오는 마성의 장르죠.&lt;/p&gt;
&lt;h2 id="이렇게-플레이합니다"&gt;이렇게 플레이합니다
&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;화면 &lt;strong&gt;탭&lt;/strong&gt;(PC는 스페이스바) 한 번 = 디저트 낙하&lt;/li&gt;
&lt;li&gt;삐끗한 만큼 잘려서 탑이 점점 좁아집니다 — 착지할 때마다 크림이 찌익 튀고요&lt;/li&gt;
&lt;li&gt;오차 몇 픽셀 이내로 딱 맞추면 &lt;strong&gt;PERFECT&lt;/strong&gt; — 안 잘리고, &lt;strong&gt;체리나 딸기가 톡 하고 올라갑니다&lt;/strong&gt; (탑에 그대로 남아서, 퍼펙트 이력이 훈장처럼 쌓여요)&lt;/li&gt;
&lt;li&gt;연속 PERFECT면 좁아졌던 폭이 조금씩 &lt;strong&gt;회복&lt;/strong&gt;됩니다 (실수해도 컴백 가능)&lt;/li&gt;
&lt;li&gt;올라갈수록 점점 빨라집니다. 점수 = 층수&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;&lt;img alt="디저트 탑 쌓기 플레이 화면" class="gallery-image" data-flex-basis="157px" data-flex-grow="65" height="1520" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-3/stack-dessert.webp" srcset="https://junstellar.github.io/p/ai-game-lab-build-3/stack-dessert_hu_b128a1dd5efd7cf5.webp 800w, https://junstellar.github.io/p/ai-game-lab-build-3/stack-dessert.webp 1000w" width="1000"&gt;&lt;/p&gt;
&lt;p&gt;팬케이크, 마카롱, 생크림, 초콜릿… 층마다 다른 디저트가 올라오는데, 문제는 —&lt;/p&gt;
&lt;h2 id="젤리는-흔들립니다-"&gt;젤리는 흔들립니다 🍮
&lt;/h2&gt;&lt;p&gt;몇 층마다 한 번씩 &lt;strong&gt;젤리&lt;/strong&gt;가 나옵니다. 이 젤리, 착지한 뒤에도 탄성 때문에 &lt;strong&gt;좌우로 부르르 흔들려요.&lt;/strong&gt; 그리고 다음 블록의 판정은 흔들리고 있는 &lt;strong&gt;실시간 위치 기준&lt;/strong&gt;입니다. 흔들리는 젤리 위에 다음 디저트를 얹어야 하니, 타이밍을 완전히 빼앗기죠. 대신 그 위에 뭔가 얹히면 젤리는 그 자리에 눌려 고정됩니다. 이 게임의 시그니처 기믹이에요 — &amp;ldquo;아, 젤리다…&amp;rdquo; 하는 순간의 긴장감.&lt;/p&gt;
&lt;h2 id="막대기가-마카롱이-되기까지"&gt;막대기가 마카롱이 되기까지
&lt;/h2&gt;&lt;p&gt;사실 이번 편의 진짜 이야기는 이겁니다. 이 게임, &lt;strong&gt;세 번 변신했어요.&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;1차 — 색깔 막대기.&lt;/strong&gt; 로직을 다 만들고 첫 버전을 보여줬더니 돌아온 반응: &lt;em&gt;&amp;ldquo;좋은데, 탑 디자인이 너무 구리다.&amp;rdquo;&lt;/em&gt; …맞는 말이었습니다:&lt;/p&gt;
&lt;p&gt;&lt;img alt="1차 — 평평한 막대 탑" class="gallery-image" data-flex-basis="157px" data-flex-grow="65" height="1520" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-3/stack-before.webp" srcset="https://junstellar.github.io/p/ai-game-lab-build-3/stack-before_hu_f0af13ca931753df.webp 800w, https://junstellar.github.io/p/ai-game-lab-build-3/stack-before.webp 1000w" width="1000"&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;2차 — 입체(2.5D).&lt;/strong&gt; 그래서 블록에 윗면·옆면을 붙여 입체로 갈아엎었습니다. 훨씬 나아졌죠:&lt;/p&gt;
&lt;p&gt;&lt;img alt="2차 — 2.5D 입체 탑" class="gallery-image" data-flex-basis="157px" data-flex-grow="65" height="1520" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-3/stack-after.webp" srcset="https://junstellar.github.io/p/ai-game-lab-build-3/stack-after_hu_284ac3b4a153d663.webp 800w, https://junstellar.github.io/p/ai-game-lab-build-3/stack-after.webp 1000w" width="1000"&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;3차 — 디저트.&lt;/strong&gt; 그런데 여기서 &amp;ldquo;아예 디저트를 쌓으면 어때? 젤리는 흔들리고!&amp;ldquo;라는 아이디어가 나왔고 — 그 순간 이 게임이 흔한 Stack 클론에서 &lt;strong&gt;자기 정체성이 있는 게임&lt;/strong&gt;으로 바뀌었습니다. 파스텔 배경, 케이크 스탠드, 시럽 드립, 퍼펙트 체리, 그리고 흔들리는 젤리까지. 위의 플레이 화면이 그 결과예요.&lt;/p&gt;
&lt;p&gt;게임 로직은 처음부터 끝까지 그대로입니다. 바뀐 건 &lt;strong&gt;그리는 코드와 콘셉트&lt;/strong&gt;뿐인데, 게임의 인상은 매번 완전히 달라졌어요. 만들면서 배운 것: 규칙이 게임의 뼈대라면, &lt;strong&gt;콘셉트는 게임의 얼굴&lt;/strong&gt;이더라고요.&lt;/p&gt;
&lt;h2 id="이제-게임이-셋--성격이-다-다릅니다"&gt;이제 게임이 셋 — 성격이 다 다릅니다
&lt;/h2&gt;&lt;table&gt;
	&lt;thead&gt;
			&lt;tr&gt;
					&lt;th&gt;&lt;/th&gt;
					&lt;th&gt;게임&lt;/th&gt;
					&lt;th&gt;성격&lt;/th&gt;
			&lt;/tr&gt;
	&lt;/thead&gt;
	&lt;tbody&gt;
			&lt;tr&gt;
					&lt;td&gt;🎨&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/guess-image/" &gt;AI 그림 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;머리 (퀴즈)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🟩&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/hangul-word/" &gt;한글 단어 맞히기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;습관 (데일리)&lt;/td&gt;
			&lt;/tr&gt;
			&lt;tr&gt;
					&lt;td&gt;🍰&lt;/td&gt;
					&lt;td&gt;&lt;a class="link" href="https://junstellar.github.io/games/stack-tower/" &gt;디저트 탑 쌓기&lt;/a&gt;&lt;/td&gt;
					&lt;td&gt;손맛 (아케이드)&lt;/td&gt;
			&lt;/tr&gt;
	&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;&amp;ldquo;비슷한 게임 모음&amp;quot;이 아니라, 이제야 &lt;a class="link" href="https://junstellar.github.io/games/" &gt;게임 랩&lt;/a&gt;이 구색을 갖춘 느낌입니다.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/stack-tower/" &gt;디저트 탑 한 판&lt;/a&gt;&lt;/strong&gt; 쌓아보시고 몇 층인지 알려주세요. 참고로 저는 젤리 위에서 자꾸 무너집니다. 🚀&lt;/p&gt;
&lt;p&gt;&lt;em&gt;다음 편엔 네 번째 게임을 들고 오겠습니다.&lt;/em&gt;&lt;/p&gt;</description></item><item><title>AI로 게임 만들기 #2 — 한글판 워들, 그리고 힌트 난이도로 세 번 갈아엎은 이야기 (공개빌드 #2)</title><link>https://junstellar.github.io/p/ai-game-lab-build-2/</link><pubDate>Sat, 11 Jul 2026 09:00:00 +0900</pubDate><guid>https://junstellar.github.io/p/ai-game-lab-build-2/</guid><description>&lt;p&gt;&lt;a class="link" href="https://junstellar.github.io/p/ai-game-lab-build-1/" &gt;지난 편&lt;/a&gt;에서 &amp;ldquo;게임을 하나씩 계속 얹겠다&amp;quot;고 했으니, 약속대로 &lt;strong&gt;두 번째 게임&lt;/strong&gt;을 만들었습니다. 이번엔 &lt;strong&gt;한글판 워들&lt;/strong&gt; — 매일 두 글자 단어 하나를 맞히는 게임이에요.&lt;/p&gt;
&lt;p&gt;👉 &lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/hangul-word/" &gt;한글 단어 맞히기 하러 가기&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;h2 id="워들이-뭐냐면"&gt;워들이 뭐냐면
&lt;/h2&gt;&lt;p&gt;혹시 &amp;lsquo;워들(Wordle)&amp;rsquo; 아세요? 2022년 초에 전 세계를 휩쓴 단어 맞히기 게임이에요. 규칙은 단순합니다:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;숨겨진 &lt;strong&gt;다섯 글자 영어 단어&lt;/strong&gt;를 &lt;strong&gt;여섯 번&lt;/strong&gt; 안에 맞힌다&lt;/li&gt;
&lt;li&gt;한 번 추측할 때마다 글자마다 색으로 힌트를 준다 — 🟩(자리·글자 맞음) · 🟨(단어에 있지만 자리가 틀림) · ⬜(없음)&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;하루에 딱 한 단어.&lt;/strong&gt; 모두가 같은 문제를 풀고, 결과를 이모지 격자로 공유&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;이 &amp;ldquo;하루 한 문제 + 색 힌트&amp;rdquo; 조합이 은근히 중독적이라 한때 어마어마하게 유행했죠. 저는 이걸 &lt;strong&gt;한글로&lt;/strong&gt; 만들어보고 싶었습니다.&lt;/p&gt;
&lt;h2 id="한글로-워들을-만들면"&gt;한글로 워들을 만들면
&lt;/h2&gt;&lt;p&gt;영어는 알파벳을 한 칸씩 맞히면 되는데, 한글은 어떻게 할까요? 핵심은 &lt;strong&gt;한글 한 글자가 자모로 쪼개진다&lt;/strong&gt;는 거예요.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&amp;lsquo;버&amp;rsquo; = ㅂ + ㅓ&lt;/li&gt;
&lt;li&gt;&amp;lsquo;스&amp;rsquo; = ㅅ + ㅡ&lt;/li&gt;
&lt;li&gt;받침이 있으면 셋 — &amp;lsquo;박&amp;rsquo; = ㅂ + ㅏ + ㄱ&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;그래서 영어 워들이 알파벳 칸을 색칠하듯, 한글 워들은 &lt;strong&gt;초성·중성·종성(자모) 한 칸씩&lt;/strong&gt; 색칠해서 알려줍니다. 화면은 이렇게 생겼어요:&lt;/p&gt;
&lt;p&gt;&lt;img alt="한글 단어 맞히기 시작 화면" class="gallery-image" data-flex-basis="269px" data-flex-grow="112" height="890" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-2/hangul-word-start.webp" srcset="https://junstellar.github.io/p/ai-game-lab-build-2/hangul-word-start_hu_fc1f965da2fa06ca.webp 800w, https://junstellar.github.io/p/ai-game-lab-build-2/hangul-word-start.webp 1000w" width="1000"&gt;&lt;/p&gt;
&lt;h2 id="이렇게-플레이합니다"&gt;이렇게 플레이합니다
&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;오늘의 두 글자 단어&lt;/strong&gt;가 정해져 있어요 (하루 한 번, 모두 같은 문제)&lt;/li&gt;
&lt;li&gt;두 글자를 입력하면, 자모마다 색이 칠해집니다 — 🟩 자리까지 맞음 / 🟨 있지만 다른 자리 / ⬜ 없음&lt;/li&gt;
&lt;li&gt;이 색 힌트를 보고 좁혀가며 &lt;strong&gt;여섯 번 안에&lt;/strong&gt; 맞히면 됩니다&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;예를 들어 정답이 &amp;lsquo;버스&amp;rsquo;일 때 &amp;lsquo;구름&amp;rsquo;을 넣으면, &amp;lsquo;름&amp;rsquo;의 ㅡ가 초록으로 뜹니다(정답 &amp;lsquo;스&amp;rsquo;의 ㅡ와 자리까지 일치). 이렇게 자모를 하나씩 맞춰가는 거예요:&lt;/p&gt;
&lt;p&gt;&lt;img alt="자모 색칠과 점진적 힌트" class="gallery-image" data-flex-basis="171px" data-flex-grow="71" height="1400" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/p/ai-game-lab-build-2/hangul-word-play.webp" srcset="https://junstellar.github.io/p/ai-game-lab-build-2/hangul-word-play_hu_6e5c63f0be4681fb.webp 800w, https://junstellar.github.io/p/ai-game-lab-build-2/hangul-word-play.webp 1000w" width="1000"&gt;&lt;/p&gt;
&lt;h2 id="막히면-힌트가-하나씩-열립니다"&gt;막히면? 힌트가 하나씩 열립니다
&lt;/h2&gt;&lt;p&gt;여기가 이 게임에서 제일 공들인 부분이에요. 그냥 두 글자 맞히라고만 하면 시작 실마리가 없어서 너무 막막하고, 그렇다고 처음부터 설명을 다 주면 한 번에 맞혀버려서 싱겁더라고요. (사실 이 사이를 잡느라 몇 번을 갈아엎었습니다.)&lt;/p&gt;
&lt;p&gt;그래서 이렇게 했어요: &lt;strong&gt;시작은 힌트 없이. 한 번 틀릴 때마다 힌트가 하나씩, 점점 세게 열립니다.&lt;/strong&gt;&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;큰 갈래&lt;/strong&gt; — &amp;ldquo;사람이 만든 것&amp;rdquo; (수십 개 중 하나, 거의 감 안 옴)&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;분류&lt;/strong&gt; — &amp;ldquo;교통&amp;rdquo;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;설명&lt;/strong&gt; — &amp;ldquo;많은 사람이 함께 타는 대중교통&amp;rdquo;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;초성&lt;/strong&gt; — &amp;ldquo;ㅂ ㅅ&amp;rdquo;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;첫 글자&lt;/strong&gt; — &amp;ldquo;버_&amp;rdquo;&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;위 스크린샷에서 보드 위에 쌓인 초록 상자들이 그거예요(세 번 틀려서 세 개 열린 상태). 덕분에 &lt;strong&gt;감 좋으면 힌트 없이 빨리 맞혀 고득점&lt;/strong&gt;, 막히면 틀릴수록 점점 좁혀지는 도움을 받습니다. 난이도를 플레이어가 스스로 조절하는 셈이죠.&lt;/p&gt;
&lt;h2 id="그리고-결과-공유"&gt;그리고 결과 공유
&lt;/h2&gt;&lt;p&gt;맞히고 나면 결과가 &lt;code&gt;🟩🟨⬜&lt;/code&gt; 이모지 격자로 만들어져서 한 번에 공유할 수 있어요. 정답은 안 보여주고 &amp;ldquo;몇 번 만에, 얼마나 헤맸는지&amp;quot;만 색으로 남기는 워들 방식 그대로입니다. 연속 출석과 누적 점수도 기기에 차곡차곡 쌓이고요.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;그래서 지금 &lt;a class="link" href="https://junstellar.github.io/games/" &gt;게임 랩&lt;/a&gt;엔 게임이 둘입니다 — 🎨 AI 그림 맞히기, 🟩 한글 단어 맞히기.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/hangul-word/" &gt;한글 단어 맞히기 한 판&lt;/a&gt;&lt;/strong&gt; 해보시고, 오늘 단어 몇 번에 맞혔는지 · 힌트가 적당한지 알려주세요. &amp;ldquo;이 단어 힌트가 이상하다&amp;rdquo; 하는 게 있으면 바로 고칩니다. 🚀&lt;/p&gt;
&lt;p&gt;&lt;em&gt;다음 편엔 세 번째 게임이나, 아니면 사람들이 실제로 하러 왔는지 이야기를 들고 오겠습니다.&lt;/em&gt;&lt;/p&gt;</description></item><item><title>AI로 게임 만들어 돈 벌기, 진짜 될까? — 혼자 그림 퀴즈 게임 만든 이야기 (공개빌드 #1)</title><link>https://junstellar.github.io/p/ai-game-lab-build-1/</link><pubDate>Mon, 06 Jul 2026 22:00:00 +0900</pubDate><guid>https://junstellar.github.io/p/ai-game-lab-build-1/</guid><description>&lt;p&gt;얼마 전 유튜브를 보다가 우연히 흥미로운 이야기를 봤습니다. 어떤 사람이 &lt;strong&gt;AI로 며칠 만에 만든&lt;/strong&gt; 브라우저 비행 게임 하나로 &lt;strong&gt;큰돈을 벌었다&lt;/strong&gt;는 거예요. &lt;strong&gt;fly.pieter.com&lt;/strong&gt; 이라는 게임이었죠. 그래픽이 대단한 것도 아닌데, 게임 속 하늘에 뜬 &lt;strong&gt;광고판 자리를 팔아&lt;/strong&gt; 수익을 냈다고 하더라고요.&lt;/p&gt;
&lt;p&gt;만든 사람은 &lt;strong&gt;피터 레벨스(Pieter Levels)&lt;/strong&gt;, 네덜란드의 1인 개발자입니다. 투자도 직원도 없이 &lt;strong&gt;혼자&lt;/strong&gt; 여러 서비스(Nomad List, Remote OK, PhotoAI 등)를 만들어 운영하는 사람인데, 방식이 인상적이었어요 — &lt;strong&gt;혼자, 빠르게&lt;/strong&gt; 만들고, 첫날부터 매출을 내고, 기술은 극단적으로 단순하게 가고, 무엇보다 &lt;strong&gt;만드는 과정을 매일 공개(build in public)&lt;/strong&gt; 합니다. fly.pieter.com도 AI(이른바 &amp;lsquo;바이브 코딩&amp;rsquo;)로 뚝딱 만들어 그 과정을 공유하며 키운 게임이었죠.&lt;/p&gt;
&lt;p&gt;그 영상을 보고 나니 이런 생각이 들었습니다. &lt;em&gt;&amp;ldquo;나도 뭐라도 하나 더 해봐야겠다. 그럼… 게임을 한번 만들어볼까?&amp;rdquo;&lt;/em&gt; 이 글은 그 생각으로 실제로 만들어 본 게임 이야기입니다.&lt;/p&gt;
&lt;h2 id="내가-이-이야기에서-얻은-것"&gt;내가 이 이야기에서 얻은 것
&lt;/h2&gt;&lt;p&gt;솔직히 처음엔 &amp;lsquo;큰돈 벌었다&amp;rsquo;는 대목에 혹했습니다. 그런데 며칠 곱씹어 보니, 정작 제 마음에 남은 건 돈이 아니라 &lt;strong&gt;태도&lt;/strong&gt;였어요.&lt;/p&gt;
&lt;p&gt;거창한 계획이나 완벽한 결과물부터 준비하는 게 아니라, &lt;strong&gt;일단 작게 시작해서 만드는 과정을 공개하고, 거기서부터 한 걸음씩 쌓아 올린다&lt;/strong&gt; — 이 방식이요. 결과가 어떻게 되든, 시작을 해보고 그 과정을 기록으로 남기는 것만으로도 분명 남는 게 있겠다는 마음이 생겼습니다.&lt;/p&gt;
&lt;p&gt;마음을 그렇게 먹고 나니 방향은 분명해졌어요. 거창한 3D 게임 같은 건 한참 나중 일이고, 지금은 &lt;strong&gt;작고, 나만 할 수 있고, 재미있는&lt;/strong&gt; 걸 하나 만들어서 그 과정을 여기에 공개하기로요. 그렇게 만들기 시작했습니다.&lt;/p&gt;
&lt;h2 id="그래서-고른-전략--내-무기는-집에-있는-gpu"&gt;그래서 고른 전략 — 내 무기는 &amp;lsquo;집에 있는 GPU&amp;rsquo;
&lt;/h2&gt;&lt;p&gt;남들이 쉽게 못 하는 걸 해야 승산이 있죠. 저한테는 남들에게 없는 무기가 하나 있습니다. 바로 &lt;a class="link" href="https://junstellar.github.io/p/claude-local-image-generation/" &gt;지난 글에서 세팅한 &lt;strong&gt;집 게이밍 노트북의 로컬 이미지 생성기(ComfyUI)&lt;/strong&gt;&lt;/a&gt;예요.&lt;/p&gt;
&lt;p&gt;&amp;lsquo;AI 이미지로 하는 게임&amp;rsquo;은 보통 &lt;strong&gt;이미지 생성 API 비용&lt;/strong&gt; 때문에 개인이 하기 부담스럽습니다. 그런데 저는 RTX 4060 노트북으로 그림을 &lt;strong&gt;공짜로 무제한&lt;/strong&gt; 뽑을 수 있어요. 남들이 돈 때문에 못 하는 걸 전기값만 내고 하는 거죠. 이 무기를 살리는 게임이 뭘까 고민하다 나온 게 —&lt;/p&gt;
&lt;h2 id="첫-작품-ai-그림-맞히기"&gt;첫 작품: 「AI 그림 맞히기」
&lt;/h2&gt;&lt;p&gt;👉 &lt;strong&gt;지금 바로 플레이: &lt;a class="link" href="https://junstellar.github.io/games/guess-image/" &gt;AI 그림 맞히기&lt;/a&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;규칙은 단순합니다. &lt;strong&gt;AI가 그린 그림 한 장을 보고, 뭘 그린 건지 맞히면 됩니다.&lt;/strong&gt; 예를 들면 이런 그림들이에요.&lt;/p&gt;
&lt;p&gt;&lt;img alt="우주복 입은 고양이" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/games/guess-image/img/astro-cat.webp"&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt="초밥으로 만든 용" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/games/guess-image/img/sushi-dragon.webp"&gt;&lt;/p&gt;
&lt;p&gt;&lt;img alt="수박 속 바다" loading="lazy" sizes="(max-width: 767px) calc(100vw - 30px), (max-width: 1023px) 700px, (max-width: 1279px) 950px, 1232px" src="https://junstellar.github.io/games/guess-image/img/watermelon-sea.webp"&gt;&lt;/p&gt;
&lt;p&gt;(정답은&amp;hellip; 직접 맞혀보세요 😏)&lt;/p&gt;
&lt;p&gt;처음엔 4지선다 객관식으로 만들었는데, 테스트하던 지인이 **&amp;ldquo;이건 우리집 거북이도 맞히겠다&amp;rdquo;**고 해서 갈아엎었습니다. 그래서 지금은 이렇게 됐어요.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;한 문제에 기회 3번&lt;/strong&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;1차&lt;/strong&gt; — 그냥 직접 입력해서 맞히기 (&lt;code&gt;+3점&lt;/code&gt;)&lt;/li&gt;
&lt;li&gt;틀리면 &lt;strong&gt;힌트&lt;/strong&gt;를 주고 다시 (&lt;code&gt;+2점&lt;/code&gt;)&lt;/li&gt;
&lt;li&gt;또 틀리면 마지막으로 &lt;strong&gt;객관식&lt;/strong&gt; (&lt;code&gt;+1점&lt;/code&gt;)&lt;/li&gt;
&lt;/ol&gt;
&lt;/li&gt;
&lt;li&gt;빨리 맞힐수록 고득점, 최종 &lt;strong&gt;총점 /15&lt;/strong&gt;로 마무리&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;연속 출석&lt;/strong&gt;과 &lt;strong&gt;누적 점수&lt;/strong&gt;가 기기에 쌓이고 (계정·로그인 없이)&lt;/li&gt;
&lt;li&gt;결과는 &lt;code&gt;🟩🟨🟧🟥&lt;/code&gt; 이모지로 만들어 &lt;strong&gt;한 번에 공유&lt;/strong&gt; (워들 방식)&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;현재 문제는 &lt;strong&gt;30개&lt;/strong&gt;, 한 판에 그중 &lt;strong&gt;무작위 5개&lt;/strong&gt;가 나옵니다. 그래서 &amp;ldquo;다시 하기&amp;quot;를 누를 때마다 다른 그림이 나와요.&lt;/p&gt;
&lt;h2 id="이미지-30장-어떻게-만들었나--집-gpu로-공짜"&gt;이미지 30장, 어떻게 만들었나 — 집 GPU로 공짜
&lt;/h2&gt;&lt;p&gt;여기가 이 프로젝트의 핵심입니다. 문제로 쓸 그림 30장을 전부 &lt;strong&gt;집 노트북에서 직접&lt;/strong&gt; 뽑았어요.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;ComfyUI + SDXL로 프롬프트를 주고 그림 생성 (&lt;strong&gt;장당 약 30초&lt;/strong&gt;)&lt;/li&gt;
&lt;li&gt;클라우드 API였으면 수십 장에 돈이 나갔겠지만, 로컬이라 &lt;strong&gt;전기값 빼고 0원&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;뽑은 PNG 30장(48MB)을 &lt;strong&gt;WebP로 변환&lt;/strong&gt;해서 총 &lt;strong&gt;2.2MB&lt;/strong&gt;로 압축 (웹에서 빠르게 뜨도록)&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;마음에 안 드는 그림은 프롬프트만 고쳐서 다시 뽑으면 되니까, 문제 풀을 늘리는 비용이 사실상 공짜예요. &lt;strong&gt;&amp;ldquo;AI 이미지 게임&amp;quot;에 로컬 GPU가 왜 강력한 무기인지&lt;/strong&gt;가 여기서 드러납니다.&lt;/p&gt;
&lt;h2 id="왜-게임-하나가-아니라-게임-랩인가"&gt;왜 &amp;lsquo;게임 하나&amp;rsquo;가 아니라 &amp;lsquo;게임 랩&amp;rsquo;인가
&lt;/h2&gt;&lt;p&gt;이 게임은 사실 &lt;a class="link" href="https://junstellar.github.io/games/" &gt;&lt;strong&gt;AI 게임 랩&lt;/strong&gt;&lt;/a&gt;이라는 미니게임 &lt;strong&gt;라이브러리&lt;/strong&gt;의 1번 작품입니다. 게임 하나만 딸랑 만들지 않고 라이브러리로 만든 이유는 —&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;게임 하나가 안 터져도 &lt;strong&gt;라이브러리 자체가 자산&lt;/strong&gt;으로 남고&lt;/li&gt;
&lt;li&gt;**&amp;ldquo;AI로 게임을 계속 찍어내는 사람&amp;rdquo;**이라는 이야기가 공개빌드에 딱 맞기 때문입니다&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;구조도 그렇게 짰어요. 새 게임을 추가하려면 &lt;strong&gt;폴더 하나 복사 + 목록에 한 줄&lt;/strong&gt; 추가면 끝나고, 점수 공유·누적 기록 같은 공통 기능은 모든 게임이 나눠 쓰도록 만들었습니다. 앞으로 여기에 게임을 계속 얹을 겁니다.&lt;/p&gt;
&lt;h2 id="앞으로도-계속-쌓아-나가려고요"&gt;앞으로도 계속 쌓아 나가려고요
&lt;/h2&gt;&lt;p&gt;게임을 만드는 것보다, 사실 이걸 &lt;strong&gt;꾸준히 이어가는 것&lt;/strong&gt;이 더 어려운 일이겠죠. 그래서 저는 완성한 다음에 &amp;ldquo;이제 뭐 하지?&amp;ldquo;를 고민하는 대신, &lt;strong&gt;만드는 과정부터 이렇게 글로 남기기로&lt;/strong&gt; 했습니다. 이 글이 그 1편이고요.&lt;/p&gt;
&lt;p&gt;계획은 거창하지 않습니다.&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;만드는 과정을 계속 &lt;strong&gt;공개&lt;/strong&gt;하고 (공개빌드)&lt;/li&gt;
&lt;li&gt;게임에 &lt;strong&gt;공유 기능을 내장&lt;/strong&gt;해서 (플레이한 사람이 결과를 편하게 나눌 수 있게)&lt;/li&gt;
&lt;li&gt;게임을 &lt;strong&gt;하나씩 계속 얹어서&lt;/strong&gt; 라이브러리를 키운다&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;내세울 결과는 아직 없습니다. 이제 막 1편이니까요. 하지만 &lt;strong&gt;한 걸음씩 꾸준히 쌓아 나가는 것&lt;/strong&gt;, 그게 지금 저한테 제일 중요한 일입니다.&lt;/p&gt;
&lt;hr&gt;
&lt;p&gt;그러니 이 글의 마무리는 부탁으로 하겠습니다. 👇&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;&lt;a class="link" href="https://junstellar.github.io/games/guess-image/" &gt;「AI 그림 맞히기」 한 판 해보기&lt;/a&gt;&lt;/strong&gt; — 몇 점 나오는지, 어떤 그림에서 빵 터졌는지 알려주시면 다음 편에 반영하겠습니다. 여러분이 놀아주는 게, 이 실험의 진짜 연료입니다. 🚀&lt;/p&gt;
&lt;p&gt;&lt;em&gt;다음 편엔 두 번째 게임을 들고 오겠습니다.&lt;/em&gt;&lt;/p&gt;</description></item></channel></rss>