프로젝트 소개
- 앤트에서 개발팀 프론트엔드로 2023년 01월부터 ~ 2023년 06월까지 참여한 디자인 시스템 프로젝트
- Mint와 Orange에서 사용하기 위한 디자인 시스템을 개발
주요 성과
- 프로젝트의 개발 편의성과 생산성을 높이기 위해 공통 컴포넌트를 개발하는 FE 개발자로 참여
- 프로젝트에서 사용되는 컴포넌트들이 다양한 형태와 색상을 가지고 있어 재사용성과 유연성을 고려하여 컴포넌트를 개발
- variants 옵션을 활용하여 필요한 경우 스타일이 다르게 적용되도록 구현
- 컴포넌트에 새로운 기능을 추가해도 유연하게 수정할 수 있도록 설계
- 동일한 페이지 개발 시 이전에 2일이 소요되던 작업을 단 1일로 개선하는 성과를 달성
- React, TypeScript, vanilla-extract 개발 환경
구현한 사항
variants에 따른 스타일 적용
- 모듈화된 컴포넌트의 재사용성과 기능 확장을 고려하여 variants 사용했습니다.
- 기능 추가나 변경 시에도 유연한 대응 가능한 구조를 구축했습니다.
- 디자인 시스템 활용으로 원활한 의사소통과 빠른 개발 환경을 조성했습니다.
다양한 컴포넌트에서 색상 쉽게 변경 가능한 구조 구현
- 디자이너의 요구사항이나 추가 사항에 대응하기 위해 유연한 컴포넌트를 설계했습니다.
- 색상을 동적으로 변경 가능하도록 기능 구현 및 설정했습니다.
핵심 컴포넌트 개발
- Chip, Icon, Illustration, Label, HelperText, Textarea 등 주요 컴포넌트를 개발했습니다.
- 동료 개발자들과의 원활한 소통을 통해 사용자 편의성 고려한 개발 방법을 결정했습니다.