Figma Grid의 개념

KUKJIN LEE • 8개월 전 작성

Figma에서의 Grid는 세밀하고 체계적인 디자인 작업을 지원하는 도구입니다. 이는 디자이너가 웹 또는 앱 인터페이스를 구축할 때 일관성과 정밀함을 유지할 수 있도록 돕습니다. 웹 디자인에서는 특히 컬럼 그리드 방식을 많이 사용하여, 정보와 요소들을 체계적으로 배열하는 데 중요한 역할을 합니다.

피그마의 그리드 장점

피그마의 그리드 시스템의 가장 큰 장점 중 하나는 그리드를 레이어처럼 자유롭게 사용할 수 있다는 것입니다. 이를 통해 디자이너는 레이아웃을 빠르고 정확하게 조정할 수 있으며, 복잡한 디자인 요소들 사이의 관계를 명확하게 정의할 수 있습니다.

그리드 설계를 위한 기본 용어

그리드 디자인을 시작하기 전에, 몇 가지 기본 용어를 알아두는 것이 중요합니다.

Margin: 이는 프레임의 가장자리와 컬럼 사이의 여백을 말합니다. 마진은 디자인의 '통풍'을 돕고, 요소들이 화면 가장자리에 붙지 않도록 합니다.

Gutter: 컬럼과 컬럼 사이의 공간을 지칭합니다. 일반적으로 디자이너들은 4, 12, 또는 24의 단위로 Gutter를 설정하여 요소들 사이의 적절한 간격을 유지합니다.

New Tech Posts

추천 도서

Our Channels

Figma Grid의 개념