[태그:] 웹앱 웹툰

작성자: 컴맹 집사

대표 이미지: 앱 안에 넣은 웹툰 1화의 첫 장면 (출처: 직접 제작한 앱 그림(이미지 생성 AI 활용))

기능을 다 갖추고 나니 허전함이 생겼다. 사람들은 진단을 한 번 하고, 작위증을 공유하고, 떠났다. 다시 올 이유가 없었다. 테스트 앱의 숙명 같은 것이었다.

또 하나. “강아지는 왕, 반려인은 왕의 집사”라는 세계관은 설명만으로는 전하기 어려웠다. 첫 화면에 몇 줄 적어 두는 것으로는 이 세계가 얼마나 귀엽고 따뜻한지 전해지지 않았다. 그래서 떠올린 게 웹툰이다. 그림이라고는 졸라맨밖에 못 그리는 사람이 앱에 웹툰을 넣기까지의 이야기다.

왜 하필 웹툰이었나

AI와 이야기하며 웹툰을 고른 데에는 세 가지 이유가 있었다.

• 세계관을 이야기로 보여 줄 수 있다. 폐하를 모시는 초보 집사의 하루를 보여 주면, 설명하지 않아도 “아, 이런 세계구나” 하고 알게 된다.
• 휴대폰에 잘 맞는다. 세로로 스크롤하며 보는 웹툰은 휴대폰에서 가장 편하게 소비되는 형식이다.
• 다음 편을 기다리게 만든다. 연재 형식이면 다시 들어올 이유가 생긴다.

주인공부터 정했다: 두부 폐하와 수습집사 지우

이야기보다 먼저 캐릭터를 정했다. 흰 털에 갈색 귀를 가진 강아지 두부가 폐하, 노란 후드티를 입은 초보 집사 지우가 수습집사다. 두 캐릭터의 생김새와 옷차림, 여러 표정을 한 장에 모은 캐릭터 설정 시트를 먼저 만들었다. 지우의 옷은 가슴에 작은 왕관 로고가 있는 노란 후드티, 청바지, 흰 운동화로 못 박아 두었다.

이 시트가 나중에 가장 중요한 도구가 됐다.

AI 이미지로 같은 캐릭터를 유지하기

캐릭터를 일정하게 유지하는 게 가장 어려웠다. 1컷의 두부와 2컷의 두부가 다른 강아지처럼 보이면 만화가 안 된다. 이미지 생성 AI는 요청할 때마다 조금씩 다른 그림을 만들었다.

• 글 설명만으로는 캐릭터가 고정되지 않는다. “흰 강아지, 갈색 귀”라고 아무리 자세히 써도 컷마다 다른 강아지가 나왔다. 캐릭터 설정 시트를 참고 이미지로 함께 넣어야 같은 두부가 나왔다.
• 모델마다 결과가 다르다. 여러 이미지 모델을 시험해 보니 어떤 모델은 인물을 너무 멀리서 잡고 컷 안에 테두리까지 그려 넣었다. 가장 안정적인 모델을 골랐다.
• 장소도 고정해야 한다. 첫 화를 만들고 보니 거실 소파 색이 컷마다 갈색과 크림색을 오갔다. 다음 화부터는 “거실은 크림색 소파와 책장, 흰 커튼”처럼 장소별 배경을 미리 정해 두고 매번 넣었다. 두부의 크기도 “무릎 높이의 성견”으로 정했다. 그러자 일관성이 눈에 띄게 좋아졌다.

한 컷을 만드는 데 20초 가까이 걸렸고, 요청이 몰리면 잠시 기다리라는 응답이 오기도 했다. 이런 경우 자동으로 다시 시도하게 해 두니 사람이 지켜보지 않아도 끝까지 만들어졌다.

말풍선은 그림에 넣지 않았다

처음엔 말풍선과 대사까지 그림에 넣으려 했다. 그런데 이미지 생성 AI는 한글을 정확히 그리지 못하는 경우가 많았다. 대사가 이상한 모양으로 뭉개졌다.

그래서 그림에는 말풍선 없이 장면만 넣고, 대사는 앱 화면에서 글자로 올렸다. 그림 위에 말풍선 모양의 상자를 겹치고 그 안에 글자를 쓰는 방식이다.

