Chapter 01 스케치, 시작 전 몸풀기
Lesson 1 스케치, 왜 열광할까요?
Lesson 2 스케치 구입 및 설치하기
Lesson 3 스케치 화면 구성과 인터페이스
Lesson 4 스케치 기본 기능 익히기
파일 생성, 열기 및 저장하기
[간단 실습] 새로운 파일을 만들고 저장하기
Auto Save와 버전 컨트롤
Lesson 5 Page, Artboard, Laye
Page
Canvas와 Artboard
Layer
Lesson 6 선과 다각형 그리기
Ruler, Guide, Grid
직선 그리기
화살표 그리기
기본 도형 그리기
[간단 실습] 정삼각형 그리기
다양한 형태 그리기
Lesson 7 오브젝트 편집하기
Lesson 8 회전과 변형 및 정렬하기
회전하기 - Rotate
변형하기 - Transform
[간단 실습] 입체 표현을 위한 각 부위 만들기
정렬하기 - Arrange
Lesson 9 다양한 화면 해상도에 빠르게 대응하기 _ 89
Chapter 02 스타일 입히기의 기본
Lesson 1 스타일 적용하기
인스펙터 영역 길들이기
스타일을 추가하고 삭제하기
색상 값 조정하기
Blending
Lesson 2 오브젝트 채우기, Fill 옵션의 팝업 창 파헤치기
채우기 옵션 선택하기
그러데이션 채우기 사용하기
패턴 및 이미지 채우기 사용하기
텍스처 채우기 사용하기
Lesson 3 오브젝트 테두리, Borders 항목 파헤치기
테두리 기본 옵션 살펴보기
테두리 고급 옵션 살펴보기
Lesson 4 그림자 효과로 입체감 살리기
그림자 추가하기
Lesson 5 오브젝트 흐림 효과 적용하기
Lesson 6 텍스트 입력부터 스타일 적용까지
텍스트 오브젝트를 추가하고 내용 입력하기
텍스트 오브젝트의 인스펙터 영역 살펴보기
Lesson 7 스타일을 저장하고 활용하기
Shared Style 을 저장하고 적용하기
Text Style 을 저장하고 적용하기
Lesson 8 비트맵 이미지 다루기
Chapter 03 앱 화면 디자인으로 본격 시작하기
Lesson 1 작업에 필요한 재료 갖추기
[간단 실습] 디자인 템플릿 준비하기
[간단 실습] 폰트 설치하기
Lesson 2 앱 화면 기본 프레임 만들기
Google Material Design Guide 및 만들 화면 살펴보기
안드로이드 화면 프레임 만들기
상태 표시줄 추가하기
Lesson 3 Map 화면 만들기
Floating Search bar 만들기
Bottom bar 만들기
지도 배경 및 액션 버튼 만들기
Lesson 4 Store Detail 화면 만들기
Guide Line 및 상단 이미지 영역 만들기
매장 이름과 간단한 정보 영역 만들기
CALL / SAVED / SHARE / WEBSITE 버튼 영역 만들기
매장 소개 영역 만들기
매장 상세 정보 영역 및 마무리
Lesson 5 Store Detail의 스크롤 화면 만들기
기본 레이아웃 완성하기
카드 컴포넌트 만들기
카드 컴포넌트 채우기
카드 컴포넌트의 별점 개수 변경하기
Chapter 04 앱 화면에 스타일 추가하기
Lesson 1 스타일 적용하기
Map 화면에 색상 적용하기
Store Detail, Store Detail_ Scroll 화면에 색상 적용하기
Lesson 2 이미지 추가하기
Pattern Fill로 채우기
Symbol 이미지 채우기
Chapter 05 디자인 공유하기:Design Guide&Asset
Lesson 1 디자인 공유를 위한 Deliverable 파악하기
Lesson 2 디자인 Asset 생성의 기본
로컬 폴더로 Export하기
Export 상세 설정 변경하기
Slice 로 Export할 영역 지정하기
코드로 Export하기
Lesson 3 Zeplin으로 Design Guide 자동 생성하기
서비스 가입 및 설치하기
Export 및 Design Guide 생성하기
Export 후 Zeplin 화면 구성 살펴보기
화면별 가이드 살펴보기
컴포넌트별 디자인 가이드 확인하기
Lesson 4 Zeplin을 이용한 버전 관리 및 커뮤니케이션
Version Control 확인하기
Note로 커뮤니케이션하기
Chapter 06 Prototype & Wireframe
Lesson 1 InVision 사용 준비하기
서비스에 가입하고 InVision Sync 설치하기
스케치 파일을 저장하고 Asset 추출하기
InVision 웹 사이트에서 Sync 내용 확인하기
Lesson 2 InVision 웹 사이트에서 Prototyping하기
Prototyping 작업화면 구성 살펴보기
각 화면 Prototyping 설정하기
인터랙션 결과 확인하기
Lesson 3 InVision Craft로 모든 과정을 더욱 간단하게!
InVision Craft 설치 및 디자인 파일 연동하기
InVision Craft 로 빠르게 Prototyping 하기
Lesson 4 InVision에서 Design Guide 확인 및 커뮤니케이션하기
Design Guide 생성 및 버전 컨트