피그마 기초

피그마 툴 이용 방법과 용어에 대해

---

디스플레이와 픽셀

- 디지털 화면을 디스플레이라 부름

- 디스플레이는 픽셀(Pixel)이라는 작은 칸들로 이루어져있으며 픽셀의 크기가 따로 정해져 있지는 않다.

-해상도 : 디스플레이의 선명한 정도, (디스플레이 안에 있는)픽셀의 수

*픽셀의 갯수는 가로 줄 픽셀 수 * 세로 줄 픽셀 수 ex.1920*1080 디스틀레이는 가로 줄에 1920개, 세로 줄에 1080개의 픽셀이 들어가있다.

해상도와 픽셀의 관계

- 화면 크기가 같다면 화면 크기가 클수록 픽셀 한 칸의 크기도 커진다.

- 화며 크기가 같다면 해상도가 높아질수록 픽셀 한 칸의 크기는 작아진다.

일반적으로 화면 크기가 클수록 해상도도 높아진다.

---

1배수 디자인

1배수 디자인 개념

디자인을 할 때 기준이 되는 사이즈를 1배수 디자인이라고 한다.

* 1배수의 뜻은 1배(100%), 원본 사이즈

https://yesviz.com/viewport/ 디바이스별 픽셀 배율 및 해상도 확인하는 곳

1배수 디자인이 실제 스마트폰에 구현되는 과정

이미지 표현 방식

- 래스터(Rater) 방식

1) 해상도가 높을수록 화질이 좋다.

   * 일정한 칸 안에 색을 넣는 모자이크 같은 형식이기때문에 픽셀의 갯수가 많을수록 화질이 좋다.

2) 해상도가 낮은 이미지를 크게 만든다고 화질이 좋아지지 않는다.

3) 확대와 축소를 반복하면 색상 정보가 사라진다.(깨진다. 열화됐다고 표현한다.)

4) 단순한 방식이라 고해상도 이미지를 표현하기 좋다.

 

- 백터(Vactor) 방식

1) 확대 및 축소 등 크기 변형이 자유롭다.

2) 이미지가 크고 복잡하면 수식도 복잡해진다.

  * 고해상도의 많은 색을 표현하는 경우 수식이 매우 복잡해서 파일 크기가 커짐

---

8포인트 그리드(8-point grid design)

일반적으로 디자인 요소들은 8의 배수로 만든다는 규칙을 가지고 있다.

꼭 8의 배수인 이유

최근에는 디바이스의 해상도가 좋아져서 더 세밀하게 만들기 위해 8대신 4나 2배수를 사용하는 경우도 많음

---

레이어(Layer, 층)

피그마에서 도형이나 텍스트를 만들면서 쌓인 요소가 층을 이루는데 그 층을 레이어라고 한다.