Figma
협업 UI/UX 디자인 툴. 개발자 전달·프로토타입·컴포넌트 관리.
Figma 열기 공식 도움말이 도구로 할 수 있는 것
먼저 어떤 도구인지 알아보기Figma 완전 정복 — 기능별 상세 가이드Community에서 무료 템플릿·아이콘 가져오기내 파일로 복사되어 브랜드에 맞게 고쳐진 템플릿·아이콘처음 시작하기 — 무료 계정으로 디자인 시작내가 만든 Figma 파일 — 링크로 함께 볼 수 있는 상태프로토타입으로 클릭 가능한 목업 만들기Auto Layout으로 반응형 디자인 만들기UI 초안 10분 만에 뽑기 — 텍스트 → 완성 화면컴포넌트로 디자인 시스템 만들기
이 도구 가이드 전체 10개 보기
더 알아보기
요금 — 무료로 시작
기본 기능은 무료로 쓸 수 있고, 더 많이 쓰거나 고급 기능을 쓰려면 결제해야 해요.
공식 사이트에서 지금 금액 확인이렇게 많이 써요
- UI/UX 디자인 프로토타입 제작
- 팀 협업 디자인·피드백
- 개발자 핸드오프(CSS 코드 자동 생성)
- 컴포넌트·디자인 시스템 관리
알아두면 좋은 팁 6개
- Dev Mode에서 디자인 요소의 CSS·React 코드를 자동 추출 — 개발자 전달 시간 절감
- 컴포넌트화로 디자인 일관성 유지 — 한 곳 수정 시 전체 반영
- Comments 기능으로 디자인 파일에서 팀원과 바로 피드백 교환
Figma 쓰면서 불편했던 점 알려주기
처음 UI 설계 시 어디서 시작해야 할지 막막했던 적 있나요?