올리브영 서비스에 사용되는 컴포넌트를 모아놓은 그곳!

올리브영에서 UI 개발자가 디자인 시스템 가이드 제작 경험을 공유하는 글입니다. 디자인 시스템은 재사용 가능한 컴포넌트와 패턴을 정의한 가이드라인으로, 올리브영 서비스의 통일성과 개발 효율성을 높이기 위해 필요합니다.

글에서는 디자인 시스템의 정의, 전역 스타일 적용, Emotion을 활용한 컴포넌트 제작 방법, Emotion의 추가 기능 활용, 그리고 실제 올리브영 서비스에 디자인 시스템을 적용하는 과정에 대해 다룹니다. 이를 통해 개발자 간의 지식 수준을 일치시키고 작업의 일관성을 확보하여 생산성을 향상시키는 것을 목표로 합니다.