여기서 재미있는 실수가 있었다. 그림에 “말풍선이 들어갈 빈 자리를 남겨 줘”라고 요청했더니, AI가 빈 네모 상자를 그려 넣었다. 말 그대로 “빈 자리”를 그린 것이다. “상자나 테두리는 그리지 말고, 배경이 자연스럽게 이어지게, 컷 전체를 채워 줘”로 바꾸자 해결됐다. AI에게는 하지 말아야 할 것도 분명하게 말해야 한다는 걸 배웠다.

대사를 글자로 올리니 좋은 점이 더 있었다.

• 대사를 고칠 때 그림을 다시 만들 필요가 없다.
• 글자가 선명하다. 휴대폰에서 확대해도 깨지지 않는다.
• 나중에 영어판, 일본어판으로 바꾸기도 쉽다.

완벽하지 않아도 공개했다

첫 화 15컷을 모두 만들고 검토해 보니 아쉬운 점이 남아 있었다. 몇몇 컷에서 두부가 강아지처럼 작게 나오거나, 한 컷은 표정이 고양이 같았다. 다시 만들지 고민하다가 지금 상태로 공개하기로 했다. 문제 컷은 기록해 두고, 나중에 같은 파일 이름으로 새 그림을 만들어 덮어쓰면 되기 때문이다. 완벽을 기다리다 아무것도 못 올리는 것보다 낫다고 판단했다.

휴대폰에서 빠르게 보이게 하기

웹툰 이미지를 앱에 넣자 새 문제가 생겼다. 웹툰 화면을 열면 이미지가 뜨는 데 몇 초가 걸렸다. 특히 데이터가 느린 곳에서는 흰 화면이 한참 이어졌다.

해결 방법은 두 가지가 있었다.

1. 이미지 크기 줄이기
생성된 이미지는 한 장에 수 MB나 됐다. AI가 만들어 준 변환 도구로 휴대폰 화면 너비에 맞춰 가로 800픽셀로 줄이고, 용량이 작은 WebP 형식으로 바꿨다. 15컷을 다 합쳐도 1MB가 안 됐다.

2. 보일 때 불러오기(지연 로딩)
모든 컷을 한꺼번에 불러오지 않고, 화면에 곧 보일 이미지만 불러오게 했다. (출처: MDN 웹 문서, 지연 로딩) 이미지 태그에 loading="lazy"라는 짧은 설정 하나로 가능했다. AI는 이걸 지연 로딩(lazy loading)이라고 불렀다. 필요할 때까지 미루니 첫 화면이 빨라진다.

뷰어 위쪽에는 얼마나 읽었는지 보여 주는 진행 막대를, 마지막 컷 아래에는 “나도 왕실 집사 되기” 버튼을 넣었다. 웹툰을 다 본 사람이 자연스럽게 진단으로 넘어오도록 한 것이다.

올리면 안 되는 파일

웹툰 작업을 하다 보니 앱 폴더 안에 초안 그림과 작업용 파일이 잔뜩 쌓였다. 이 앱은 저장소의 파일이 그대로 인터넷에 올라간다. 초안 폴더를 그냥 두면 미완성 그림이 누구나 볼 수 있는 주소로 공개될 수 있다.

그래서 초안은 앱 폴더 밖의 별도 폴더로 옮기고, GitHub에 올리지 않을 파일 목록(.gitignore)에도 적어 두었다. 기획서 같은 내부 문서도 공개 저장소와 분리했다. 무엇을 올리지 않을지 정하는 것도 배포의 일부였다.

저작권과 관련해 확인한 것

AI 이미지로 만든 웹툰을 공개하기 전에 확인한 것들이다.

• 이미지 생성 도구의 이용약관에서 생성한 이미지를 공개하고 광고가 붙은 곳에서 써도 되는지
• 이미지가 특정 작가나 유명 캐릭터를 닮지 않았는지
• 웹툰 이야기가 다른 작품을 베끼지 않았는지

AI가 만든 그림의 저작권 보호 범위는 아직 분명하지 않다는 점도 알게 됐다. 그래서 캐릭터 설정과 이야기, 대사, 배치처럼 사람이 직접 설계한 부분을 분명히 남겨 두려고 했다.

첫 화를 올리고 나니 반응이 괜찮았다. “다음 편은 언제 나와?”라는 말까지 들었다. 이제 웹툰을 여러 회차로 늘릴 차례였다.

---

이전 글: 회원가입 없이 데이터 저장하기, 3가지 방법 중 내가 고른 것
다음 글: 웹툰이 늘어나면 생기는 일, 회차 목록 정리하는 법