component2 오픈패스- 피그마 마스터 트랙: 2주차 Component 컴포넌트(Component)란?반복적으로 사용하는 UI 요소를 재사용 가능하게 만든 것버튼, 카드, 내비게이션 바, 아이콘 등에서 사용원본(마스터 컴포넌트)과 인스턴스(Instance) 구조로 동작→ 원본을 수정하면 연결된 모든 인스턴스가 자동 업데이트 컴포넌트의 구조용어설명Main Component (마스터 컴포넌트)원본 역할. 모든 변경 사항이 연결된 인스턴스에 반영됨Instance (인스턴스)마스터를 기반으로 생성된 복제본. 일부 속성만 개별 수정 가능Detached Instance마스터와 연결을 끊은 상태. 원본 변경과 무관하게 수정 가능 컴포넌트 생성 방법우측 패널에서 Create Component 버튼 클릭단축키 Cmd + Option + K (Mac) / Ctrl + Alt + K (Wind.. 2025. 8. 10. Figma 컴포넌트 완전 입문 가이드 컴포넌트(Component)란?Figma에서 컴포넌트는 재사용 가능한 UI 요소의 원본이다.버튼, 카드, 네비게이션 바처럼 여러 곳에서 반복되는 요소를하나의 컴포넌트로 만들어두면, 유지보수와 일관성이 쉬워진다. 컴포넌트 구조구성 요소설명Main Component컴포넌트의 원본이다. 수정 시 모든 인스턴스에 반영된다.Instance컴포넌트에서 파생된 복제본이다. 일부 속성만 수정 가능하다.Variant동일한 컴포넌트의 다양한 상태나 버전이다.Nested Component컴포넌트 안에 다른 컴포넌트를 넣은 구조이다. 예시로 이해하기버튼을 하나 만든 뒤 컴포넌트로 지정하면, 이후 화면 곳곳에 인스턴스를 사용할 수 있다.버튼 텍스트나 아이콘만 상황에 맞게 바꿀 수 있고, 버튼의 크기나 컬러는 원본을 수정해 한 .. 2025. 6. 10. 이전 1 다음
