Figma :: 그룹(Group)
Figma 사전
많은 분들이 고민하시는 부분이 Figma에서 제공하고 있는 Group 과 Frame 에 대한 차이점입니다.
뭔가 헷갈리는 Group selection 과 Frame selection과연 어떤 기준에 맞춰서 그룹을 만들고, 어떤 컨텐츠를 프레임으로 만들어야 할까요?
이 부분 역시 그룹일때 제공되는 기능, 프레임일때 가능한 기능에 대해서 생각해보면 결정이 쉽습니다.
생각보다 아주 단순합니다.
프레임(Frame)은 말 그대로 틀을 의미합니다.
위의 예시 이미지는 안에 들어가 있는 이미지, 텍스트 모두를 하나의 Frame 안에 넣어두었습니다.
자, 이 상태에서 해당 프레임, 즉 틀을 움직였을때는 이렇게 됩니다.
Figma 프레임 요소를 줄였을 때
Figma 프레임 요소를 늘렸을 때모든 요소들이 하나의 틀에 들어가 있는 상태이기 때문에 프레임 그 자체의 크기만이 달라집니다.
우리가 안에 넣어두었던 이미지, 텍스트의 위치는 고정적으로 유지한 상태에서 전체 틀의 크기만 달라집니다.
액자의 크기만 크게 늘어나거나 줄여들게 되는 것이지요. 안에 들어가 있는 요소의 사이즈는 처음에 만들어둔 사이즈와 위치를 그대로 유지하게 됩니다.
그룹(Group)의 경우는 다릅니다.
Figma 그룹으로 묶어둔 요소들이번에는 동일한 이미지, 텍스트 요소를 사각형(R)을 만들어 그 위에 위치 시켜놓은 상태에서 그룹 Command + G 으로 만들었습니다.
이 상태에서 해당 그룹을 선택한 상태에서 위와 똑같이 늘리고 줄이기를 시도해볼까요?
Figma 그룹을 줄였을 때
Figma 그룹을 늘렸을 때한 눈에도 차이가 느껴지시죠?
그룹을 만들어 놓은 상태에서 똑같이 그룹이 선택된 상태에서 크기를 변경해보았습니다.
이때 그룹 안에 포함된 요소들은 드레그를 실행하는 크기에 맞춰서 내부에 속한 요소들이 같이 크기가 달라집니다.
기획적 요소를 가미해서 생각해본다면 의미는 조금 달라질 수 있지만 기본적으로 두 기능이 갖고 있는 성격을 먼저 이해하시면 좋습니다.
개인적으로는 동일한 정보 섹션으로 묶을 수 있는 것들이라면 저는 프레임으로 구성합니다.
사실..... 그룹 기능 자체는 많이 사용하지는 않아요. ^^;;;
그룹을 만들어서 정리할 때는 거의 대부분 그래픽에 필요한 부분들을 조정할 때 사용합니다.
그치만 제가 디자이너는 아니다보니 사실 많이 사용할 일은 없네요.
어떤 것이 딱 정답이다- 라고 인지하는 것 보다는 각 요소들이 갖고 있는 특징을 이해하고 사용하면 Figma 사용을 하는데 있어서 더 많이 도움이 될 것 같습니다.
#Figma #피그마 #피그마강의 #웹기획 #피그마프레임 #피그마그룹 #frame #group
