플러그인
<플러그인 설치>
마우스 우클릭 > Plugins > Manage plugins...
다양한 플러그인을 다운로드 할 수 있고
다운로드한 플러그인은 상단에 저장되어 바로 실행 가능
<가장 자주 쓰이는 플러그인>
- fontawesome icons
- manage plugins
- unsplash
- Iconfy, Meterial Design Icons
- skew
- html.to.design
- Blush
- Remove BG
- Brandfetch
- Font Scale
<Iconfy>
웹페이지, 웹상세 등에서 사용되는
다양한 이모티콘 또는 버튼 무료 소스
원하는 아이콘을 키워드로 검색해 찾을 수 있다
처음 가져오는 경우 프레임이 잠겨 있기 때문에
사용 시 이미지가 잘릴 수 있으므로
그룹을 해제해 벡터 형태로 변환 후 사용해주어야 한다
ctrl+shift+G 단축키로 프레임 해제
그룹을 해제해 벡터 상태로 사용하는 게 좋다
<html to design>
원하는 사이트의 이미지 및 소스까지 통째로 가져오는 크롤링
레이아웃을 그대로 가져와서 사용이 가능하다
매우 유용하나 월 10회 무료 사용 제한이 있다
커뮤니티 활용
커뮤니티에서 다양한 샘플을 활용할 수 있다
mockup, uiux, emoji 등 다양한 무료 소스가 공유되고 있다
팝업창 설정
객체 선택 > interaction > on click > open overlay
띄우고자 하는 프레임 선택
팝업창과 클릭버튼은 선으로 연결된다
왼쪽 상단 재생버튼을 눌러 재생 가능
미리보기 할 수 있다
Figma: The Collaborative Interface Design Tool
Figma is the leading collaborative design platform for building meaningful products. Design, prototype, and build products faster—while gathering feedback all in one place.
www.figma.com
https://developernew.tistory.com/428
Figma 디자인/기획/개발 협업 툴 피그마 기본 사용법 + 단축키
피그마 시작 피그마 사이트 접속 또는 앱 설치https://www.figma.com/ Figma: The Collaborative Interface Design ToolFigma is the leading collaborative design platform for building meaningful products. Design, prototype, and build products fas
developernew.tistory.com
https://developernew.tistory.com/429
Figma 피그마 기본 기능 사용 및 예제 - 프레임, 컴포넌트 생성
작업 영역 생성 Frame F 단축키로 작업 영역 생성작업 영역은 반복 생성 가능 컴포넌트 생성 컴포넌트: 재사용하기 위한 하나의 단위 프레임 내에서 생성한 도형을 선택한 후오른쪽 다이아모양 아
developernew.tistory.com
'Frontend > Figma' 카테고리의 다른 글
| Figma 피그마 기본 기능 사용 및 예제 - 프레임, 컴포넌트 생성 (0) | 2025.12.04 |
|---|---|
| Figma 디자인/기획/개발 협업 툴 피그마 기본 사용법 + 단축키 (0) | 2025.12.04 |