저자소개
서울과학기술대학교 디자인학박사를 졸업하였으며, 현재 동양미래대학교 웹응용소프트웨어공학과 겸임교수로 재직 중에 있다. 웹디자인, UI/UX 디자인, 웹퍼블리싱 등 다수의 강의 경력을 가지고 있으며, 주요 저서로는 『개더타운과 이프렌드에서 메타버스 세상탐험』(아이콕스), 『엄은영왕초보 유튜버 되기』(스토리비전), 『엄은영ACA 일러스트레이터CC』(성안당) 등 다수가 있다. 컬러리스트 기사, 멀티미디어콘텐츠제작 전문가, 웹디자인 기능사 등 다수의 자격증을 보유하고 있다.
목차
PART 01 피그마(Figma) 시작하기 section 01 피그마의 개요section 02 UI 디자인과 디바이스의 이해 1. UI 디자인의 이해 2. 디바이스의 이해section 03 그래픽 표현 방식의 이해 1. 그래픽 디자인 프로그램 2. 그래픽 컬러의 이해section 04 피그마 시작하기section 05 피그마 인터페이스 살펴보기 PART 02 피그마 기본 도구 활용하기 section 01 도형 도구를 활용하여 제작하기 1. 작업 영역 만들기 2. 사선 만들기 3. 로고 만들기 4. 라인 만들기 5. 텍스트 입력하기section 02 스타일과 디자인 시스템 라이브러리 관리하기 1. 작업 영역 만들기2. 색상을 스타일에 등록하기3. 텍스트 서식을 스타일에 등록하기4. Effect를 스타일에 등록하기하기5. Grid를 스타일에 등록하기 PART 03 피그마로 실무 디자인 시작하기 section 01 음악 스트리밍 앱 화면 제작하기 1. 헤더 만들기 2. 메인 컨텐츠 영역 만들기 3. 플레이 버튼과 더 보기 아이콘 제작하기section 02 랜딩 페이지 디자인 제작하기 1. 메인 이미지 영역 만들기 2. 여행 소개 페이지 만들기 3. 배너 만들기PART 04 피그마 핵심 기능 활용하기 section 01 디자인 시스템 생성 및 관리 1. 디자인 시스템 파일 불러오기 2. 타이포그래피 시스템 만들기 3. 그리드 시스템 만들기section 02 아카데미 웹디자인 프로젝트 제작 1. 데스크탑 반응형 코딩학원 웹디자인 제작하기-기본 레이아웃 설정하기 2. 헤더 만들기 3. 메인 비주얼 영역 만들기 4. 메인 콘텐츠 영역 만들기 01 : 제목 영역 만들기 5. 콘텐츠 영역 만들기 02 : 제목 영역 만들기 6. 콘텐츠 영역 만들기 03 7. 배너 영역 만들기 8. footer 만들기 9. 디자인 결과물 Export 하기PART 05 베이커리 앱 UI 디자인 제작하기 section 01 베이커리 앱 버튼 만들기 1. 베리언츠 이해와 제작하기section 02 베리언츠 앱 버튼 적용하기 1. 디자인에 필요한 아이콘 가져오기 2. 기본 Frame 화면 만들기 3. 상태 바 삽입하기 4. 헤더 만들기 5. 메인 비주얼 영역 만들기 6. 상세 설명 영역 만들기PART 06 프로토타이핑과 인터랙션section 01 캐러셀 인터랙션 제작하기 1. 앱 메인 화면 콘텐츠 수정하기 2. 페이지네이션 제작하기 3. 메인 비주얼 영역을 Carousel로 제작하기 4. Carousel에 인터랙션 적용하기section 02 이동 메뉴 설계 및 구현하기 1. 제목 설정하기 2. Overflow scrolling Interaction 제작하기section 03 프레임 연결 및 화면 전환하기 1. Frame 간의 Interaction 설정하기 2. 상세 화면에서 팝업 형태로 나타나는 Frame 간의 Interaction 설정하기section 04 화면 내의 연동과 인터랙션section 05 동적인 내비게이션 메뉴 구성 section 06 탭바 제작 및 스타일링 1. 탭바 제작하기 2. 탭바 메뉴와 앱 화면을 이동하는 Interaction 적용하기 3. 헤더와 탭바 고정시키기PART 07 피그마로 협업 및 개발 모드 살펴보기section 01 라이브러리 등록하기section 02 개발 모드 살펴보기 1. Div Mode (유료) 2. 플러그인section 03 공유하여 함께 살펴보기section 04 피그마 버전 history 살펴보기
