QDSKit: 디자인 시스템 SDK 개발기

SPM(Swift Package Manager)을 활용하여 공통된 디자인 요소들을 담은 QDSKit SDK를 개발하고 배포했습니다. 이 프로젝트의 목표는 다수의 앱과 팀 간에 UI/UX의 일관성을 확보하고 개발 생산성을 높이는 것이었습니다. 재사용 가능한 UI 컴포넌트들을 설계하고 이를 SPM 기반의 라이브러리로 분리하여 모듈화 역량을 키웠습니다. 또한, 디자인 토큰과 테마 시스템을 고려한 컴포넌트 설계, 외부 라이브러리의 버전 관리 및 배포 프로세스를 경험하며 API 안정성과 하위 호환성을 확보했습니다. 최근에는 해당 컴포넌트의 토큰값을 이용해 React Native에서 View의 구조를 가져와서 보여주는 시스템으로 확장하고 있습니다.

1. 문제점

여러 개의 앱(학생용, 선생님용, 부모님용)을 운영하면서 버튼, 폰트, 컬러 등 기본 UI 요소의 파편화가 발생했습니다. 디자인 변경 시 각 앱마다 개별적으로 수정해야 하는 비효율이 존재했습니다.

2. 해결 방안

• Atomic Design: 컴포넌트를 최소 단위(Atom)부터 조합형(Molecule)으로 나누어 설계하여 재사용성을 극대화했습니다.
• SPM 배포 파이프라인: Swift Package Manager를 통해 버전을 체계적으로 관리하고, 사내 프라이빗 저장소를 통해 안전하게 배포했습니다.
• Token System: 컬러와 폰트를 시맨틱 이름(e.g., primaryBrandColor, title1)으로 정의하여 다크모드 대응 및 테마 변경이 용이하도록 설계했습니다.

3. 기대 효과

• 디자이너와 개발자 간의 커뮤니케이션 비용 30% 이상 절감
• UI 관련 코드 중복 제거 및 앱 용량 최적화
• QANDA 앱 내 UI 개발의 일관성 보장 및 유지보수 효율 증대