Figma 시작(단축키 설명)

JooKit 주킷 2020. 5. 28. 22:43
목차 접기
728x90
반응형

< figma 자주쓰는 단축키 >

- f : 프레임 (아이폰 SE 선택)
- r : rectangle
동그라미 : 살짝 둥글게 조절 가능
(직사각형, 삼각형, 원 모두 가능)

- ctrl + shift + ? --> showHelp(단축키 설명)
- arrange menu
  - art + a : 좌측 이동
  - art + d : 우측 이동
  - art + v : 수직 정렬(가운데로, 방향은 no)
  - art + h : 가로 정렬 열에서 가운데 정렬
  - art + w : 맨 위로 이동
- 간격 확인(픽셀)
  - art + 마우스 키
- 색 변경(text 포함)
  - fill
  - stroke : 글자 외곽 라인
  - bold : 두껍게??
  - Drop Shadow : 그림자
  - 그림자가 많아질 수록 더 선명해진다.
  - 그림자 색도 지정할 수 있음.
- t : text 입력(마우스 클릭)
- 글자 정렬
  - ctrl + art + l : text 좌측 정렬
  - ctrl + art + r : text 우측 정렬
  - ctrl + art + t : text 가운데 정렬
  - text frame 조정 : 모서리 더블 클릭
- frame 안에서 가운데 정렬
- 2개 클릭
- 이 상태에서 정렬 단축키 사용
- 더 큰 frame을 기준으로 작은 frame이 정렬 된다.
- ctrl + art + k : create component
컴포넌트 등록 후, frame 밖에 1개 꺼내놓고
복사해서 사용하면 한꺼번에 모두를 변경할 수 있다.
(text 제외)
( 여러가지를 한 동작으로 묶는 기능) /버튼 타입 1

- 더블 클릭 : 파일명 변경
- prototyping
- space 누른채로 frame 이동 가능
- shift 누르고 다른 frame 누르면 같이 선택
- group으로 만들고 싶으면 ctrl + G1
- shift 수평
- alt 복사????
- 줄을 만들 때, 빨간색이 보이면 수평
- done 구현 완료
- shift + 방향키 --> 직사각형 모서리 모양 변경 가능
- ctrl + d ??????/
- font awesome : 아이콘 참고 사이트
( 폰트를 font awesome free로 변경해주어야
아이콘이 나타난다 )
- 자동 저장되고 version hisory 들어가면
시간별로 작업한 것으로 돌아갈 수 있다.
특정 작업을 + 저장해서 돌아가기를 반복할 수도 있다.

728x90
반응형
LIST

'HTML, CSS' 카테고리의 다른 글

CSS 코드 (z-index, transform)  (0) 2020.06.05
CSS 색상 참고 사이트  (0) 2020.06.04
CSS, HTML 연습  (0) 2020.06.04
CSS inherit(상속)  (0) 2020.06.04
CSS display 속성 정리  (0) 2020.06.03