Figma
는 2016년 9월에 출시된 UI 디자인&프로토타이밍 툴이다.Ctrl
+ C
Ctrl
+ V
Ctrl
+ X
Ctrl
+ D
혹은 Alt
누른 상태로 드래그Shift
누른 상태로 클릭Ctrl
+ G
Ctrl
+ Alt
+ G
Ctrl
+ Shift
+ G
Alt
누르고 다른 요소에 마우스 올려놓기Shift
+ A
Design
탭 Auto layout
에서 +
버튼 선택Shif
t + Alt
+ A
단일 컴포넌트 생성 : 컴포넌트로 만들 요소 선택 → Ctrl
+ Alt
+ K
혹은 상단 Create component
버튼 클릭
컴포넌트 여러 개 생성 : 컴포넌트로 만들 요소 모두 선택 → Create component
버튼 옆 드롭다운 클릭 → Create multiple component
선택
상태를 가진 컴포넌트 생성 : 컴포넌트의 상태로 만들 요소 모두 선택 → Create component
버튼 옆 드롭다운 클릭 → Create component set
선택
컴포넌트에 상태 추가하기 : 상태를 추가할 컴포넌트 선택 → 화면 우측 Design
탭 Properties
에서 +
버튼 클릭 → Variant
선택 → 컴포넌트 하단에 생긴 보라색 +
버튼 눌러 상태 추가
컴포넌트의 인스턴스 생성
Ctrl
+ D
혹은 Alt
누른 상태로 드래그)Assets
탭에서 인스턴스를 생성할 컴포넌트를 드래그하여 화면에 끌어다 놓기Figma는 이 외에도 다양한 단축키를 제공한다.
Figma 화면에서 Ctrl
+ Shift
+ ?
를 누르면 사용 가능한 모든 단축키를 확인할 수 있다.