Figma Component Properties 사용법 | Variant·Boolean·Instance Swap까지 - 피그마 강좌 2-10

Figma의 Component Properties를 활용해 하나의 컴포넌트에서 상태·크기·텍스트·아이콘·콘텐츠를 효율적으로 변경하는 방법을 알아봅니다.
Variant, Boolean, Instance Swap, Text Property와 Slot까지 실제 버튼·스위치·메뉴·모달 UI에 적용하며 컴포넌트를 더 유연하게 만드는 핵심 기능을 살펴봅니다.

🕐 타임스탬프
00:00 Component Properties가 필요한 이유
00:27 Variant와 Component Set 만들기
01:56 버튼 상태와 크기를 Property로 관리하기
03:43 Toggle 형태의 Variant 만들기
04:31 Boolean Property로 요소 표시·숨기기
07:31 Instance Swap으로 아이콘 빠르게 교체하기
10:06 Text Property로 텍스트 관리하기
11:37 Slot으로 내부 콘텐츠 자유롭게 구성하기
13:49 Component Properties 핵심 정리


🚀 멤버십 가입 : https://www.youtube.com/channel/UCvYnDMeL-PFZhfIz6oc_U-Q/join
🚀 예제 다운로드는 멤버십 회원 전용 커뮤니티에 올린 링크에서 받으실 수 있습니다.

🔥 디자인베이스 웹사이트 : https://designbase.co.kr/
🔥 인스타그램 : https://www.instagram.com/designbasekorea/
🔥 이메일 문의 : [email protected]
🔥 카카오 오픈채팅방 : https://open.kakao.com/o/gmwngljb (참여코드 : dgoing12)

#Figma #피그마강좌 #UI디자인 #FigmaEffects