기타
신입 디자이너는 아무것도 몰라요
두줄요약
Figma Constraints와 Auto Layout으로 프레임 변화에 대응하는 카드 UI를 비교했습니다. 컴포넌트 내부는 Auto Layout, 페이지 배치는 Constraints 활용을 제안합니다.
구조와 흐름
- Constraints로 프레임 경계와 내부 오브젝트 사이의 위치·크기 관계 설정
- 프레임 크기 변경 시 기본값 카드의 콘텐츠 잘림과 설정된 카드의 레이아웃 유지 비교
- Auto Layout으로 콘텐츠 간 관계와 패딩을 정의해 유사한 반응형 카드 구성
선택 이유
- 컴포넌트 내부 콘텐츠 간 간격과 패딩 관리에 적합한 Auto Layout
- 페이지 프레임 위 컴포넌트 위치 고정에 활용 가능한 Constraints
- 디자인 시스템 컴포넌트의 재사용성과 구조적 디자인 지향
주의할 점
- Constraints 기반 간격 조정 시 개별 패딩을 직접 수정해야 하는 번거로움
- 콘텐츠 간 간격이 중요한 구성에서 그룹보다 Auto Layout 우선 고려
