라벨이 붙은 섹션으로 캔버스를 정리하여 관련 아이디어를 그룹화하고 공동작업자 파일을 둘러볼 수 있도록 안내하세요.
섹션에서 다음을 수행할 수 있습니다.
- 협업이나 아이디어 구상을 위한 캔버스 영역 지정
- 더 쉽게 탐색할 수 있도록 파일 정리
- 디자인 그룹으로 연결
- 개발자 핸드오프를 돕기 위해 콘텐츠를 "ready for dev"로 표시
Figma Design의 섹션은 기본적으로 캔버스의 최상위 요소입니다. 섹션에는 다른 섹션을 포함하여 모든 레이어 유형을 포함할 수 있지만, 프레임이나 그룹 내에는 포함될 수 없습니다.
섹션 만들기
섹션을 만드는 방법에는 몇 가지가 있습니다.
도구 모음과 바로가기
- 도구 모음에서 섹션 을 클릭하거나 키보드 바로가기 ⇧ Shift S를 사용하세요.
- 캔버스에서 섹션을 배치할 위치를 클릭하고 드래그하세요.
추가하려는 개체 위로 섹션을 클릭하고 드래그할 수도 있습니다.
선택
- 캔버스에서 섹션에 추가하려는 개체를 클릭하고 드래그합니다.
- 선택 항목을 마우스 오른쪽 버튼으로 클릭하고 메뉴에서 새로운 섹션으로 감싸기를 선택합니다.
팁: 레이어 패널에서 섹션 아이콘을 두 번 클릭하면 해당 섹션으로 이동합니다.
섹션에 개체 추가
다음과 같은 몇 가지 방법으로 섹션에 개체를 추가할 수 있습니다.
- 개체 위로 섹션 이동
- 개체 위에서 섹션 크기 조정
- 마우스 또는 키보드 화살표를 사용하여 개체를 선택하고 섹션으로 이동
섹션 편집
제목
- 캔버스나 레이어 패널에서 섹션 제목을 두 번 클릭하세요.
- 제목을 편집하세요.
- Return 또는 Enter를 누르세요.
채우기와 외곽선
오른쪽 사이드바의 채우기 및 외곽선 섹션을 사용하여 섹션의 배경과 테두리 색상을 변경하세요.
섹션 공유
특정 섹션으로 연결되는 링크를 복사하여 공동작업자를 캔버스의 특정 섹션으로 바로 안내할 수 있습니다.
- 공유하려는 섹션을 선택합니다.
- 오른쪽 사이드바에서 공유를 클릭합니다.
섹션을 ready for dev로 표시
섹션 내부의 콘텐츠가 완료되면 해당 섹션을 ready for dev로 표시할 수 있습니다. 이렇게 하면 Dev Mode를 사용하는 개발자에게 해당 섹션을 표시하여 도움이 됩니다.
섹션을 ready for dev로 표시하려면:
- 섹션을 선택합니다.
- Ready for dev 상태로 표시를 클릭합니다.
- 섹션의 ready for dev 표시를 해제하려면, Ready for dev 라벨의 점 3개 메뉴를 클릭하고 준비 상태 제거를 선택하세요.
참고: 섹션을 ready for dev 상태로 설정해도 해당 섹션의 콘텐츠에 변경 사항이 적용되는 것을 막을 수는 없습니다.
Dev status 업데이트
섹션을 ready for dev로 표시한 후 디자인을 변경하면, Figma는 자동으로 dev status를 변경됨으로 변경합니다. 변경됨 상태는 개발자가 ready for dev로 표시된 후 반복 수정된 디자인을 추적하는 데 도움이 됩니다.
섹션의 변경됨 상태를 해결하려면 변경됨 상태 인디케이터를 클릭하고 변경 이유를 입력하세요. 그 후, dev status가 ready for dev로 돌아갑니다.
개발 핸드오프 프로세스 관리에 대해 자세히 알아보기 →
섹션 삭제
섹션과 해당 내용을 삭제하려면 다음 단계를 따르세요.
- 섹션을 선택합니다.
- Delete/Backspace를 누릅니다.
콘텐츠를 삭제하지 않고 섹션을 삭제하려면 다음과 같이 하세요.
- 섹션을 선택합니다.
- 바로가기 사용:
- Mac: CommandDelete
- Windows: ControlBackspace
섹션으로 프로토타입 제작
프로토타입에서는 섹션이 디자인의 다양한 부분에 걸쳐 흐름을 연결하는 데 도움이 됩니다.
섹션에 연결을 생성하면 Figma는 해당 섹션에서 마지막으로 방문한 프레임을 기억하고 자동으로 그 프레임으로 돌아갑니다.