번역이 되어 있지 않습니다!
Figma 도움말 링크만을 제공하오니, 크롬 브라우저 등을 이용하여 접속 후 브라우저가 제공하는 ‘번역’ 기능을 이용하기기 바랍니다.
시작하기
Figma 설정
- Figma 계정 만들기
- Figma 브라우저 요구 사항
- FIGMA를 위한 브라우저 구성
- 단축키 및 Quick actions 사용
- 오프라인에서 Figma 작업하기
- Figma 지원팀으로부터 도움을 받기
- 브라우저의 다운로드 폴더 선택
공유 및 사용 권한
- 공유 및 사용 권한 안내
- 팀에서의 역할 및 권한
- 조직의 역할 및 계정 유형
- 파일 및 프로토타입을 공유하거나 임베드하기
- 프로젝트, 파일 및 프로토타입에 초대하기
- 파일을 복사하고 공유할 수 있는 사용자 제한
- 초대 수락
- 접근 제거 또는 조정
데스크톱 및 모바일 Figma
- Figma 데스크톱 앱의 엔터프라이즈 배포
- Figma 모바일 앱 안내
- Figma 데스크톱 앱 다운로드
- iOS 및 안드로이드에 대한 Figma 미러 다운로드
- 데스크톱 앱에서 색상 관리
- 데스크톱 앱에서 UI 크기 조정
- 데스크톱 앱에서 링크 열기
FIGMA를 다른 앱에 연결
- 파일 및 프로토타입 임베드
- 임베디드와 상호 작용
- Asana와 Figma
- Bubble과 Figma
- Coda와 Figma
- Confluence와 Figma
- Dribbble과 Figma
- Dropbox 및 Figma
- Flinto 및 Figma
- Framer와 Figma
- Jira와 Figma
- Maker와 Figma
- Maze로 Figma 프로토타입을 테스트하기
- Notion와 Figma
- P2와 Figma
- Pendo와 Figma
- Principle와 Figma
- ProtoPie와 Figma
- Qatalog와 Figma
- Slack에 댓글 알림 수신
- StoriesOnBoard와 Figma
- Storybook과 Figma
- Trello와 Figma
- Zeroheight와 Figma
Figma design
Figma desing 시작하기
- 보기 레이어(View layers), 페이지 및 구성 요소(Components) (왼쪽 사이드 바)
- 디자인, 프로토타입 및 검사(inspect) (오른쪽 사이드 바)
- 도구 모음에서 디자인 툴 접근
- 캔버스 탐색
- 레이어와 객체 선택
- 레이어 간 거리 측정
- 부모, 자식녀 및 형제자매 관계
- 편집기에서 보기 설정을 조정
- Figma 컬러 모델
가져 오기 및 내보내기
이미지, 모양 및 도구
- Figma의 프레임
- 디자인에 이미지추가
- 프로토타입에 애니메이션 GIF 추가
- 프레임 및 그룹
- 이미지를 채우기로 업로드
- 모양 도구 (Shape Tools) 사용
- 이미지 배치와 함께 이미지를 대량 추가
- 벡터 네트워크 (Vector Networks)
- 캔버스에 이미지를 붙여 넣기
- 객체 편집
- 이미지 자르기
- 크기 조절 도구(Scale tool)로 레이어 사이즈 조정하기
- 캔버스 또는 프레임에 가이드 추가
- 아크 도구 (Arc Tool)를 사용
- 부울 연산
- 마스크
텍스트 입력 및 글꼴
- 선 높이 동작 (Line height behavior)
- 텍스트 시작하기
- 컴퓨터의 로컬 글꼴에 액세스
- 텍스트 도구로 문자 레이어 만들기
- 텍스트 레이어 편집
- 텍스트 속성 탐색
- 글 머리 기호 및 번호 지정 목록
- 텍스트에 링크 추가
- 텍스트 레이어에 이모지 추가
- 중국어, 일본어, 한국어 텍스트를 추가
- 아이콘 글꼴로 텍스트 레이어에 아이콘 추가
- 텍스트 스타일 생성 및 적용
- 텍스트 레이어 크기 조정
- 텍스트를 벡터 경로로 변환
텍스트 및 글꼴 문제 해결
레이어 속성 및 설정
- 모서리 반경 및 부드럽게(smoothing) 조정
- 스트로크(stroke) 속성 적용 및 조정
- 혼합 선택에서 색상 보기 및 조정
- 레이어 이름 바꾸기
- 정렬, 치수, 회전 및 위치 조정
- Figma의 페인트
- 텍스트 및 모양 레이어에 채우기 추가
- 레이어 잠금 및 잠금 해제
- 색상 선택기로 페인트 적용
- 가시성을 전환하여 레이어 숨기기
- 그림자 또는 흐림 효과 적용
- 스마트 선택으로 객체 정렬
- 혼합 모드로 독특한 효과 만들기
- 이미지 속성 조정
- 그리드(grid), 열 및 행이 있는 레이아웃 그리드 생성
- 자동 레이아웃으로 역동적인 디자인 만들기
- 제약 조건을 적용하여 레이어 크기 조정 방법 정의
- 레이아웃 그리드 및 제약 조건 결합
구성 요소 및 스타일
- Figma의 구성 요소 안내
- Figma의 스타일
- 컴포넌트 이름 지정 및 구성
- 디자인에 재사용할 컴포넌트 생성
- 색상, 텍스트, 효과 및 레이아웃 그리드 스타일 만들기
- 컴포넌트의 인스턴스 만들기
- 변형 생성 및 사용
- 변형이 있는 대화형 컴포넌트 만들기
- 레이어 및 객체에 스타일 적용
- 파일의 컴포넌트 인스턴스 간 스왑
- 인스턴스에 재정의(overrides) 적용
- 메인 컴포넌트로 변경
- 구성 요소에서 인스턴스 분리
- 변형 준비
- 스타일 관리 및 공유
라이브러리 및 설계 시스템
- Figma 라이브러리 가이드
- 분기 생성 및 변경 사항 병합
- 스타일과 컴포넌트 게시
- 라이브러리의 업데이트 검토 및 수락
- 디자인 파일의 라이브러리 관리
- 초안에 대한 라이브러리 관리
- 팀에서 라이브러리 관리
- 조직에서 라이브러리 추가 및 제거
- 라이브러리에 대한 액세스 권한 제거
- 라이브러리에서 스타일 및 컴포넌트 제거
- 라이브러리 게시 취소
- 라이브러리 및 컴포넌트 사용 추적
프로토 타입 및 애니메이션
- 프로토타입 천천히 움직이는 곡선
- 프로토타입에서 스크롤 위치 유지
- Figma의 시제품 제작(prototyping) 가이드
- 프로토타입 장치 및 시작 프레임 설정
- 프로토타입의 트리거
- 프로토타입의 액션
- 프로토타입의 애니메이션
- Figma Mirror 앱으로 디자인과 프로토타입 미리보기
- 프로토타입 상호 작용 및 애니메이션
- Smart Animate로 고급 애니메이션 만들기
- 프로토타입에서 오버레이 만들기
- 오버 플로우 동작이 있는 프로토타입 스크롤
- 프레젠테이션 보기에서 디자인 및 프로토타입 미리보기
- 모바일 장치에서 프로토타입 보기
- 프로토타입에 대한 댓글
협업 도구
Figma 도움말: https://help.figma.com/
