brunch

You can make anything
by writing

C.S.Lewis

by 십일번가 DESIGN May 07. 2024

두번째 게임, 11키티즈 제작기

AI를 이용한 비주얼 디자인 그리고 애니메이션

23년 11월 1일에 오픈했던 11번가 게임 이벤트 시즌1 '11클로버'를 이어 24년 4월 1일 시즌2 '11키티즈' 가 오픈되었습니다.

11키티즈는
11마리의 개성 넘치는 아기 고양이를 랜덤으로 키우는 게임으로 먹이와 간식을 모으고,
장난감을 이용해 아기 고양이들을 정성껏 돌봐주면 모든 고양이가 제각각 선물을 준답니다. 

시즌2에서는 육성의 재미를 더욱 끌어올릴 수 있도록 11마리의 아기 고양이 캐릭터들이 더욱 귀엽고 사랑스럽게 업그레이드되었습니다. 또한 혜택도 다양하게 확대되어 할인 쿠폰, 기프티콘, 스페셜 굿즈까지 제공되니, 게임의 재미를 한층 더 높여줄 거예요!



그럼, 업그레이드된 11키티즈 게임은 어떻게 만들어졌을지 키티즈 탄생과 관련하여 비주얼 및 모션 제작 과정을 소개해 볼게요.


1. 캐릭터 AI 제작 과정

게임 속 매력 있는 캐릭터는 사용자가 게임을 장기간 즐길 수 있게 하는 중요한 동기 부여 요소입니다. 

저희는 사용자들이 게임에 애정을 가질 수 있도록 각 캐릭터들의 개성을 3D 비주얼로 구현하는데 많은 노력을 기울였습니다.


11마리의 고양이 캐릭터들은 모두 AI(미드저니, 스테이블디퓨전)를 활용하여 제작되었습니다.

제작된 고양이 캐릭터 시안들
작업순서
1️⃣ 미드저니로 아이디어 시각화
2️⃣ 스테이블디퓨전을 사용하여 캐릭터의 일관된 비주얼 제작

게임 캐릭터 중 '백설냥이'는 이전 게임 '11클로버'에서 작은 화분 옆에 앉아 있던 흰 고양이입니다. 이 고양이는 이번 게임에서 스토리와 디자인에서 중요한 연결점으로 이후의 고양이들이 ‘백설냥이’를 베이스로 제작되었습니다.



백설냥이 기본형에서 변화형까지

미드저니로 제작된 고양이가 회색 고양이로 변화하는 과정


고양이뿐만 아니라 게임 배경에도 개성이 반영되도록 디자인되었습니다. 

예를 들어, 클로버와 정원에서 지내던 백설냥이는 따스하고 아늑한 거실을 배경으로 했습니다. 

미모의 고양이는 거울 앞에서 자신의 아름다움을 뽐낼 수 있는 드레스룸, 수줍은 고양이는 조용하고 편안한 서재를 배경으로 제작하여 각 캐릭터의 성격과 특성을 더욱 돋보이게 했습니다.



각 캐릭터의 개성을 반영한 배경

미드저니를 활용하여 제작된 게임 배경

게임 속 캐릭터에게 감정적으로 이입할 수 있도록 다양한 방면으로 고민하며 제작되었기에 애정 어린 마음으로 게임을 즐기며 캐릭터들과 깊은 연결을 맺을 수 있기를 바랍니다.




2. 캐릭터 아이템 소개

게임의 아이템은 사용자의 몰입도와 흥미를 유지하기 위해 큰 역할을 해 주는데요.


11키티즈의 11마리 고양이들은 각자의 매력을 살려 부여된 아이템들이 있습니다. 

창작의 고통은 괴롭지만 고양이에게 뭐가 어울릴지 고민하며 아이템들을 입혀보는 일은 재미있는 과정이었습니다. 특히 ‘미모의 고양이’가 그랬는데, 이 캐릭터는 보자마자 왕관을 씌워야겠다고 생각했죠! 

좌 : 백설냥이 / 우 : 미모의 고양이

정기적인 업데이트를 통해 다양한 아이템을 추가할 예정이니 계속해서 새로운 내용을 탐험하며 고양이를 꾸며주세요! 




3. 애니메이션 제작 과정 

귀엽게 제작된 2D 이미지인 고양이를 어떻게 자연스럽게 움직이게 할 것인지에 대해 고민했는데요.

다양한 툴을 테스트해 본 끝에 Adobe After Effects로 애니메이팅 하는 것으로 결정되었습니다.


작업순서
1️⃣ 캐릭터를 파트별 분리 및 리터칭
2️⃣ After Effects로 모션 제작



캐릭터 파트별 분리 및 리터칭

백설냥이 분리

귀, 입, 눈동자, 눈 흰자, 발, 꼬리로 분리하였고, 움직일 때 자연스럽게 연결돼 보이도록 추가로 리터칭 해줍니다. 그 외에 고양이 표정을 표현하기 위해 슬픈 표정, 감은 눈, 웃는 눈, 즐거운 입도 새로 그려 넣었습니다.




분리하는 과정에서 가장 신경 썼던 부분은 털입니다. 

어색해 보이는 부분은 새롭게 그려야 되었는데, 진짜처럼 보이도록 포토샵으로 하나하나 그려 넣거나 털 브러시를 이용해 방향에 맞춰 붙여 넣기도 하였습니다.

미모의 고양이 털 작업

이렇게 캐릭터를 부위별로 분리하고 한 땀 한 땀 그리다 보면 조물주가 된 듯 고양이에게 애정이 생기게 됩니다.




After Effects 모션 제작

분리된 이미지들을 가지고 다음 단계로 넘어가 볼까요? 

애프터 이펙트의 ‘퍼펫 핀 툴’ 기능을 활용해 각 부위에 핀을 찍고, 핀들을 움직이면서 고양이 애니메이션을 만듭니다. 표정이나 움직일 때 몸통의 디테일한 부분을 참고하기 위해 다양한 동물 애니메이션을 참고했습니다. 

단순한 2D 이미지에 생명력을 불어넣는 것은 무에서 유를 창조하는 것과 같습니다. 

생생한 움직임을 넣기 위해 어떻게 꼬리를 움직일지, 어떻게 입을 움직이고 그때 볼과 눈가는 어떻게 표현할지, 귀와 몸통은 어떻게 움직이고 있을지 등과 같은 고민을 많이 합니다. 

그렇게 1시간가량 핀을 이리저리 움직여 보다가 맘에 드는 결과물이 나오지 않으면 찍었던 핀들을 삭제하고 다시 처음부터 시작했더랬죠..



가장 핀이 많이 찍혀 있는 곳은 단연 얼굴입니다.

노란색 원이 핀 이 찍힌 곳입니다.



이제 결과물을 볼까요? 

쓰다듬었을 때 나오는 모션 (백설냥이)


지금까지 '11키티즈'의 작업 스토리를 살펴보았습니다. 

더욱 귀엽고 사랑스러운 11마리의 아기 고양이들이 여러분을 기다리고 있으니 아직 게임을 시작하지 않으셨다면 지금 바로 참여해 보세요!


11번가 소셜게임 11키티즈 바로가기 >

*게임은 APP에서 참여 가능합니다.

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari