[피그마 공부] 메타코드 강의별 스터디 후기 (Flatten으로 병합하기)

 

Flatten은 한마디로 심플하게 정리해주는 기능이다.

레이어가 그룹형태일 때에는 리사이징 할 때 제한이 많은데

이를 단일개체로 만들어준다.

위 사진처럼 여러 그룹으로 된 레이어를 통합해서 심플한 레이어로 만들어준다.

 

 

네개의 정사각형을 만들어서 배열한 후 Union Selection으로 묶으면

각각 하나씩 4개의 정사각형 레이어가 Union 아래로 들어가는 그룹이 되는데

맨 아래 Flatten selectionm을 클릭해서 묶어주면

아래 줄줄이 달려있던 정사각형 레이어들이 사라지고 하나의 레이어로 정리되는 것을 확인할 수 있다.

 

 

플랫튼 상태의 도형을 더블클릭하면 오른쪽 도형과 같이 벡터상태가 된다.

플랫튼은 심플하게 정리되어있는 하나의 단일개체이기 때문에

더블클릭을 한 상태에서 변화를 주면

그 변화도 하나의 단일개채로 인식해서 즉각적으로 변화를 반영하여 포함하게 된다.

 

 

예를들어 플랫튼 상태에서 옆에 펜툴을 이용해서 도형을 하나더 추가해서 그리면

플랫튼은 하나로 묶이기 때문에

레이어가 변화에 맞게 영역이 확장되고

변한 부분이 즉각적으로 아이콘모양에 반영되는 것을 확인할 수 있다.

 

 

반대로 유니온 상태에서 옆에 펜출을 이용해서 도형을 추가해서 그리면

왼쪽 패널에서 기존 유니온그룹의 하위 레이어에

Vector 1 이라고 표시된

새로운 레이어가 추가되는 것을 확인할 수 있다.

하나로 묶여서 포함되는 플랫튼 상태와는 확연히 다른 것이다.

 

 

만약 위의 그림과 같이 다른 컬러로 각각 분리되어있는 레이어들을 Union이라는 불리언으로 묶어주면

하나의 색으로 통일되어버리는 것을 확인할 수 있다.이는 하위 레이어의 스타일 속성이 각각 다르게 적용되어 있더라도 상위 개념인 레이어 그룹 전체의 스타일 속성이 적용된다면하위 레이어의 값들보다 우선시되기 때문이다.

 

 

즉 위와같이 유니언 상태에서는

하위 레이어들의 개별 스타일 속성이 사라지고

플랫튼 상태에서는 개별 스타일 속성이 살아있는 것을 

확인할 수 있다. 또한 개별로 벡터값 변경도 자유롭다.

 

 

유니언은 단색아이콘이나 그래픽을 운영할 때,

개별 도형을 자주 수정해야할 때 사용하고 (하위 레이온이 살아있기 때문)

플랫튼은 복합적인 컬러를 사용하는 아이콘이나 그래픽을 운영할 때랑

복잡한 형태로 유니언 레이어가 너무 많을 때 관리차원으로 사용한다.

같은 병합이라는 큰 틀 안에서도 사용할 때 차이가 존재하기 때문에

잘 기억해두었다가 목적에맞는 병합을 사용해야겠다.

 

: https://mcode.co.kr/

메타코드M

본 내용은 메타코드 Figma 서포터즈 강의 후원을 받아 작성되었습니다.