Animate Mobile Interfaces with Adobe Illustrator and Adobe After Effects 교육 과정

소개

Adobe 일러스트레이터 및 Adobe 애프터 이펙트

• Adobe Illustrator 및 Adobe After Effects에 사용되는 에셋 및 구성 요소
• Adobe Illustrator 및 Adobe After Effects의 디자인 시스템 환경

Web Design 개요

• UX 대 UI
• 저충실도 디자인 vs 고충실도 디자인 vs 반응형 모바일 디자인

개발 환경 준비

• 설치 Adobe 일러스트레이터
• Adobe After Effects 설치 중

Adobe Illustrator로 계획 및 애니메이션 만들기

• 사이트맵 만들기
• 충실도가 낮은 와이어프레임 만들기
• 충실도가 높은 와이어프레임 만들기
• 모바일 와이어프레임 생성
• 기둥 그리드를 사용한 설계
• Illustrator 템플릿 사용
• 색상 및 글꼴 추가
• 이미지 추가 및 정리
• 레이어 사용
• 기호 및 아이콘 만들기
• 반응형 모바일 애플리케이션의 표준 확정

Adobe After Effects를 사용한 애니메이션

• Adobe Illustrator에서 작품 가져오기
• 재사용 가능한 구성 요소 만들기
• 대시보드 타일 및 대시보드 화면 구축
• 대시보드 타일 및 대시보드 화면 마무리
• 요소 및 화면 애니메이션
• 애니메이션 생성 및 추가
• 애니메이션 마무리
• 모든 최종 시퀀스를 gif로 내보내기

요약 및 결론