본문 바로가기

스킬업 챌리지

#12_변수값 이해하기(Color ver.)<스킬업 챌린지>

변수가 뭔대요! 대체

강의 한번 들었는데 무슨 말인지 정말 모르겠다 @_@

일단 개쩌는 기능인건 알겠음

 

변수란 : 일관된 디자인을 위해 사용되는 '변하는값'

디자인 요소들을 쉽게 업데이트하고 일관성 있는 디자인을 유지할 수 있다.

 

 

이 분 설명 너무 잘하신다 👏👏

 

변수는 변하는 수를 말함

나이 = 20

차은우 나이 = 나이

차은우 나이 = 20

 

나이를 25로 바꾸면

차은우 나이 =25로 바뀌는것

 

 

 

[피그마에서 사용 가능한 타입]

Color - Fill, Stroke, Effects

Number - Width&Height, Padding, Margin, Gap, Corner Radius, Stroke

String - Text

Boolean - True of False

 

 

 

 

[Color]

 

 

1. Primary 컬러를 보라색을 설정한 UI 임니다

 

 

2. 우측패널에서 [Local variables-color] 클릭

3. Create vaiabe에서 변수 컬러값 입력

 

 

4. 라이브러리에서 변수컬러 blue 선택

(*primary = blue라는 변수 등록)

 

 

 

5. Selection colors에 변수컬러 Primary가 생성됨(파란색)

6. 변수컬러 Primary를 선택

 

 

6. 변수컬러에서 red를 추가 한 후,

primary 컬러를 red로 변경하면

primary로 등록된 컬러는 전부 red로 변함

 

 

7. 변수별로 스코핑 설정도 가능

(*primitive 컬러 같은 경우 라이브러리에서 노출이 안되도록 사용하는게 편리함)

 

 

 

 

약간 알듯말듯한 너낌쓰.. 머리 아푸네 ㅋㅋㅠ

다음 시간은 변수 number 개념에 대해서..