미리 만든 부품을 없애고, AI가 상자로 섬을 만들게 했습니다
회사 소개 페이지 첫 화면의 섬은 방문자가 쓴 문장에 맞춰 다시 만들어집니다. 미리 만든 부품을 모두 없애고, 땅과 사람과 물건을 AI가 상자로 조립하도록 바꾼 과정을 정리했습니다.
- 회사 소개 페이지 첫 화면의 섬은, 방문자가 쓴 문장을 AI가 읽고 그 내용대로 섬을 다시 만들어요.
- 정해진 부품 중에서 고르던 방식을 없애고 땅과 사람과 물건을 전부 상자로 조립하게 바꿨어요. 고칠 때는 바뀐 부분만 받아요.
- AI가 만든 모양은 바로 그리지 않고, 겹친 면과 떨어진 조각을 먼저 정리한 뒤에 그렸을 때 깔끔하게 보였어요.
about.pogl.com 첫 화면에는 작은 섬이 있습니다. 아래 칸에 «놀이공원», «해적 섬» 같은 문장을 쓰면 섬이 그 문장에 맞게 다시 만들어집니다.
한 문장으로 게임을 만든다는 설명은 글로만 읽으면 이해하기 어렵습니다. 그래서 첫 화면에서 몇 초 만에 직접 보여 주려고 했습니다.
«용 추가해줘»라고 써도 섬이 바뀌지 않았습니다
첫 버전의 AI는 정해진 부품 목록에서 고르기만 했습니다. 집, 나무, 성, 텐트, 배, 가로등 가운데 무엇을 몇 개 둘지 정하면, 미리 만들어 둔 모양을 그 자리에 배치하는 방식이었어요. 빠르고 단순했습니다.
그런데 목록에 없는 것은 나오지 않았습니다. «용 추가해줘»라고 써도 섬이 바뀌지 않았어요. 문장으로 게임을 만든다고 소개하는 페이지에서 입력한 문장이 반영되지 않는 것은 고쳐야 할 문제였습니다.
그래서 미리 만든 부품을 모두 지웠습니다. 지금은 섬 위의 모든 물건을 AI가 상자로 직접 조립합니다. 물건 하나는 정해진 작은 칸 안에서 상자 최대 24개로 이루어지고, 상자마다 위치와 크기와 색을 정합니다. 집은 벽과 지붕으로, 용은 몸통과 목과 날개와 꼬리로 만들어집니다.
땅과 사람도 상자로 만들었습니다
땅은 언덕 덩어리 최대 14개로 설계합니다. 덩어리마다 가운데 자리와 반지름과 층을 정하고, 겹치는 곳은 더 높은 쪽을 따릅니다. 층은 바다, 해변, 풀밭, 언덕으로 나뉘어서 덩어리 몇 개만으로도 섬처럼 보입니다. 해안에 몇 칸짜리 작은 섬 조각이 생기면 바다 높이로 낮춰서 지저분해 보이지 않게 했습니다.
사람을 만들 때는 문제가 하나 있었습니다. 처음에는 얼굴 위에 눈을, 머리 위에 복면을 겹쳐 놓았더니 같은 위치의 면이 번갈아 그려지면서 깜빡였어요.
지금은 상자를 칸 단위로 나눠서 칸마다 색을 하나만 남깁니다. 상자가 겹치면 더 작은 상자의 색을 쓰고, 바깥 면만 한 번에 그립니다. 몸에서 떨어진 조각은 지웁니다. 파티, 해적, 화성, 닌자, 우주 정거장처럼 서로 다른 주제 23가지로 확인했습니다.
물건을 놓을 자리도 AI가 정하게 했습니다
물건을 섬 위 아무 곳에나 놓으면 맵이 정리되지 않아 보였습니다. 그래서 AI가 물건을 만들 때 놓을 자리도 함께 고르게 했습니다. 랜드마크는 가운데 높은 땅에, 집은 마을처럼 모아서, 울타리는 둘레에, 야자수는 물가에, 배는 물 위에 놓습니다.
랜드마크를 하나 두고, 집이 모인 곳을 하나 두고, 나머지 자리에 자연물을 조금 배치하는 순서입니다. 레벨 디자이너들이 맵을 만들 때 흔히 쓰는 방식을 참고했습니다.
고치는 요청에는 바뀐 부분만 받습니다
«밤으로 바꿔 줘»나 «용 추가해 줘»처럼 지금 섬을 고치는 요청이면, 지금 장면 정보를 요청과 함께 보냅니다. AI는 바뀐 부분만 보내고, 그대로 둘 물건과 땅은 번호로만 지정합니다. 전체를 다시 쓰지 않으니 답이 짧고, 땅 모양과 물건 위치도 그대로 유지돼요.
섬이 바뀌기까지는 4~7초쯤 걸립니다. 그동안 빛 띠가 섬 위를 지나가고, 블록 몇 개가 떠올라 돌다가 답이 오면 새 섬 자리로 들어갑니다. 입력칸 위 안내 문구는 «섬을 살펴보는 중», «블록을 고르는 중», «쌓는 중» 순서로 바뀝니다. 실제 진행과 상관없는 진행률 표시는 쓰지 않았습니다.
로그인 없이 누구나 쓰는 칸이라 하루에 쓸 수 있는 양에는 상한을 두었습니다. 횟수가 아니라 답마다 실제로 쓴 양만큼 세고, 24시간 안에 상한이 차면 한동안 사용할 수 없습니다.
폰에서 스크롤하면 섬이 깜빡였습니다
폰으로 스크롤하면 섬이 깜빡인다는 제보를 받았습니다. 브라우저 툴바가 숨겨지고 다시 나타날 때마다 화면 높이가 바뀌었고, 그때마다 캔버스 크기를 다시 맞췄는데, 크기를 바꾸면 그려 둔 내용이 지워지고 있었어요.
지금은 화면 폭이 같으면 지금까지 나온 가장 큰 높이로 캔버스 크기를 유지하고, 그보다 커질 때만 크기를 다시 맞춘 뒤 바로 다시 그립니다.
목록에 없는 요청에도 반응해야 했습니다
목록에서 고르게 하면 빠르고 안전하지만, 데모에서는 목록에 없는 요청에 어떻게 반응하는지가 첫인상을 정합니다. «용 추가해줘»에 반응이 없으면 다른 기능이 모두 잘 작동해도 미리 만들어 둔 화면처럼 보였습니다.
AI에게 모양을 만들게 할 때는 그리기 전에 정리하는 단계를 따로 두는 것이 나았습니다. 겹친 면은 칸 하나에 색 하나만 남기고, 떨어진 조각은 지우고, 해안의 작은 섬 조각은 바다 높이로 낮춥니다. 모델이 매번 깔끔한 결과를 내기를 기대하는 것보다 이 방법이 확실했어요.
고치는 요청에는 전체를 다시 받지 않고 바뀐 부분만 받는 것이 좋습니다. 그대로 둘 것은 번호로 지정하게 하면 답이 짧아지고, 보던 장면도 바뀌지 않습니다.
