본문 바로가기

조금의 적극성/라이프해킹스쿨_강의

[3주차] 창업가를 위한 피그마 #14

반응형

Chapter 4. 머터리얼 디자인 아이콘 키라인 제작 실습

아이콘 키라인 제작

구글 머터리얼 디자인에서 제공하는 아이콘 가이드를 그대로 활용

 

24x24 DP frame - Layout grid (+활성화)

18x18 box - fill 0, stroke 1px, corner radius 1

 

community - icons - plugins - material design icons - try it  > Resource - plugins

To be more accurate disable Snap to pixel grid from preference 

 


 

Chapter 5. 컴포넌트 & 오토 레이아웃 실습

Component - 반복적으로 사용되는 UI 규격을 규정하는것

디자인 = 수정의 반복

ex. 버튼, 팝업, 카드, 해드, LNB, GNB

완성된 Component 등록후 Asset 패널에서 가져오기

Ctrl + Alt + K  - 컴포넌트

선택 선이 보라색으로 변경됨

 

Overrides : 인스턴스에서 수정된 영역에 한하여 오버라이드 (해제)가 적용됨

Master component - 일괄 수정 적용

Instance - 작업한 것만 수정됨 - 다시 컴포넌트와 연결하려면 우클릭 - reset all changes (오버라이드 이전 상태로 돌아감)

 

윈도우키 + 마침표

오토레이아웃 - 레이아웃 쉽게 변형 전환 + 반응형 적용 가능

선택후 우클릭 - Add auto layout / Shift + A

가장 큰 사이즈를 먼저 만든다 - 컴포넌트 등록은 가장 마지막에


 

Chapter 6. 배리언트 실습