1. [단축키 안내] 보기2. Multiplayer cursors2-1) Multiplayer cursors란?2-2) Multiplayer cursors 숨기기3. Frame 또는 Group 속 개별 오브젝트 선택4. 오브젝트와 오브젝트 사이 거리(픽셀 수) 확인5. 오브젝트 Style 상세 확인 (CSS 속성)5. 애셋 추출(Export) 하기6. Pages 이동하기
1. [단축키 안내] 보기
단축키 : ctrl + shift + ?
2. Multiplayer cursors
2-1) Multiplayer cursors란?
한 figma 페이지에 Viewer가 여러 명일 경우 아래처럼 보이는 ‘Multiplayer cursors’를 확인할 수 있습니다. Multiplayer cursors는 다른 사람의 커서 위치를 확인할 수 있는 기능입니다.
2-2) Multiplayer cursors 숨기기
- [Ctrl] + Alt +[\] 단축키를 통해 Hide 할 수 있습니다.(Mac : [option] + [command] + \)
- 좌측 상단 [피그마 로고 아이콘] > [View] > [Multiplayer cursors] 체크를 해제하여 Hide 할 수 있습니다.
3. Frame 또는 Group 속 개별 오브젝트 선택
- Window : [Ctrl] + 클릭
- MAC : [Cmd] + 클릭
4. 오브젝트와 오브젝트 사이 거리(픽셀 수) 확인
- Window : 오브젝트 선택 + [Alt] + 다른 오브젝트 마우스 오버
- MAC : 오브젝트 선택 + [Option] + 다른 오브젝트 마우스 오버
5. 오브젝트 Style 상세 확인 (CSS 속성)
오브젝트 선택 후 우측 [Inspect] 탭에서 상세 속성을 확인할 수 있습니다.
탭 하단에서 CSS Code 또한 추출할 수 있습니다.
5. 애셋 추출(Export) 하기
Figma 파일 내에 있는 이미지 요소 등은 PNG, JPG, SVG, PDF 파일로 Export 할 수 있습니다.
- 내보내고자 하는 오브젝트 선택
- 우측 상단 [Export] 탭 > 옵션 설정 후 [Export] 버튼 클릭
- 단축키 : [Shift] + [Ctrl] + [E]
- Export 크기 설정
- 1x : 28*28(px)
- 2x : 56*56(px)
예) 28px * 28px 사이즈의 오브젝트를 Export 하는 경우
SVG 파일 추출은 벡터로 작업된 오브젝트만 가능합니다.
비트맵 오브젝트도 SVG 추출이 가능하나 PNG로 Export 하시는 것을 추천드립니다.
6. Pages 이동하기
- 좌측 상단 [Pages ▽] 버튼을 클릭하여 탭을 확장합니다.
- 이동하고자 하는 Page를 클릭합니다.