토스ㅣSLASH 23 - Rally로 3분 만에 애니메이션 완성하기
SLASH 토스 · YouTube
AI 핵심 요약
디자이너의 시안과 프로토타입을 플랫폼별로 다시 구현하던 기존 방식은 결과가 달라지기 쉽고, 용어와 애니메이션 스케줄을 맞추는 데도 많은 소통과 유지보수가 필요했습니다. 이를 해결하기 위해 토스 인터랙션 팀은 Android·iOS·웹에서 공통 언어와 로직을 공유하는 애니메이션 라이브러리 Rally를 만들었습니다. Rally는 움직임을 정의하는 모션, 타깃에 연결해 재생하는 랠리, 여러 랠리의 순서와 방식을 정하는 타임라인으로 구성되며 프리셋과 재생 제어 기능도 제공합니다. 디자이너가 인터랙션 스펙이나 수도 코드를 전달하고 개발자가 플랫폼별로 구현하는 흐름을 통해 개발 허들을 낮추고 일관된 인터랙션을 만드는 것이 핵심입니다.
- 플랫폼마다 반복 횟수나 왕복 재생 같은 용어와 동작이 다르면, 공통 스펙을 먼저 정의해 협업 기준을 맞추는 것이 중요합니다.
- 모션은 움직임의 세부 사항을, 랠리는 타깃에 연결해 재생하는 단위를, 타임라인은 여러 랠리의 재생 순서를 담당하도록 역할을 나눕니다.
- 동시 재생은 Parallel, 순차 재생은 Serial, 간격을 둔 순차 재생은 Stagger로 표현해 복잡한 애니메이션의 흐름을 관리할 수 있습니다.
- 반복해서 쓰는 움직임은 프리셋으로 만들어 구현 편차를 줄이고, 재생·일시정지·역재생·특정 시점 이동 같은 제어 기능도 고려하세요.
소개
개발 허들을 낮추면서도, 더 좋은 퀄리티의 인터렉션을 제공하는 방법은 뭘까요? 더 생동감 있는 사용자 경험을 위해 제작한 애니메이션 라이브러리 ‘Rally’를 소개합니다. 최선웅 / 토스 Android Developer 이동현 / 토스 iOS Developer 발표 자료 👉🏻 https://bit.ly/42LzeyZ 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://bit.ly/43kW3tO 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im 토스에 합류하고 싶다면 👉🏻 https://toss.im/career/jobs #랠리 #androiddeveloper #iosdeveloper #토스 #개발자컨퍼런스 #SLASH *본 발표자료의 저작권은 연사에 있으며, 저작권자의 사전 서면 동의 없이 자료의 일부 또는 전부를 이용하거나 배포할 수 없습니다. *또한 해당 자료를 복제하여 SLASH 행사 홈페이지를 제외한 온라인상...
비슷한 학습 자료
컨퍼런스 SLASH
업무를 더 효율적으로, 최대의 성과를 낼 수 있는 법은 무엇일까요? 클러스터 운영부터 서비스 라이프사이클 관리까지, 데브옵스 업무 효율화 사례를 소개합니다. 양석준 / DevOps Engineer 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://toss.im/slash-24 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im 토스에 합류하고 싶다면 👉🏻 https://toss.im/career/jobs #토스 #개발자컨퍼런스 #SLASH #SLASH24 #devops #cluster 유의 사항 *본 발표자료의 저작권은 연사에 있으며, 저작권자의 사전 서면 동의 없이 자료의 일부 또는 전부를 이용하거나 배포할 수 없습니다. *또한 해당 자료를 복제하여 SLASH 행사 홈페이지를 제외한 온라인상에 게재하는 행위는 연사가 동의한 저작권 및 배포전송권에 위배됩니다. *토스가 다루는 모든 개인정보는 고객에게 동의를 받은 후에 처리...
데브옵스 · 인프라
컨퍼런스 SLASH
평균 경력 10년의 TPO와 서버 개발자들은 토스에서 어떤 성취를 이뤘고, 또 어떤 고민을 하고 있을까요? 토스 제품의 기반이 되는 Product Foundation을 만드는 이들의 이야기, SLASH23 특별 세션에서 만나 보세요. 김보람, 임희진/ 토스 Technical Product Owner 김현준, 박재현 / 토스 Server Developer 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://bit.ly/43kW3tO 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im 토스에 합류하고 싶다면 👉🏻 https://toss.im/career/jobs #토스 #개발자컨퍼런스 #slash *본 발표자료의 저작권은 연사에 있으며, 저작권자의 사전 서면 동의 없이 자료의 일부 또는 전부를 이용하거나 배포할 수 없습니다. *또한 해당 자료를 복제하여 SLASH 행사 홈페이지를 제외한 온라인상에 게재하는 행위는 연사가 동의한 ...
컨퍼런스 SLASH
토스ㅣSLASH 23 - 레고처럼 조립하는 토스 앱
컨퍼런스 SLASH
수많은 서비스를 담고 있는 대규모 iOS 앱에 어울리는 아키텍처는 무엇일까요? 프로젝트 간의 의존성과 모듈 간의 결합도를 낮춰, 더 효율적인 서비스 개발, 관리를 이뤄낸 과정을 소개합니다. 이준석, 송범근 / 토스 iOS Developer 발표 자료 👉🏻 https://bit.ly/3J33r5k 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://bit.ly/43kW3tO 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im 토스에 합류하고 싶다면 👉🏻 https://toss.im/career/jobs #microfeaturesarchitecture #microfeatures #iosdeveloper #토스 #개발자컨퍼런스 #SLASH *본 발표자료의 저작권은 연사에 있으며, 저작권자의 사전 서면 동의 없이 자료의 일부 또는 전부를 이용하거나 배포할 수 없습니다. *또한 해당 자료를 복제하여 SLASH 행사 홈페이지를 제...
모바일 앱 개발
컨퍼런스 SLASH
토스ㅣSLASH 23 - 누구나 쓸 수 있는 접근성 높은 토스 만들기
컨퍼런스 SLASH
디지털화로 더 편리해진 금융, 과연 모두에게 편리해졌을까요? 모두가 평등하게, 쉽고 편리한 금융 경험을 할 수 있도록 ‘접근성’을 높인 토스의 노력을 소개합니다. 최동근 / 토스 Andriod Developer 발표 자료 👉🏻 https://bit.ly/42xGdvd 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://bit.ly/43kW3tO 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im 토스에 합류하고 싶다면 👉🏻 https://toss.im/career/jobs #디자인시스템 #접근성 #androiddeveloper #토스 #개발자컨퍼런스 #SLASH *본 발표자료의 저작권은 연사에 있으며, 저작권자의 사전 서면 동의 없이 자료의 일부 또는 전부를 이용하거나 배포할 수 없습니다. *또한 해당 자료를 복제하여 SLASH 행사 홈페이지를 제외한 온라인상에 게재하는 행위는 연사가 동의한 저작권 및 배포전송권에 위배됩...
모바일 앱 개발 UI/UX
컨퍼런스 SLASH
토스ㅣSLASH 23 - 퍼널: 쏟아지는 페이지 한 방에 관리하기
컨퍼런스 SLASH
매끄럽고 우아한 사용자 경험을 위한 개발자의 경험도 우아할 수 있을까요? 수많은 화면과 쏟아지는 분기를 효과적으로 관리하는 ‘퍼널’ 설계에 대해 소개합니다. 진유림 / 토스 Frontend Developer 발표 자료 👉🏻 https://bit.ly/3WZip27 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://bit.ly/43kW3tO 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im 토스에 합류하고 싶다면 👉🏻 https://toss.im/career/jobs #퍼널 #라이브러리 #frontenddeveloper #토스 #개발자컨퍼런스 #SLASH *본 발표자료의 저작권은 연사에 있으며, 저작권자의 사전 서면 동의 없이 자료의 일부 또는 전부를 이용하거나 배포할 수 없습니다. *또한 해당 자료를 복제하여 SLASH 행사 홈페이지를 제외한 온라인상에 게재하는 행위는 연사가 동의한 저작권 및 배포전송권에 위배됩니다....
프론트엔드
컨퍼런스 SLASH
토스ㅣSLASH 21 - 결제 시스템의 SDK와 API 디자인
컨퍼런스 SLASH
PG 연동 개발자들에게 쉽고 빠른 가이드 제공을 위해, 20년 동안 유지된 기존 시스템에 추상화 레이어를 만들고 SDK와 API를 설계했던 경험을 공유합니다. 추가로 인터페이스의 일관성과 예측 가능성 그리고 TypeScript와 npm 모듈 지원을 위한 시도들까지, 토스페이먼츠 오픈 API의 첫 여정에 대해 공유합니다. 이홍채 / 토스페이먼츠 Technical Product Owner 이현섭 / 토스페이먼츠 Frontend Developer 박순영 / 토스페이먼츠 Server Developer 토스 개발자 컨퍼런스 SLASH에 대한 자세한 정보는 👉🏻 https://toss.im/slash-21 컨퍼런스 및 세션에 대한 문의는 👉🏻 slash@toss.im *영상 15분 10초 발표 장표 중 'code(2번째)'를 'message'로 정정하오니 참고해주십시오. #토스 #개발자컨퍼런스 #SLASH
프론트엔드 백엔드 개발 도구