[CH 2. UXUI 디자인 입문 주차 | TIL ] 본캠프 17

[ TIL ]

 

1. 학습 키워드

• UI 디자인 심화
  
• 오버레이
• 모달
  
  

2. 학습 내용

• 버튼 컴포넌트
  
  • 버튼을 상하나 좌우로 2개 이상을 같이 사용하는 경우 → 스택(Stack;쌓다)
  • 단일 요소로 사용하는 경우도 있지만, 대부분의 경우 → 화면의 하단에 고정된 독(Dock) 형태
  • 조사 대상 화면 준비
  • 화면을 비교하며 분석한 내용 정리
  
  
• 포지션
  
  • 스태틱 Static
    요소에 아무런 속성값을 주지 않은 기본값
  • 픽스드 Fixed
    요소를 해당 위치에 고정 (※스크롤, 다른 요소에 구애받지 않음)
  • 앱솔루트 Absolute
    요소를 감싼 상위 컨테이너를 기준으로 고정 (※상위 컨테이너가 반드시 오토레이아웃)
  • 스티키 Sticky
    픽스드와 스태틱을 전환하며 적용되는 속성
    스크롤 안에서는 스태틱이다가, 스크롤을 넘어가면 화면 상단에 고정
    
    
• 모달
  화면 위에 새로운 화면을 띄우는 것
  
  • 윈도우 팝업
  • 레이어 팝업
    
    
• 오버레이
  바텀시트, 플로팅 버튼의 메뉴, 드롭다운 메뉴 등 화면 위에 중첩되는 요소
  
  
• 라이트박스
  모달 뒤에 가려진 화면의 반투명한 층
  
  

3. 학습 경험

1. 심화 과정이라 그런지, 수업 진도와 난이도가 조금 벅차게 느껴진다.
2. 과제 진도를 보완하기 위해 주말에도 학습할 계획이다.
   
   

4. 다음 학습할 것

• 개인 과제
  앱 UI 키트 및 프로토타입 제작하기