#Design

디자이너에게 AI로 뭐든 만들어보라고 한다면

디자이너에게 AI로 뭐든 만들어보라고 한다면
01

Summary

토스 디자이너들이 AI를 다루는 법: 단순 호기심을 넘어 실무 해결사로

122개의 실험작으로 증명한 디자인 생산성의 새로운 임계점, 4가지 핵심 사례로 살펴보기

토스 디자인 챕터에서 한 달간 진행한 AI 컨테스트의 성과를 공유하며, 디자이너들이 실무의 페인 포인트를 AI로 어떻게 해결했는지 구체적인 사례를 제시한다. 단순한 툴 활용을 넘어 업무 프로세스 자체를 재설계하고 커뮤니케이션 방식까지 혁신하는 생성형 AI의 실질적인 활용 가치를 다룬다.

  • 01수년째 미해결 과제였던 이미지 컬러 추출 로직을 AI 코딩 보조로 해결하여 실제 상용 서비스 적용
  • 02개인의 과거 커뮤니케이션 데이터를 학습한 슬랙 봇을 통해 반복적인 답변 업무 자동화
  • 03정적인 목업 대신 AI 도움으로 직접 코딩한 '움직이는 시안'을 통해 개발 협업 비용 최소화
  • 04AI 비디오 생성 모델 Kling을 활용하여 촉박한 일정의 뱅크 공채 웹페이지 모션 작업을 단 하루 만에 완료
  • 05AI를 '완전히 새로운 일'이 아닌 '이미 하던 일의 퀄리티와 속도를 높이는 도구'로 재정의

RECOMMENDATION

디자인 프로세스 중 반복적인 작업이나 소통 비용이 큰 구간을 찾고 있는 조직, 혹은 AI를 실무에 어디서부터 적용할지 고민인 디자이너들에게 구체적인 영감을 주는 아티클이다.

The Problem

디자이너들이 실무에서 겪는 수년 된 기술적 미해결 과제, 과도한 커뮤니케이션 비용, 정적인 시안으로 인한 개발자와의 소통 오해, 그리고 촉박한 일정 내 대량의 고퀄리티 모션 작업 요구 사항을 해결하고자 했다.

The Solution

토스 디자인 챕터는 AI 컨테스트를 개최하여 컬러 추출 자동화 로직 코딩, 개인 학습 기반의 슬랙 답변 봇 구축, 실제 제품 코드를 활용한 인터랙티브 프로토타입 제작, 그리고 AI 비디오 생성 툴(Kling)을 활용한 모션 그래픽 제작 등을 시도했다.

The Result

컬러 추출 로직은 실제 토스 쇼핑 상품 카드에 적용되었고, 슬랙 봇은 디자이너 1.5명의 역할을 수행하며 협업 비용을 줄였으며, 실제 동작하는 프로토타입으로 PO와 개발자의 의사결정을 가속화했고, 모션 그래픽은 단 하루 만에 완성되는 성과를 거두었다.

Trade-off

AI가 완벽한 최종안을 즉시 내놓기보다는 사람이 시작과 끝 프레임을 다듬거나 프롬프트를 집요하게 수정하는 '깎는' 과정이 필수적이며, 생성된 결과물의 정교함을 위해 지속적인 학습과 피드백 루프가 동반되어야 한다.

03

Key Concepts

Concept · 01

LLM 기반 커스텀 봇

대규모 언어 모델을 특정 개인이나 팀의 데이터로 추가 학습시켜 전문적인 맥락에 맞는 답변을 생성하도록 만든 도구이다.

  • 디자이너의 지식과 커뮤니케이션 스타일을 학습해 슬랙에서 질문에 대한 답변 초안을 작성하고 피드백을 통해 지속 학습함
Concept · 02

인터랙티브 프로토타입

단순한 이미지를 넘어 실제 제품처럼 동작하고 반응하는 코드로 구현된 디자인 모델이다.

  • AI의 도움으로 직접 제품 코드를 수정하여 패널 이동 및 창 크기 조절이 가능한 증권 PC 화면 프로토타입을 제작함
Concept · 03

AI 비디오 생성 (Kling)

텍스트나 이미지를 기반으로 고품질의 영상 및 애니메이션을 생성해 주는 생성형 AI 모델이다.

  • 토스뱅크 공채 페이지의 직군별 모션 그래픽을 프롬프트 수정을 통해 단시간에 고퀄리티로 생성하는 데 활용함