토스의 AI 그래픽 생성기, 토스트를 소개합니다 #2

저번 아티클에서 토스 팀이 직접 개발한 그래픽 AI, 토스트를 소개해 드렸어요. 이번 글에서는 토스트로 이미지를 만드는 구체적인 방법과, 실제 토스 팀에서 활용한 사례들을 보여드릴게요.

금융 콘텐츠를 위한 2D 그래픽 만들기

토스에서는 토스피드를 비롯해 다양한 금융 콘텐츠를 제작하고 있어요. 금융 콘텐츠는 어렵고 복잡한 내용들이 많아서 주제를 표현할 수 있는 상징적인 소재로 커버 일러스트를 많이 만들어요.

예를 들어 ‘부동산 시장에서 상승하는 집값’을 이야기하는 콘텐츠라면, ‘집이 공중에 떠다니는 모습’으로 주제를 한 장에 표현할 수 있을 것 같아요.

아래 그림은 ‘공중에 뜬 종이 위에 있는 집’을 토스트에 입력한 결과예요. 톤이나 그래픽 기법에 대한 설명 없이 텍스트 입력만으로 그래픽을 만들 수 있어요.

하지만 결과물이 항상 좋기만 한 건 아니에요. 가끔은 의도한 대로 나오지 않아 답답한 경우도 있고, 원하는 그림이 있지만 텍스트로는 설명하기 어려울 때도 있어요.

그럴 때는 입력값으로 텍스트와 그림을 함께 넣는, ‘image to image’라는 기능을 사용해요. 왼쪽처럼 사람들이 서있는데 공간은 다른 곳을 표현하고 싶은 경우, 인물 이미지를 참조하고 ‘책을 들고 서 있는 사람들’, ‘박물관에 있는 사람들’ 같은식으로 상황을 설명해주면, 인물의 형태는 최대한 유지하며 다양한 배경을 표현할 수 있어요.

이렇게 만든 이미지들은 그대로 활용하기도 하지만 또 다른 작업을 위한 재료로 활용하기도 해요. 인물 그래픽을 먼저 만들고, 함께 배치할 오브제를 또 따로 만들어서 합성하는 식으로요. 이런 방식으로 작업하면서 작업 시간은 이전과 비교해 10분의 1 수준으로 줄었어요.

평면 이미지를 활용해 3D 그래픽 만들기

토스트의 강력한 기능 중 하나는 2D그래픽을 3D로 뚝딱 바꿔준다는 거예요. 4,000개가 넘는 리소스로 반복 학습되었기에 가능한 일인데요. 토스트에 2D 이미지를 넣어주면 이를 참고해 알아서 ‘토스다운' 3D 그래픽을 만들어줘요. 물론 토스 앱에 활용될 만큼 완성도도 높고요.

벡터 이미지로 만들어진 아이콘을 활용하거나, 원하는 그래픽과 흡사한 실사 이미지를 활용하기도 해요.

이런 방식으로 하나의 3D 그래픽을 만드는데 드는 시간은 15분 남짓이에요. 기존에 하나의 아이콘을 만들기 위해 모델링과 렌더링을 거쳐야 했던 시간과 비교하면 아주 많이 절약된 셈이죠. 토스팀이 AI를 통해 어느정도의 시간과 리소스 절약을 하고 있는지 짐작이 가시나요? 이제는 토스트 없이 일 못한다는 후문도 자자하답니다!

이번에 ‘함께 토스 켜기’에 개성있는 동물 친구들이 생긴 것 혹시 보셨나요? ‘함께 토스 켜기’는 내 주변에 토스를 켠 사람이 있을 때 서로의 캐릭터를 클릭하고 포인트를 받을 수 있는 서비스에요. 많은 분들이 좋아해주셔서 여러 캐릭터를 제공해 재미를 드리고 싶었어요. 이 때도 토스트 덕분에 빠르게 많은 캐릭터를 뽑아낼 수 있었죠.

토스증권 커뮤니티에서도 토스트로 만든 3D 그래픽이 프로필로 활용되고 있어요. 생각보다 많은 곳에서 활용하고 있다는 사실. 놀랍죠?

토스트로 더 빠르게 실험하기

토스 프로덕트 디자이너는 사용자 분들께 가치있는 제품을 만들기 위해 바쁘게 달리고 있는데요. 토스트가 탄생하면서 프로덕트 디자이너들은 그래픽 디자이너에게 요청하지 않고 바로 문구에 딱 맞는 그래픽을 넣어 실험을 돌릴 수 있고요.

또 컨셉에 맞는 프로토타입을 빠르게 구현해서 사용자분들의 의견을 수집할 수도 있어요. 이번에 만보기 서비스를 개편하면서 여러 컨셉을 테스트했는데요. 여기서 토스트를 활용해 산과 아이템 이미지를 만들어 방향성을 잡는 데에 큰 도움이 되었어요.

아래처럼 2D와 3D를 넘나들며 다양한 형태의 산 이미지를 바로 적용하고 글자나 지도의 가독성을 챙겨볼 수도 있었고요. 무려 3번의 컨셉 테스트를 단 10일만에 해냈답니다.

토스트로 더 정확하게 소통하기

최근에 토스뱅크에서 귀여운 이벤트가 있었어요. 바로 도토리 모으기 서비스예요. 아래처럼 서비스를 담당했던 프로덕트 디자이너가 전체적인 플로우에 맞춰 직접 그래픽을 만들었어요. 그래픽 디자이너는 이렇게 만들어진 그래픽의 색감과 텍스쳐를 더해 완성도를 올리는 작업을 진행했고요.

추석 복주머니 이벤트도 마찬가지예요. 토스트로 만든 돈주머니 모양에 ‘복’자를 합성해서 원하는 그림을 전달했고 이후 그래픽 디자이너가 빠르게 작업해 제품에 반영했어요.

이전처럼 서로 생각한 그림이나 방향성이 달라 다시 작업하는 일이 줄었고 서로의 의견을 반복해서 확인할 필요가 없어졌어요. 그래픽 디자이너는 더 효율적으로 일하고, 프로덕트 디자이너는 직접 아이디어를 구체화할 수 있는 최상의 환경이 된 거죠. 커뮤니케이션 비용이 이전과 차원이 다르게 줄어들었어요.

각자 레퍼런스를 찾아 의견을 싱크하고 공유하며 제작하는 지난한 과정을 이제는 거치지 않아도 돼요. 토스트에게 바로 요청하면 되니까요.

토스트가 그리는 그림

이렇게 그래픽 AI를 활용하면서 토스팀에도 많은 변화가 있었는데요. 그래픽 디자이너에게는 강력한 무기가, 메이커에게는 아이디어를 빠르게 실현할 수 있는 도구가 생겼어요. 일하는 방식이 바뀌며 많은 시간을 절약하고 좀 더 우선순위가 높은 작업에 집중할 수 있게 되었고요.

5명의 그래픽 디자이너가 토스 전체의 그래픽을 직접 관리할 수 있는 시스템이 생겼다는 것은 의미가 커요. 디자이너가 아닌 모든 팀원이 양질의 그래픽을 쉽게 접할 수 있는 토스만의 독자적인 환경을 만든 것도요.

앞으로는 또 어떤 변화를 만들어내게 될까요? 많이 기대해 주세요.