[디자인 수정의 무한 반복, Figma(피그마)로 초기 디자인 시스템 구축하기]
writer. 한지유님
회사에서는 만들어진 디자인 시스템을 이용하게 되고, 구축해보진 않았는데요.
사이드 프로젝트를 진행하면서 처음으로 디자인 시스템을 구축하게 되었습니다.
작은 앱이었지만 [모든 화면 디자인 > 컴포넌트별 모음 > 이후 시스템 구축] 프로세스로 진행했었는데요.
이 과정에서 누락되는 요소들도 생기고, 예외 케이스들도 여럿 발생해 일원화 하는데 공수가 꽤 들었습니다.
피그마는 텍스트 박스 크기 조절이 상대적으로 까다롭더라고요.
다음 번에는 와이어프레임을 협업하는 모두와 공유 후에 ui를 잡기 전 폰트, 컬러, 에셋을 먼저 정리하고 디자인을 들어가고, 이후에 디자인 시안을 잡아가며 버튼 스타일과 탭 등을 일원화하는 과정을 동시에 진행하는 방향으로 효율적으로 해보려 합니다.
보다 효율적으로 초기 시스템을 구축할 수 있도록 피그마의 기능을 정리한 아티클을 발견해 공유합니다.
초급으로 텍스트, 컬러, 이펙트, 에셋을 스타일 등록하는 기능과 고급으로는 피그마의 auto layout, vaiants 그리고 그외 꿀팁들을 정리한 아티클입니다.