Figma는 화면 설계, 디자인 시스템, 클릭 가능한 프로토타입과 팀 피드백을 한 파일에서 다루는 협업 디자인 도구입니다. 브라우저에서도 사용할 수 있지만 Windows와 Mac용 데스크톱 앱을 설치하면 작업 파일을 별도 창에서 관리하고 로컬 글꼴을 바로 쓰며 플러그인·위젯 개발 기능도 이용할 수 있습니다.
PC 앱과 모바일 앱은 무료로 내려받을 수 있고 Starter 플랜으로 기본 디자인 작업을 시작할 수 있습니다. 다만 Dev Mode, 파일·폴더·버전 기록의 범위와 일부 협업 기능은 플랜에 따라 제한됩니다. 아래에서 운영체제에 맞는 설치 파일을 고르는 방법부터 프레임 제작, 오토 레이아웃, 프로토타입 테스트와 이미지 내보내기까지 차례로 확인할 수 있습니다.
Figma는 어떤 프로그램인가요?
Figma Design에서는 앱과 웹사이트의 화면을 프레임 단위로 만들고 텍스트, 도형, 이미지와 재사용 가능한 컴포넌트를 배치합니다. Auto layout을 적용하면 버튼이나 카드의 내용이 달라져도 간격과 정렬이 규칙에 맞게 바뀝니다. 완성한 화면을 Prototype 탭에서 연결하면 실제 앱처럼 화면 전환을 시험하고 공유 링크로 의견을 받을 수 있습니다.
같은 계정으로 로그인하면 데스크톱과 모바일에서 최근 파일과 알림을 확인할 수 있습니다. 모바일 앱은 데스크톱판처럼 전체 디자인을 정교하게 편집하는 용도보다 파일 보기, 프로토타입 실행, 댓글 확인과 선택한 최상위 프레임 미러링에 알맞습니다. 편집 작업은 PC에서 하고 실제 휴대폰 화면 확인은 모바일 앱으로 나누면 효율적입니다.
Figma 모바일 앱의 실제 화면
미리보기는 2026년 9월 29일 확인한 Figma 공식 Google Play 등록 화면입니다. 파일 보기, 댓글, 최근 파일 검색, 활동 알림, 프로토타입 실행과 데스크톱 프레임 미러링 모습을 담았습니다. PC용 Figma Design은 도구와 레이어 패널이 있는 편집 화면이라 메뉴 배치가 다릅니다. 이미지를 누르면 원본 비율로 볼 수 있습니다.
| 프로그램 | Figma |
|---|---|
| 개발사 | Figma, Inc. |
| 다운로드 | 무료 |
| 무료 이용 | Starter 플랜 제공 |
| 지원 환경 | Windows 10+ 64비트 · macOS 12+ · iOS · Android |
| 주요 작업 | UI 디자인 · 오토 레이아웃 · 프로토타입 · 댓글 · 내보내기 |
Windows와 Mac 설치 파일 고르기
Windows 데스크톱 앱은 Windows 10 이상의 64비트 환경을 지원합니다. 일반 Intel·AMD PC는 Windows Desktop App을 선택하고, 시스템 종류가 ARM64로 표시되는 Snapdragon 계열 PC는 Windows Arm 항목을 사용하세요. Mac은 macOS 12 Monterey 이상에서 Desktop App을 설치할 수 있습니다.
설치 전에 회사 PC의 앱 설치 정책과 남은 저장 공간을 확인하세요. Figma 파일은 계정의 작업 공간에 저장되므로 설치 파일을 받는 것과 디자인 파일을 로컬 폴더에 보관하는 것은 다릅니다. 오프라인 작업이 필요한 경우 데스크톱 앱의 현재 지원 범위와 파일 동기화 상태를 먼저 시험하는 편이 안전합니다.
Windows에 Figma 설치하고 첫 파일 열기
공식 다운로드에서 Windows용 설치 파일을 저장해 실행하면 사용자 계정에 Figma가 설치됩니다. 앱을 연 뒤 브라우저 인증 창에서 기존 Figma 계정으로 로그인하거나 새 계정을 만드세요. 로그인 후 파일 브라우저에 Drafts와 최근 파일이 보이면 계정 연결이 완료된 것입니다.
- Windows 설정의 시스템 정보에서 운영체제와 시스템 종류가 64비트 또는 ARM64인지 확인하세요.
- Figma 다운로드에서 Windows Desktop App 또는 Windows Arm을 선택하세요.
- 내려받은 설치 파일을 실행하고 설치가 끝나면 시작 메뉴에서 Figma를 여세요.
- 브라우저 인증을 완료한 뒤 앱으로 돌아와 사용할 팀과 Drafts가 표시되는지 확인하세요.
- Design file을 하나 만들고 빈 캔버스가 열리는지 확인하세요.
Mac에 설치하고 로컬 글꼴 확인하기
Mac에서는 공식 다운로드의 macOS Desktop App을 받아 응용 프로그램 폴더에 넣고 실행합니다. 처음 실행할 때 macOS 보안 확인이 나오면 파일 출처가 Figma 공식 다운로드인지 확인하세요. macOS 12보다 오래된 시스템에서는 최신 데스크톱 앱이 설치되지 않을 수 있습니다.
데스크톱 앱은 컴퓨터에 설치된 로컬 글꼴을 별도 글꼴 설치 서비스 없이 사용할 수 있다는 장점이 있습니다. 글꼴 목록에 원하는 폰트가 보이지 않으면 해당 폰트가 운영체제에 정상 설치됐는지, Figma 앱을 설치 후 다시 실행했는지 확인하세요. 팀 작업에서는 상대방에게 없는 글꼴이 대체될 수 있으므로 공유 폰트 정책도 함께 맞춰야 합니다.
첫 UI 화면을 프레임으로 만드는 방법
새 Design file에서 F 키를 누르거나 도구 모음의 Frame tool을 선택하면 휴대폰, 태블릿, 데스크톱 같은 프리셋 크기를 고를 수 있습니다. 프레임은 단순한 사각형과 달리 그 안의 레이어를 묶고 제약 조건, 레이아웃 그리드, 클리핑과 프로토타입 시작 지점을 관리하는 화면 단위입니다.
왼쪽 레이어 패널에서 프레임 이름을 Home, Product detail처럼 실제 화면 의미에 맞게 바꾸세요. 화면 요소를 프레임 밖에 두면 미러링이나 프로토타입에서 예상과 다르게 보일 수 있습니다. 모바일 앱으로 확인할 화면은 페이지 바깥의 개별 요소가 아니라 최상위 프레임 안에 구성해야 합니다.
- 새 파일을 열고 F 키를 눌러 Frame tool을 선택하세요.
- 오른쪽 패널에서 iPhone, Android 또는 Desktop 프리셋을 고르세요.
- 텍스트, 버튼, 이미지 레이어를 프레임 안에 배치하세요.
- 왼쪽 레이어 패널에서 프레임 이름을 작업 목적에 맞게 바꾸세요.
- Present를 눌러 화면 크기와 잘림 여부를 확인하세요.
Auto layout으로 버튼과 카드 정렬하기
여러 레이어를 선택하고 Shift+A를 누르면 Auto layout 프레임으로 바뀝니다. 방향, 요소 사이 간격, 안쪽 여백과 정렬을 정하면 텍스트 길이나 카드 수가 바뀔 때 프레임 크기와 배치가 규칙에 따라 조정됩니다. 버튼 안의 텍스트와 배경을 따로 움직이는 작업을 줄이는 데 유용합니다.
버튼은 가로·세로 크기를 Hug contents로 두면 글자와 여백에 맞춰 늘어나고, 목록의 카드 폭을 Fill container로 두면 부모 프레임의 남은 공간을 채울 수 있습니다. Auto layout이 예상과 다르면 부모와 자식 프레임의 크기 옵션, 최소·최대 크기, Absolute position이 켜진 레이어가 있는지 확인하세요.
프로토타입 연결하고 실제 흐름 시험하기
오른쪽 패널의 Prototype 탭에서 버튼이나 카드를 선택하면 연결 핸들을 다른 프레임으로 끌 수 있습니다. On click, Navigate to 같은 동작과 전환 효과를 정한 뒤 첫 화면을 Flow starting point로 지정하세요. Present를 실행하면 클릭했을 때 올바른 화면으로 이동하는지 확인할 수 있습니다.
한 요소에 여러 동작을 겹치거나 연결 대상 프레임을 삭제하면 전환이 예상과 달라질 수 있습니다. Prototype 패널에서 Interaction 목록을 확인하고, 뒤로 가기·오버레이 닫기·스크롤 영역도 실제 사용 순서대로 시험하세요. 공유 전에 시작 화면과 흐름 이름을 정리하면 검토자가 원하는 시나리오를 바로 실행할 수 있습니다.
댓글로 피드백 받고 완료 처리하기
댓글 도구를 선택해 화면의 특정 위치를 누르면 그 지점에 의견을 남길 수 있습니다. 팀원을 멘션하면 알림을 보낼 수 있고, 답변이 끝난 댓글은 Resolve로 완료 처리합니다. 모바일 앱에서도 프로토타입을 보면서 댓글을 읽고 답변할 수 있어 실제 기기에서 발견한 문제를 바로 기록하기 좋습니다.
댓글은 디자인 변경 자체를 대신하지 않습니다. 요청 내용을 반영한 뒤 어떤 레이어나 화면을 고쳤는지 답변하고, 검토가 끝났을 때 해결 상태로 바꾸세요. Activity 화면에서 최근 권한 변경과 댓글 알림을 확인하면 놓친 피드백을 찾을 수 있습니다.
PNG·SVG·PDF로 내보내고 결과 확인하기
내보낼 레이어, 컴포넌트 또는 프레임을 선택하고 오른쪽 패널 아래 Export에서 PNG, JPG, SVG 또는 PDF 형식을 추가합니다. 아이콘은 선명도와 편집성을 유지하려면 SVG가 적합하고, 사진이 포함된 화면 미리보기는 PNG나 JPG를 사용할 수 있습니다. 여러 배율이 필요하면 1x, 2x 같은 설정을 각각 추가하세요.
Export를 누른 뒤 저장된 파일을 실제 브라우저나 이미지 뷰어에서 열어 크기, 투명 배경, 글꼴, 잘림과 색상을 확인하세요. 선택한 프레임 밖에 레이어가 있거나 Clip content가 켜져 있으면 일부가 빠질 수 있습니다. PDF는 여러 프레임의 순서와 페이지 크기도 확인해야 합니다.
- 내보낼 프레임이나 레이어를 정확히 선택하세요.
- 오른쪽 패널의 Export에서 원하는 형식과 배율을 추가하세요.
- 배경 투명 여부와 프레임 잘림을 미리 확인하세요.
- Export를 실행해 파일을 저장하세요.
- 저장된 파일을 열어 크기, 글자, 색상과 누락된 요소가 없는지 확인하세요.
모바일 앱에서 프로토타입과 미러링 확인하기
iPhone·iPad는 App Store, Android는 Google Play에서 Figma와 개발자 Figma, Inc.를 확인해 설치합니다. PC와 같은 계정으로 로그인하면 최근 파일 검색, 활동 알림, 댓글과 프로토타입을 볼 수 있습니다. 모바일판의 주된 목적은 전체 화면 제작보다 검토와 실제 기기 테스트입니다.
Mirror를 사용하려면 데스크톱 Figma에서 미러링할 최상위 프레임을 선택하고 모바일 앱에서 Mirror를 여세요. 같은 계정으로 로그인해야 하며 공식 안내상 동일한 Wi-Fi에 연결할 필요는 없습니다. 화면이 비어 있으면 PC에서 하위 레이어가 아니라 최상위 프레임을 선택했는지 먼저 확인하세요.
설치·로그인·동기화 오류 해결
설치 파일이 실행되지 않으면 Windows 10 이상 64비트인지, 일반 x64와 ARM64 파일을 올바르게 골랐는지 확인하세요. Mac은 macOS 12 이상인지 확인하고, 이전 설치가 남아 있으면 실행 중인 Figma를 종료한 뒤 공식 설치 파일을 다시 받습니다. 회사 장치에서는 관리자 정책이 설치를 막을 수 있습니다.
로그인 뒤 파일이 보이지 않으면 브라우저에서 인증한 계정과 앱 계정, 선택한 팀과 Drafts를 확인하세요. VPN이나 회사 프록시가 인증·동기화 주소를 막는지도 살핍니다. 앱이 멈추거나 파일이 갱신되지 않으면 네트워크 연결을 확인하고 앱을 다시 시작한 뒤, 같은 파일을 웹 버전에서 열어 계정 문제와 데스크톱 앱 문제를 구분하세요.
무료 Starter 플랜의 범위를 확인하세요
Starter 플랜은 Figma Design, FigJam, Figma Slides 같은 제품의 기본 작업을 무료로 시작할 수 있는 플랜입니다. 개인 연습, 간단한 UI 시안과 소규모 협업에는 사용할 수 있지만 파일·프로젝트 구조, 버전 기록과 협업 기능에는 제한이 있습니다. Dev Mode는 Starter 플랜에 포함되지 않습니다.
앱을 무료로 다운로드할 수 있다는 사실과 모든 기능을 무제한 무료로 쓸 수 있다는 뜻은 다릅니다. 팀 인원, 개발자 전달, 라이브러리 관리, 긴 버전 기록이 필요하다면 현재 플랜 비교 화면에서 제공 기능과 결제 주기를 확인한 뒤 선택하세요.
자주 묻는 질문
Figma는 무료로 다운로드할 수 있나요?
네. Windows·Mac 데스크톱 앱과 iOS·Android 앱은 무료로 받을 수 있고 Starter 플랜으로 기본 작업을 시작할 수 있습니다. Dev Mode와 일부 팀 기능은 유료 플랜이 필요합니다.
Figma 웹 버전과 데스크톱 앱은 무엇이 다른가요?
핵심 디자인 기능은 비슷합니다. 데스크톱 앱은 파일을 별도 창에서 관리하고 로컬 글꼴을 별도 설치 서비스 없이 쓰며 플러그인·위젯 개발 기능을 이용하기 편합니다.
Windows x64와 ARM 중 무엇을 설치해야 하나요?
Intel·AMD 기반 일반 PC는 Windows Desktop App을 사용합니다. Windows 시스템 정보에 ARM64로 표시되는 Snapdragon 계열 장치만 Windows Arm 항목을 선택하세요.
휴대폰에서 Figma 디자인을 만들 수 있나요?
모바일 앱은 파일 보기, 프로토타입 실행, 댓글과 데스크톱 프레임 미러링이 중심입니다. 정교한 화면 편집과 컴포넌트 작업은 PC의 웹 또는 데스크톱 앱에서 진행하는 편이 적합합니다.
Figma Mirror 화면이 비어 있을 때 무엇을 확인하나요?
PC와 휴대폰이 같은 Figma 계정인지 확인하고, 데스크톱 편집 화면에서 하위 요소가 아닌 최상위 프레임을 선택하세요. 동일한 Wi-Fi 연결은 필수가 아닙니다.
설치 후 프레임 하나를 끝까지 만들어 보세요
운영체제와 CPU에 맞는 Figma를 설치하고 같은 계정으로 로그인한 뒤, 새 파일에서 프레임을 만들고 Auto layout을 적용해 보세요. 프로토타입으로 화면을 연결하고 댓글을 확인한 다음 PNG나 SVG로 내보내 실제 파일까지 열어 보면 설치부터 첫 UI 작업까지 한 번에 점검할 수 있습니다. 모바일 앱은 같은 프레임을 실제 기기에서 미러링하고 피드백을 확인할 때 함께 사용하면 됩니다.
공식 자료와 확인일
Figma 공식 다운로드 · Figma 데스크톱 앱 안내 · Figma Starter 플랜 안내 · Figma 프레임 사용 안내 · Figma Auto layout 안내 · Figma 내보내기 안내 · Figma 모바일 프로토타입 안내 | 2026-09-29
