인터랙션, 꼭 넣어야 해요?
박연주/김지혜 · 토스 · 토스 기술 블로그
소개
빠른 속도를 중요시하는 토스에서 어떻게 팀원들을 인터랙션에 공감하게 하고 슬릭한 제품을 만들어나갈 수 있었는지 소개할게요.
AI 핵심 요약
토스의 인터랙션 팀은 모션이 단순히 화면을 예쁘게 만드는 요소로 여겨지고 개발 공수도 크다는 문제를 해결하고자 했다. 대출 심사 로딩 화면 등에서 지표 개선 사례를 만들고, 터치 이펙트처럼 앱 전반에서 쉽게 체감할 수 있는 작은 모션도 적용해 인터랙션의 효용을 알렸다. 구현 부담을 줄이기 위해 레이어를 활용한 모션 기법과 Framer용 인터랙션 컴포넌트를 만들고, iOS·Android·Web에서 함께 쓰는 공통 스펙과 개발 라이브러리 Rally를 구축했다. easing 토큰과 공통 언어를 마련하는 것뿐 아니라 Slack 채널에서 사용을 돕는 과정까지 이어가야 시스템이 실제 제품에 정착한다는 점을 배웠다.
- 인터랙션은 장식이 아니라 피드백과 행동 안내, 화면 상태 전달에 기여할 때 도입 근거가 분명해진다.
- 제품 팀을 설득할 때는 사용성 개선만 강조하기보다 이탈률·전환율 등 팀이 중요하게 보는 지표와 연결한다.
- 복잡한 모션은 레이어를 활용한 눈속임으로 구현 부담을 낮출 수 있다.
- easing 토큰과 플랫폼 공통 스펙을 정하면 디자인·개발·QA에서 모션을 구체적으로 논의하기 쉽다.
- 시스템은 배포만으로 정착되지 않으므로, 질문이 모이는 채널에서 사용법을 안내하고 피드백을 이어간다.
비슷한 학습 자료
인터랙션으로 만드는 몰입 경험 | Simplicity 4 제작기 #3
백송은 · 토스 기술 블로그
토스 팀은 점심 시간에 사용자를 만난다
서소희 · 토스 기술 블로그
효율적인 유저 리서치 환경을 만드는 리서치 플랫폼 팀, 들어보셨나요?
최정은 · 토스 기술 블로그
크고 복잡한 제품, 과감하게 갈아엎기
이지윤 · 토스 기술 블로그
Simplicity23, 오늘도 문제를 해결하고 있을 모든 디자이너에게
정희연 · 토스 기술 블로그
첫 인터랙션 디자이너가 문제를 해결하는 법
김지혜 · 토스 기술 블로그