일치하는 개체는 하나 이상의 프레임에 걸쳐 존재하는 동일한 개체입니다. 예를 들어, 많은 앱 디자인에서는 각 프레임의 위쪽에 동일한 헤더를 사용합니다.
일치하는 개체를 사용하여 선택, 편집 및 프로토타입 제작할 때 시간을 절약할 수 있습니다.
일치하는 개체는 다음과 함께 사용됩니다.
- 스마트 애니메이션: 프로토타입 제작 시 일치하는 개체 간에 고급 애니메이션 생성
- 다중 편집: 개체 일괄 편집
- 상태 관리: 프로토타입 제작 시, 일치하는 개체가 있는 프레임 간에 이동할 때 인터랙티브 컴포넌트, 스크롤이 있는 프레임, 동영상 상태 공유
- 일치하는 인터랙션: 일치하는 개체에 대한 프로토타입 제작 인터랙션 일괄 선택 및 편집
두 개의 개체가 일치한다고 간주하려면 다음을 충족해야 합니다.
일치하는 개체 요건
Figma는 일치하는 개체 요구 사항을 정의하기 위해 다음 용어를 사용합니다.
-
부모(Parent) 개체: 프레임, 컴포넌트, 그룹과 같이 다른 개체를 포함하는 개체입니다.
- 조부모(Grandparent) 개체는 부모 개체를 포함하는 개체입니다. 조상(Ancestor)은 자식, 부모, 조부모 개체를 포함하는 계층 구조의 다른 모든 개체입니다.
- 자식(Children) 또는 자식 개체: 부모 내에 포함된 개체입니다.
- 최상위 프레임: 캔버스에 바로 있는 프레임입니다. 부모 개체가 없습니다.
참고: 최상위 프레임은 일치하는 개체가 될 수 있지만, 스마트 애니메이션 이나 상태 관리에만 해당됩니다. 최상위 프레임에서는 다중 편집 또는 일치하는 인터랙션 선택을 사용할 수 없습니다.
섹션의 개체는 해당 섹션 내의 다른 개체와만 일치할 수 있습니다.
레이어 이름
개체는 동일한 레이어 이름을 가져야 합니다.
이 규칙에는 한 가지 예외가 있습니다.
텍스트 레이어
텍스트 레이어는 항상 동일한 레이어 이름이 필요하지는 않습니다. 텍스트 레이어를 만들면 레이어의 이름은 텍스트 자체의 콘텐츠를 반영합니다. 텍스트 레이어의 이름을 변경할 수 있는 옵션이 있습니다.
- 텍스트 레이어가 명시적으로 레이어 패널에서 이름이 지정되거나 변경된 경우, 해당 이름들이 일치해야 합니다.
- 텍스트 콘텐츠에 따라 암시적으로 이름이 지정된 텍스트 레이어의 경우, 해당 텍스트 스타일이 일치해야 합니다. 일치하는 텍스트 개체가 여러 개 있을 경우, 프레임 내 텍스트 레이어의 x 및 y 좌표에 따라 가장 잘 일치하는 항목이 선택됩니다.
부모 프레임
개체의 모든 부모 및 조상 프레임의 이름이 일치해야 합니다. 최상위 프레임의 이름은 일치할 필요가 없습니다.
참고: 컴포넌트 세트 내의 최상위 프레임 및 변형 이름은 일치할 필요가 없습니다.
레이어 계층 구조
일치하는 것으로 간주되려면, 개체는 최상위 프레임 간의 레이어 계층 구조에서 동일한 위치를 가져야 합니다. 예를 들어, 한 프레임에서 부모와 조부모 레이어가 있는 개체는 두 번째 프레임에서도 반드시 부모와 조부모 레이어가 있어야 합니다.
팁: 모든 요구 사항이 일치하고 프레임 내에 동일한 이름의 개체가 두 개 이상 있을 때, 부모 프레임 내 개체의 인덱스를 사용하여 어떤 것이 일치하는지 결정합니다.
일치하는 개체 식별
같은 페이지에서 일치하는 개체 강조 표시:
- 클릭하여 개체를 선택합니다.
- Shift 키를 길게 눌러 모든 일치하는 개체를 밝은 파란색으로 강조 표시합니다.
또는 프로토타입 탭에서 일치하는 개체를 식별할 수 있습니다.
- 오른쪽 사이드바에서 프로토타입 탭을 엽니다.
- 캔버스의 개체나 레이어 위로 마우스를 가져갑니다.
Figma는 일치하는 개체가 존재하는 다른 모든 프레임에서 해당 개체를 강조 표시합니다.