쏘카에서 진행한 디자인 시스템 'Socar Frame 2.0'의 설계와 운영 프로세스에 대한 이야기입니다. 기존 UI 라이브러리가 가졌던 역할 분담의 모호함과 유지보수의 어려움을 해결하기 위해, 단순한 컴포넌트 라이브러리를 넘어 규칙(Token), 연동 체계, 운영 프로세스를 모두 포함하는 포괄적인 '시스템'을 구축했습니다. 특히 Figma Plugin을 도입하여 디자이너가 직접 PR을 생성할 수 있도록 에셋 배포를 자동화하고, Figma Code Connect를 통해 디자인과 코드 간의 연동을 최적화한 과정이 핵심입니다. 또한, Slot 구조를 활용해 디자인의 Variant 방식과 개발의 합성 컴포넌트 구조 사이의 간극을 메운 경험도 공유하고 있습니다. 디자이너와 개발자가 협업하며 일관된 UI/UX를 유지하기 위해 어떤 기술적, 프로세스적 고민을 했는지 확인해 보세요!