[디자인부트캠프] Day14 l 피그마 BASIC 01

오늘은 오즈코딩스쿨 프로덕트 디자이너 부트캠프 2기 14일차입니다.

14일차에는 어제에 이어서 피그마에 대해 배웠습니다! 특히 오토 레이아웃에 대해 딥하게 배운 시간입니다 😊

 

강의 내용 정리

 

- UI 구성 요소란?

: 사용자가 인터페이스를 탐색하고 상호작용하는 요소들

UI 디자인의 기본 단위 (버튼, 입력창, 카드, 네비게이션 바 등)

 

- UI 구성 요소의 중요성

사용자 경험(UX)의 시각적인 핵심 역할 수행

직관적인 인터페이스 제공 → 사용자의 학습 곡선 및 CTA 클릭 시간단축

일관성 유지 → 브랜드 아이덴티티 강화

- 기본적인 UI 구성 요소 종류

1. 네비게이션(Navigation): 메뉴 바, 탭 바, 사이드 바

2. 입력 요소(Input Elements): 버튼, 입력 필드, 체크박스, 라디오 버튼

3. 콘텐츠 카드(Content Card): 프로필 카드, 제품 정보 카드
4. 모달 & 알림창(Modal & Toast): 팝업, 경고 메시지

 

DAY 14 과제

: UI 구성 요소를 이해하고, 오토레이아웃 기능으로 실제 UI 구성 요소를 디자인합니다.

간단한 실습 후 저번 과제로 진행한 당근마켓에 적용해 보았는데요!

 

확실히 간격을 자동으로 맞춰주니 너무 편리했던 기능 같습니다! 선택이 아닌 필수인 기능이네요 😊

 

오늘도 화이팅!