Auto layout 내 예외 만들기, Resizing, Labeling 실습하기

[9/24_To Do]

• 피그마 실습 과제
  • Auto layout 내 예외 만들기
  • Auto layout Resizing
  • Component 활용
  • Component Labeling

 

 

피그마 실습 과정

 

* Auto layout 내 예외 만들기

오토레이아웃된 개체에 레이아웃을 위반하는 위치에 개체를 두어야 할 땐 Ignore auto latout을 사용하여 알림 버튼을 배치할 수 있었다.

 

 

* Auto layout Resizing

Min과 Max를 설정하여 리사이징의 한계를 설정할 수 있었다.

(좌: 최솟값 / 우: 최댓값) 설정한 한계까지만 리사이징되는 모습

출처) Auto Layout Guide: 모범사례, 팁 및 요령 | Figma

 

 

전체 프레임의 리사이징값을 설정해주어 변경되는 모습을 확인할 수 있다.

 

 

* Component 활용

컴포넌트를 활용하여 날짜 클릭이 가능한 달력(Calender)을 만들 수 있었다.

프로퍼티(Properties)의 베리언츠(Variant)를 사용하여 프로그레스바(Progress Bar)를 만들 수 있었다.

달력(Calender) 실습

프로그레스바(Progress Bar) 실습

 

 

* Component Labeling

라벨링	뜻
Default	기본 값
Hover	마우스 올렸을 때
Checked	클릭 했을 때
Disable	작동하지 않는 값

출처) 인터랙티브 컴포넌트와 오토레이아웃을 활용한 캘린더 UI 만들기

 

 

 

오늘의 TIL 질문

 

1. 오늘 하루 중 가장 성취감을 느낀 순간은 언제였나요?

주어진 피그마 실습 과제를 완료한게 가장 성취감이 컸다.

2. 만약 부족하다고 느낀 부분이 있다면, 내일 어떤 방식으로 보완할 수 있을까요?

오늘은 내내 같은 실습 과제를 진행하다보니 피로감이 크고 집중력이 떨어진 순간이 많았다. 가능하다면 여러 실습들을 적절히 섞어 진행하는 것이 집중도를 높일 수 있을 것 같다.

3. '나만의 학습 루틴'을 어떻게 잡아가고 싶나요?

오전, 오후, 저녁마다 다른 계획을 통해 집중과 몰입도 있는 학습 실천하기