figma

Author: kenu

public/md/figma/figma.md

@@ -0,0 +1,66 @@
+# Figma 가이드
+
+## Figma 소개
+Figma는 브라우저 기반의 협업형 UI/UX 디자인 도구로, 실시간 협업, 컴포넌트 기반 디자인, 프로토타이핑 등의 강력한 기능을 제공합니다.
+
+## 주요 기능
+
+### 1. 실시간 협업
+- 여러 사용자가 동시에 같은 문서에서 작업 가능
+- 댓글 및 피드백 기능 내장
+- 변경사항 실시간 동기화
+
+### 2. 컴포넌트 시스템
+- 재사용 가능한 UI 요소 생성
+- Variants를 통한 컴포넌트 변형 관리
+- 인스턴스 오버라이드 기능
+
+### 3. 프로토타이핑
+- 인터랙티브한 프로토타입 제작
+- 다양한 트랜지션 및 상호작용 효과
+- 디바이스 프리뷰 지원
+
+### MCP 사용 예시
+
+```figma
+1. 컴포넌트 선택
+2. 우측 패널에서 '컴포넌트 속성' 클릭
+3. '+' 버튼으로 새 속성 추가
+4. 속성 타입과 기본값 설정
+5. 인스턴스에서 속성 조정
+```
+
+## Figma API
+- REST API를 통한 디자인 시스템 연동
+- 플러그인 개발 가능
+- 웹훅 지원
+
+## 유용한 단축키
+- `R`: 사각형 도구
+- `F`: 프레임 도구
+- `T`: 텍스트 도구
+- `K`: 스포이드 도구
+- `Ctrl + /`: 단축키 목록 표시
+
+## MCP 활용 팁
+1. 디자인 시스템 구축 시 MCP를 적극 활용하면 유지보수가 용이합니다.
+2. 팀원들이 자주 변경하는 속성은 MCP로 노출시키세요.
+3. 속성 이름을 직관적으로 지정하여 사용성을 높이세요.
+4. Boolean 속성으로 컴포넌트의 상태를 제어하세요.
+5. Instance Swap를 활용하면 아이콘, 이미지 등을 쉽게 교체할 수 있습니다.
+
+## 버전 관리
+- 버전 히스토리 자동 저장
+- 특정 버전으로 되돌리기 가능
+- 변경사항 비교 기능
+
+## 협업 기능
+- 링크 공유로 실시간 피드백
+- @멘션 기능
+- 팀 라이브러리 공유
+
+## ref
+- [Figma 공식 학습 센터](https://help.figma.com/)
+- [Figma 커뮤니티](https://www.figma.com/community/)
+- [Figma 플러그인 마켓플레이스](https://www.figma.com/community/plugins)
+