FIGMA5 Cursor + Figma MCP를 사용할 때 중요한 원칙 Talk to Figma MCP로 할 수 있는 것과 어려운 것요소 생성, 스타일링, 오토레이아웃, 텍스트 수정 기능 이해하기MCP는 피그마를 전부 조작하는 도구가 아니라, 제한된 몇 가지 기능만 수행할 수 있는 도구라는 점입니다.즉, 우리가 피그마에서 평소 하던 모든 작업을 AI가 대신해주는 것은 아닙니다.하지만 그 안에서도 어떤 작업은 꽤 잘하고, 어떤 작업은 아직 제한적입니다.단순히 명령어를 나열해서 외우는 것이 목적이 아니라,무엇을 만들 수 있는지어디까지 자동화할 수 있는지무엇은 기대하면 안 되는지이 범위를 감각적으로 이해하는 것이 중요합니다.먼저 기억할 점 - 일부 기능은 더 이상 지원되지 않습니다예전에 있던 몇몇 명령어는 현재 피그마 API 정책 변경 때문에 더 이상 지원되지 않는 기능입니다.이.. 2026. 3. 18. Figma Multi-Edit 한 번에 여러 객체를 편집하는 법 멀티 에디트 : 한 번에 여러 오브젝트를 편집하는 법디자인 시스템을 구축하거나 대규모 UI를 정리하다 보면"같은 텍스트 스타일만 바꾸고 싶다""이 아이콘만 전부 색을 바꾸고 싶다"라는 고민이 생기곤 한다.최신 Figma는 멀티 선택과 일괄 편집 기능을 더욱 강력하게 개선했으며,이제는 속성 기반 선택과 공통 속성 편집이 매우 수월해졌다.Select Matching Layers – 속성 기준 선택 (⌥⌘A or Ctrl+Alt+A)Select Matching Layers는 선택한 오브젝트와 동일한 속성을 가진 다른 레이어들을 자동으로 선택해주는 기능이다.사용 방법오브젝트 하나를 선택한다우클릭 → Select all with same > 속성또는 상단 메뉴: Edit > Select all with same선.. 2025. 6. 12. Figma 컴포넌트 완전 입문 가이드 컴포넌트(Component)란?Figma에서 컴포넌트는 재사용 가능한 UI 요소의 원본이다.버튼, 카드, 네비게이션 바처럼 여러 곳에서 반복되는 요소를하나의 컴포넌트로 만들어두면, 유지보수와 일관성이 쉬워진다. 컴포넌트 구조구성 요소설명Main Component컴포넌트의 원본이다. 수정 시 모든 인스턴스에 반영된다.Instance컴포넌트에서 파생된 복제본이다. 일부 속성만 수정 가능하다.Variant동일한 컴포넌트의 다양한 상태나 버전이다.Nested Component컴포넌트 안에 다른 컴포넌트를 넣은 구조이다. 예시로 이해하기버튼을 하나 만든 뒤 컴포넌트로 지정하면, 이후 화면 곳곳에 인스턴스를 사용할 수 있다.버튼 텍스트나 아이콘만 상황에 맞게 바꿀 수 있고, 버튼의 크기나 컬러는 원본을 수정해 한 .. 2025. 6. 10. Figma의 Auto Layout 완전 가이드 Auto Layout은 Figma에서 가장 핵심적인 기능 중 하나다.프레임 안에 있는 여러 요소를 일정한 방향으로 정렬하고, 간격과 크기를 자동으로 조정할 수 있도록 해준다.UI 디자인에서 버튼, 리스트, 카드 등 대부분의 구성 요소에 사용되며, 디자인 시스템 구축에서도 필수적이다.Auto Layout의 개념Auto Layout은 프레임 내부 요소 간의 정렬, 여백, 크기 반응을 설정할 수 있는 레이아웃 기능이다.기존처럼 하나하나 수동으로 위치를 맞추는 것이 아니라, 개발처럼 정렬 규칙을 미리 설정하고 유연하게 대응할 수 있다.기본 구조Auto Layout은 다음과 같은 속성들을 기준으로 작동한다.항목설명방향가로(Horizontal) 또는 세로(Vertical) 정렬간격요소 사이의 거리(px)패딩프레임 .. 2025. 6. 8. Figma에서 반응형 디자인 이해하기: Constraints와 Breakpoints 완전 정복 Figma로 UI 디자인을 하다 보면 "이 버튼, 화면이 커져도 제자리에 있어야 하는데", 혹은 "모바일에선 한 줄인데 데스크탑에선 세 줄로 보여야 하지 않을까?" 같은 고민을 하게 된다.이럴 때 알아야 할 핵심 개념이 바로 Constraints(제약 조건) 과 Breakpoints(반응형 전환 기준) 이다.Constraints란? – 요소의 위치와 크기를 제어하는 열쇠Figma에서 Constraints는 부모 Frame이 리사이즈될 때 자식 요소가 어떻게 반응할지를 정의하는 기능이다.예를 들어:버튼이 화면 오른쪽 위에 있어야 할 때 → Top + Right텍스트가 가운데 정렬되어야 할 때 → Center + Center입력창이 화면 크기에 맞춰 좌우로 늘어나야 할 때 → Left + Right💡 실전.. 2025. 6. 8. 이전 1 다음