소개

• 다양한 프로덕트를 일관된 사용자 경험으로 제공하기 위해 설계된 공용 디자인 시스템입니다.
• Atomic Design Pattern 기반으로 구성하여, UI의 재사용성과 확장성을 높였습니다.
• 디자인과 개발 간 협업 효율을 높이고, 다수의 프로젝트에 걸쳐 일관된 브랜드 경험을 제공하는 것을 목표로 합니다.

역할

• Atomic Design 패턴에 기반한 컴포넌트 구조 설계 및 구현
• Storybook을 활용한 UI 컴포넌트 문서화 및 테스트 환경 구성
• Monorepo(Yarn Berry) 기반 구조 설계 및 관리, 여러 프로젝트 간 공통 코드 재사용성 확보
• Figma MCP 를 활용해 개발시간 단축

사용기술

• Monorepo (Yarn berry)
• Storybook
• Figma MCP

인사이트

디자이너와의 협업

처음에는 단순히 프로젝트 내의 공통영역의 컴포넌트 분리라고 생각했으나, 개발을 진행하면서 디자이너와 많은 부분을 논의해야 했습니다.

• 컴포넌트 추상화 레벨 결정: 어떤 UI 요소를 디자인 시스템으로 승격시킬지 전략적 판단이 필요
• 반응형 설계 아키텍처: 디바이스별 최적화와 일관된 사용자 경험을 위한 적응형/반응형 접근법 선택