Figma 라이브러리 가이드
Figma에서 라이브러리는 구성요소, 스타일, 변수와 같은 디자인 자산의 모음입니다. 이러한 디자인 자산은 단일 파일에 들어 있지만 여러 파일이나 프로젝트에서 다시 사용할 수 있습니다.
사용자는 라이브러리를 통해 버튼, 아이콘, UI 일부, 색상, 특정 속성의 값과 같은 일반적인 디자인 요소를 공유하는 경우가 많습니다. 이를 통해 모든 사용자가 일관성을 유지할 수 있으며 기존 디자인을 출발점으로 삼아 손쉽게 개발을 진행할 수 있습니다.
어떤 사람이 라이브러리에서 자산을 변경하면 다른 사용자가 이러한 변경사항을 빠르게 검토하고 자동으로 자신의 디자인을 업데이트할 수 있습니다.
예
다음은 어떤 디자인 팀이 Figma의 라이브러리를 사용해 Habitz라는 가상의 앱을 만드는 과정을 보여주는 예입니다.
- Kai는 하나의 파일에 탐색 표시줄, 메뉴, 헤더, 기타 UI 요소 등 앱의 여러 부분에 사용할 구성요소를 만들었습니다.
- Kai의 팀은 파일에 있는 완성된 구성요소를 라이브러리로 게시합니다.
- 동일한 프로젝트에 속하는 다른 파일을 작업 중인 Timothy는 라이브러리를 보고 캔버스에 몇 가지 구성요소를 추가했습니다.
- 얼마 후 Kai는 라이브러리가 게시된 파일에 있는 구성요소 중 하나를 업데이트했습니다.
- 파일에서 작업을 진행하고 있는 사람들은 이 구성요소를 사용하는 다른 모든 파일에 구성요소 업데이트가 있다는 알림을 받았습니다. 사람들은 구성요소를 검토한 후 준비가 되면 업데이트를 수락할 수 있습니다. 그러면 사람들이 사용하고 있는 구성요소의 모든 인스턴스에 업데이트가 적용됩니다.
Kai와 Habitz 팀에 관해 좀 더 자세히 알아보고 싶으신가요? Figma의 디자인 시스템 소개 코스 →에서 디자인 시스템을 런칭하기 위한 이들의 여정을 확인해 보세요.
라이브러리에서 사용할 구성요소, 스타일, 변수 만들기
라이브러리의 목표는 함께 일하는 다른 사람들에게 재사용 가능한 디자인 자산을 공유하는 것입니다. 이러한 자산에는 구성요소, 스타일, 변수 등이 포함됩니다. 탭을 선택하여 각 자산에 관해 자세히 알아보세요.
구성요소는 디자인의 기본 요소입니다.
구성요소는 아이콘이나 버튼 같은 개별 요소일 수도 있고, 메뉴와 레이아웃 같은 여러 요소의 모음일 수도 있습니다.
라이브러리 사용 시 라이브러리 파일에는 기본 구성요소가 포함되어 있습니다. 이는 모든 사람이 사용할 구성요소의 속성을 정의합니다.
파일의 라이브러리에 액세스하면 구성요소의 인스턴스를 캔버스에 추가할 수 있습니다. 이 인스턴스는 기본 구성요소에 대한 모든 업데이트를 수신합니다.
스타일은 재사용할 속성 또는 설정의 모음을 정의합니다. 예를 들어 스타일을 다음과 같은 용도로 사용할 수 있습니다.
- 채우기 및 선에 사용할 특정 색상 값 캡처
- 글꼴, 줄 높이, 글자 간 간격과 같은 텍스트 속성 정의
- 그림자 및 블러 효과의 사전설정 만들기
- 행, 열, 레이아웃 그리드의 형태로 공유 가능한 스캐폴딩 만들기
변수는 모든 종류의 디자인 속성에 적용할 수 있는 재사용 가능한 값을 저장합니다.
예를 들어 변수를 다음과 같은 용도로 사용할 수 있습니다.
- 디자인 시스템 관리 시 효율을 높이기 위한 디자인 토큰 만들기
- 다양한 기기 크기 간에 프레임 전환 및 정의된 공간 시스템에 따라 공백이 즉시 업데이트되는지 확인
- 다양한 언어가 디자인에 어떤 영향을 주는지 미리 보기
- 장바구니에 추가된 항목에 따라 주문 총계를 계산하는 등 제대로 작동하는 장바구니 디자인 만들기
- 조건 논리를 사용해 사용자가 질문에 올바르게 대답했는지, 틀리게 대답했는지 보여주는 대화형 퀴즈 프로토타입 개발
라이브러리 게시
다른 파일의 구성요소, 스타일, 변수에 액세스하려면 이러한 항목을 라이브러리에 게시해야 합니다. 어떤 항목을 게시할지 선택할 수 있으며, Organization 및 Enterprise 요금제를 사용하는 경우 액세스할 수 있는 사용자도 선택할 수 있습니다.
게시된 스타일, 구성요소, 변수를 변경하면 현재 파일의 인스턴스에만 변경사항이 적용됩니다. 변경사항이 라이브러리에 적용되도록 하려면 라이브러리에도 이러한 변경사항을 게시해야 합니다.
파일에서 어떤 라이브러리를 사용할지 선택
편집 가능
액세스 권한이 있는 모든 초안 파일이나 팀 파일에 게시된 라이브러리에 액세스할 수 있습니다. 관리자는 팀 또는 조직의 기본 라이브러리를 설정할 수 있으며, 이렇게 하면 모든 파일에서 기본 라이브러리가 자동으로 사용하도록 설정됩니다.
파일에서 라이브러리 자산 사용
사용하려는 라이브러리가 있으면 리소스별 안내에 따라 파일에 구성요소, 스타일, 변수를 추가할 수 있습니다.
파일 라이브러리 업데이트 수락
누군가 라이브러리의 기본 구성요소, 스타일 또는 변수에 대한 업데이트를 게시한 경우 해당 구성요소, 스타일, 변수가 사용되는 모든 파일에 업데이트가 제공됩니다.
파일에 대한 편집 가능
액세스 권한이 있는 모든 사용자가 변경사항을 검토 및 수락하거나 무시할 수 있습니다.
라이브러리 관리
라이브러리 파일에 대한 편집 가능
액세스 권한이 있는 사용자는 파일 권한을 설정하고, 라이브러리 게시를 취소하고, 파일 간에 자산을 옮길 수 있습니다.