피그마의 우측 패널은 PPT의 기능과 거의 동일한 부분이 있는데, 보다 파워풀한 기능들이 몇개 있습니다.
PPT와 피그마 어떤 차이점이 있나?
1. 정렬 기능
프레임 위에 레이어(사각형 도형, 원 등의 오브젝트를 프레임 안에서 위치를 바로 잡는 기능
PPT에서 맞춤 기능과 거의 비슷하게 생각하시면 쉬움
2. 도형 리사이징 기능
X, Y는 프레임의 좌표 값
W : 해당 도형의 넓이
H : 해당 도형의 높이
Rotation : 해당 도형의 각도
corner radius : 해당 도형의 모서리 둥굴기 각도
3, 4 도형 서식
해당 도형의 색상이며, %는 해당 도형의 투명도
Tidy up(정렬)
이렇게 보면 PPT와 전혀 다를게 없어 보입니다. 그러나 피그마만의 파워풀한 기능 중 하나 Tidy up이라는 정렬 기능이 있습니다.
이미지 가져와서 활용하기
PPT에서도 그림파일을 불러와서 이미지를 넣을 수 있는 기능이 있는데 피그마의 경우도 똑같이 이미지를 삽입하는 기능 이미지를 복사하는 기능은 똑같다고 생각해도 무방합니다. 당연히 이미지를 자르는 것도 가능하구요!
그렇다면 피그마만의 파워풀한 이미지 기능에 대해서 알아보겠습니다.
왼쪽의 경우 피그마인데 그림을 삽입하는 방법은 2가지가 있습니다.
- 도형 생성 → 도형 클릭 → 왼쪽 상단 → 이미지 선택 → 불러오기(삽입)
- 파일에서 이미지 드래그 또는 복사 붙여넣기
UI/UX할 때 보통 정해진 도형 사이즈 안에 그림을 삽입하는 경우가 많다보니 도형 삽입을 하는 경우가 많아 이를 활용할 수 있습니다.
포토샵만큼은 아니지만 해당 그림의 보정기능이 들어가서 이를 활용할 수 있습니다. 그리고 이미지의 마스크업 기능이 있는데 인스타그램, 유튜브 등에서 유저의 아이콘을 나타내는 기능을 이미지로 사용할 수 있습니다.
PPT와 조금 다른 마스크 기능
- 원을 생성합니다.
- 마스크할 대상의 그림을 가져옵니다.
- 그림 위에 도형을 놓습니다.
오른쪽 마우스를 클릭하여 도형을 맨뒤로 보냅니다. - 해당 도형에 use as mask를 클릭합니다.
이미지가 찌그러짐 없이 이를 통해 사용하실 수 있습니다.
피그마 이미지 자르기 기능은 어디에?
- Fill : 해당 이미지가 원본 그대로 채워짐
- Fit : 해당 이미지의 원본이 꽉차게 채워짐
- Crop : 해당 이미지를 자르거나 원하는 곳으로 이동시킴
- Tile : 해당 이미지의 바둑판 타일처럼 이동가능
서로다른 Blur 이해하기
PPT에서는 그림자 효과라고도 말하며, 여러가지 다양한 그림자가 존재하는데, PPT와 다른 점은 블러의 세기를 조절할 수 있다는 것입니다. 효과를 얼마를 줄지를 선택할 수 있어 디자인하기에 좀 더 효율적이라고 할 수 있죠.
PPT와 다른 피그마의 기능에 대해 자세히 알아보았습니다.
2023.05.29 - [기획자의 피그마·Figma] - [피그마 기초 1강]피그마로 디자인을 할 때 알아야 할 기본 개념들
[피그마 기초 1강]피그마로 디자인을 할 때 알아야 할 기본 개념들
피그마는 기본적으로 온라인 환경에서 사용가능합니다. 피그마를 하기전 기초적인 기능에 대해서 알려드리겠습니다. 비트맵(Bitmap) 픽셀(점)이 모여 이루어진 그림 대표 포맷 : jpq, PNG 백터(Vector)
businessmodel.tistory.com
'기획자의 피그마·Figma' 카테고리의 다른 글
| [피그마 중급 1강] 라디오 버튼(Radio Button) 만들기<피그마의 프로토타입 만들기, PPT와 다른 기능> (0) | 2023.06.06 |
|---|---|
| [피그마 기초 5강]오토레이아웃(Autolayout)기능 활용하는 방법 (0) | 2023.06.05 |
| [피그마 기초 4강] Constraint 기능 알아보기(PPT와 다른 피그마의 파워풀한 기능) (0) | 2023.06.01 |
| [피그마 기초 3강] 그리드 이해하기 (0) | 2023.05.31 |
| [피그마 기초 1강]피그마로 디자인을 할 때 알아야 할 기본 개념들 (0) | 2023.05.29 |
