1. 글자 입력하기
단축키 t 글자 입력 후 오른쪽 3번 칸에서 글자 속성을 변경한다.
2. 삼각형 모양 선택하기
글자와 삼각형 선택(drag) 한 후 마우스 우클릭 padding 등 설정해주고
외곽선 넣기 위해 stroke 선택하여 색 넣기,
배경색 넣기 위해 fill 선택하여 색 넣기.
frame 복제 alt 누르고 아래로 드래그 , 또는 ctrl + c, ctrl + v 내용 수정하기
site1,2,3 선택 후 정렬 후 우클릭 add auto layout 또는 shift + a
각각 선택후 stroke 없애기
frame5 선택후 stroke 넣기
전체 선택 후 create component ( ctrl + alt + k)
properties 의 + 클릭 variant 클릭
총 5개의 variant 를 만듬
첫번째 site 부분 더블클릭하여 delete
나머지 화살표들도 같은 방법으로 회전 시킨다.
첫번째 요소 선택 후 배경색 넣기
같은 방법으로 아래처럼 배경색 넣기
연결하기
오른쪽 상단 prototype 클릭
family site 상자 클릭하여 파란색 원을 드래그하여 연결한다.
대화상자 나오면 instant 클릭하여 smart animate 선택 site1 더블클릭하여 선택 다음 variant 로 연결한다.
test 위하여 사각형 툴(r) 선택후 사각형 그리기
'figma' 카테고리의 다른 글
| 스크롤 기능 구현하기 (0) | 2024.02.23 |
|---|---|
| 피그마 커뮤니티 활용 (0) | 2023.12.18 |
| 도형안에 이미지 한번에 넣기 (0) | 2023.09.13 |
| figma - 도형 안에 이미지 넣기 - 이미지 위치 조정 가능 (0) | 2023.09.13 |
| FIGMA 단축키 (0) | 2023.07.20 |