디자인시스템 Foundation

오늘은 피그마에서 컬러 라이브러리를 쉽게 제작하는 순서와 라이브러리를 만들때 사용했던 유용한 플러그인을 소개하려고 한다! 1. 제품의 콘셉트에 맞는 다양한 컬러들을 정의한다 베이직 컬러의 color shade를 만들 때 일러스트의 blend 기능을 이용하였다. 물론 피그마에도 다양한 플러그인을 가지고 있지만 내가 원하는 컬러 대비에서 shade를 뽑아내는 플러그인을 아직 찾지 못했다. light - dark를 지원하는 베이직 컬러 상 shade가 너무 미묘하게 변하거나 너무 격하게 변하게 되면 컬러를 뽑아 쓰기 어려운 것 같다. 이렇게 원하는 세 가지 컬러를 뽑아 shade를 완성하였다. 2. 피그마의 rename 기능으로 한 번에 컬러칩 네이밍을 한다. 일러스트에서 만든 shade를 그대로 복사하여 피..

Foundation - 타이포그래피 | 들어가며 여러 디자인 시스템을 리서치하다 보면 'Foundation'과 'Components'로 크게 카테고리가 나뉘어 있는 것을 볼 수 있다. 여기서 Foundation에 속해 있는 것은 보통 Color, Typography, Grid, Iconography, Spacing 정도인데 Foundation이라는 것은 말 그대로 디자인 시스템에 근간이 되는