[피그마] 와이어프레임 그리기 - 검색탭

Udemy의 하루 10분으로 끝내는 UXUI 디자인을 위한 실전 피그마 Figma 강의를 듣고 실습해보았다

 

 

 

1. 검색 및 오토레이아웃(위치 고정)

우선 위와같이 기본적인 그림을 넣어준다

 

 

가운데 정렬을 해주고 그룹으로 묶어준다

 

 

다음으로 최근에 검색한 내용을 나타나도록 해준다

 

글자가수가 변경되어도 X 가 움직이지 않도록 하기 위해선 우선 글자 입력하는 공간을 늘려준다

 

 

다음으로 X 표시와 함께 그룹으로 묶어준다

그룹으로 묶어주면 Auto Layout설정이 가능하다

 

Auto Layout설정을 해준다

 

 

그리고 다시 그룹으로 묶어주고 Auto Layout을 한번 더 동일하게 적용하면 된다

 

글자수가 늘어나거나 줄어들어도 X 표시는 그대로 있음을 확인할 수 있다

 

 

마지막으로 아래쪽에 구독자 부분을 추가해줬다

 

 

 

강의자료
https://www.udemy.com/share/109mqS/