트위닝.

Slides:



Advertisements
Similar presentations
1/ 편집 기능 사용하기 – 실습 1 글자 모양을 바꾸고 싶은 곳을 블록 설정 [ 글자 모양 ] 대화 상자에서 [ 글꼴 ] ‘ 궁서체 ’, [ 글자 색 ] ‘ 토마토색 ’ 으로 선택 → [ 설정 ] 클릭 → 글자 모양 변경.
Advertisements

가족 문화 정보 한마당 대단원 1 – 중단원 4 영진.COm영진.COm 1. 마음이 담긴 쪽지 쓰기  워드 프로세서 (Word processor)  문서를 작성하고 편집 · 출력할 수 있는 프 로그램  워드 프로세서의 기능  문서의 입력 기능  문서의 편집.
1/29 키보드로 직접 입력할 수 없는 다양한 기호와 한자를 입력하는 방법을 알아 보자. 또한 블록으로 영역을 설정하는 여러 가지 방법에 대해 살펴본 후 블록 으로 설정된 내용을 복사하여 붙여넣거나, 잘라내고 이동하는 방법에 대해서 도 알아보자. 02_ 문서의 입력과 편집.
옴니아 2 무선 인증 매뉴얼 ( 윈도우 모바일 폰 설정 동일 ). ▶다음 화면은 옴니아 2 및 윈도우모바일을 사용하는 스마트폰 기기들의 무선인증을 하기 위한 화면입니다. ▶윈도우 모바일폰의 경우 무선인증서를 발급받기 위해 폰의 레지스트리 설정을 조정해 주어야 합니다.
홈페이지를 위한 메뉴바 만들기 메뉴바 제작 순서 LAYER STYLE 대화상자 Shape툴로 기본모양 제작
자막과 트랜지션 Subtitle & Transition
Cary UV 분석 매뉴얼 1. 바탕화면의 Cary WinUV 클릭 정량분석 다 파장 동시분석 단 파장 분석
파워포인트 2007.
제 7 장 함수 사용을 통해 엑셀 정복하기.
Chapter09 CSS3 애니메이션 HTML5 Programming.
149개의 실습예제로 배우는 Flash 8.
Flash II.
코크파트너 설치 가이드 Window 7.
1차시: 질량 및 탄성 제어하기 SPL3D VR 툴 설치하기 구체(공) 도형 추가 후 질량 부여하기 바닥 추가하기
Outlook Express 메일 백업 및 복원가이드
레고 Digital Designer 사용법 알아보기
멀티미디어관에 놀러온 졸라맨 팀 명 : 둘이 합쳐 IQ 100 팀 원 : 컴퓨터 공학 전공 김제선
Raster 애니메이션은 GIF Animator로 만들면 쉽다
iframe 사용하기 Chapter 3 Part 2
D / K / I / T / E / C / H / N / O / L / O / G / Y
로고 화면 만들기 자료번호 애니메이션 기본 화면 구성 및 설명 기본 화면 구성 설명
In2smile PT Template in2smile.com.
스크래치 언어 이해 스크래치 이용법 습득 고양이가 말을 하며 움직이는 예제 작성
주의할 점!!!! 1. 문자 쓸 때 문자 틀 글자 크기에 맞추기 2. 색 보정할 때 Colorize 체크하고 /
주의할 점!!!! 1. 문자 쓸 때 문자 틀 글자 크기에 맞추기 2. 색 보정할 때 Colorize 체크하고 /
2d 게임 프로그래밍 galaga 유진명.
주의할 점!!!! 1. 문자 쓸 때 문자 틀 글자 크기에 맞추기 2. 색 보정할 때 Colorize 체크하고 /
플래시 멀티미디어 저작 이론 김수우 김진영
TERMPORJECT 라미君 이야기 EPISODE 1
CSS2(Cascading Style Sheets)
Web & Internet [03] HTML5 다양한 태그
"애니메이션으로 처리될 문구의 자리 표시자" 애니메이션 설경 (고급)
마인드 맵.
2차시: 달의 공전 지구과학
2D게임 프로그래밍 1차 발표 자료 정재훈.
4 넷째마당.
SEOUL NATIONAL UNIVERSITY OF SCIENCE & TECHNOLOGY
3D 프린팅 프로그래밍 01 – 기본 명령어 강사: 김영준 목원대학교 겸임교수.
파워포인터 활용 수영문화센터 전명복 만듦.
Microsoft Word 2002 제4장 그리기와 그림 삽입하기.
기능별 풀이방법 (2. 목차 슬라이드).
Moving Control in Web using Ajax Toolkit
스위시 맥스2 이미지 갤러리 만들기 아래 그림이 스위시 맥스2로 만들 이미지 갤러리 이다.
COMPUTER ANIMATION (Key Frame Animation)
149개의 실습예제로 배우는 Flash 8.
인체 대 탐험 3D GAME ENGINE 게임 공학과 이성진.
SEOUL NATIONAL UNIVERSITY OF SCIENCE & TECHNOLOGY
Tween Animation 천승현.
S-Work 2.0 DRM 신규 버전 설치 가이드 SOFTCAMP
균형이진탐색트리 이진 탐색(binary search)과 이진 탐색 트리(binary search tree)와의 차이점
컴퓨터공학전공 3학년 팀 명 : 문 제 아 팀 원 : 이명하, 김선미
- 18차시 - 엔딩 크레딧 영상 만들기 - Leading 기능 사용하기 -.
헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 헤드라인 텍스트 샘플 텍스트
단축키 기능 1. 단축키 기능 설명 Alt + R 조회 S 저장 I 삽입 A 추가 D 삭제 P 출력 Q 닫기
Cakewalk Sonar Graphic EQ.
플래시 CS3 액션스크립트3.0.
Part 2  파워포인트 2003.
Animating Pictures with Stochastic Motion Textures
슬라이드 쇼의 설정 슬라이드 쇼의 실행 파일과 폴더의 관리 글꼴을 포함해서 저장 웹 페이지로 게시 압축 파일
초코가좋아시설 에이이, 비이이, 씨이이 방문일자: XXXX.XX.XX.~ XXXX.XX.XX. 민트:
멀티미디어 활용 -플래시 CS3 류 정 남.
워드프로세서 실기 10일차 강 사 : 박영민.
Power Point 예제 디자인 적용 (서식) - (디자인적용) - (원하는 디자인 선택)
플래시MX2004 디자인스쿨 Chapter 11. 플래시와 사운드.
도형 클립아트와 그림 워드아트와 텍스트 상자 스마트 아트
Chapter 11. 문서 인쇄 및 파일 형식.
타이머를 시작하려면 슬라이드 쇼 메뉴에서 쇼 보기를 클릭하십시오.
BoardGame 보드게임 따라가기.
3. 모션과 트랜지션 Motion & Transitions
3. 모션과 트랜지션 Motion & Transitions
Presentation transcript:

트위닝

1. 트위닝이란? 트위닝(Tweening) 기법 트위닝 기법의 구분 시작 프레임에서 마지막 프레임의 위치 값이나 변화를 적용하면 중간과정을 매 프레임마다 보여주는 기법 애니메이션을 쉽게 구성 가능하게 도와준다. 트위닝 기법의 구분 모션 트위닝 (Motion Tweening) 쉐이프 트위닝 (Shape Tweening)

2. 모션 트위닝 이란? 모션 트위닝 (Motion Tweening) 모션 트위닝의 적용 범위 같은 모양을 가지고 위치 이동, 크기변화, 회전 같은 그룹이나 심벌로 묶여 있는 객체를 움직여주는 기법 모션 트위닝의 적용 범위 위치 이동 작아지는 애니메이션 점점 투명해지는(어두워지는) 애니메이션 색상이 변하는 애니메이션 점점 빨리 움직이는 애니메이션 중심축을 이용한 회전 애니메이션 가이드라인을 이용해 마음대로 움직이는 애니메이션

3. 모션 트위닝의 적용 조건 모션 트위닝의 적용 조건 시작과 끝 프레임은 반드시 키프레임으로 정의 키프레임에 객체는 반드시 심볼객체, 그룹객체이 그룹객체는 트위닝을 만든 후 수정해서는 안됨 잘못된 모션 트위닝 올바른 모션 트위닝

4. 쉐이프 트위닝 이란? 쉐이프 트위닝 (Shape Tweening) 쉐이프 트위닝의 적용 범위 하나의 객체가 전혀 다른 모양의 객체로 자연스럽게 변하는 효과로 일종의 몰핑효과로 볼 수 있음 쉐이프 트위닝의 적용 범위 글자가 이미지로 변화하는 애니메이션 이미지가 글자로 변화하는 애니메이션 이미지가 이미지로 변화하는 애니메이션 글자가 글자로 변화하는 애니메이션

5. 쉐이프 트위닝의 적용 조건 쉐이프 트위닝의 적용 조건 시작과 끝 프레임은 반드시 키프레임으로 정의 키프레임의 객체는 반드시 도형객체이어야 함 잘못된 모션 트위닝 올바른 모션 트위닝

⑨ 6. Frame 패널(1/2) Frame 패널 모션 트위닝 지정시 Frame 패널 프레임에 라벨을 부여하거나 트위닝을 선택하는 옵션 모션 트위닝 지정시 Frame 패널 ③ ⑤ ⑨ ① ④ ⑥ ② ⑦ ⑧ ⑦ ① Frame : 프레임에 라벨을 입력 ② Label type : 라벨 타입 선택 ③ Tweening : 트위닝의 종류 지정 ④ Easing : 애니메이션의 속도 조정 ⑤ Scale : 크기 조정하는 모션 트위닝 지정시 선택 ⑥ Rotate : 회전하는 애니메이션에서 회전방향과 회전의 횟수를 지정 ⑦ Orient to Path, Snap : 경로 안내를 이용할 때 선택 ⑧ Sync : 메인무비와 무비심벌의 프레임차이를 조정 ⑨ Sound, Effect, Sync : 현재 프레임에 삽입된 사운드에 관련된 옵션

⑤ ① 6. Frame 패널(2/2) 쉐이프 트위닝 지정시 Frame 패널 ② ⑤ ① ③ ④ ① Frame, Label type : 모션 트위닝과 동일(프레임에 라벨을 입력) ② Tweening : 트위닝의 종류 지정 ③ Easing : 애니메이션의 속도 조정 ④ Blend : 트위닝 과정에서 그림처리 방법 지정 - Distributive : 중간 그림으로 만들어지는 도형을 부드럽게 처리 - Angular : 각진 모서리나 직선이 중간 그림에서도 유지되도록 처리 ⑤ Sound, Effect, Sync : 현재 프레임에 삽입된 사운드에 관련된 옵션

7. 모션 트위닝 예제 기와 위를 달리는 고양이 고양이_캐릭터_달리기.fla 파일을 연다. Library에 how_01_m 무비클립을 연다. 10 프레임 위치 고군에서 기와로 드래그 후 “F5” 드래그 후 “F5”

7. 모션 트위닝 예제 기와 레이어의 10프레임 클릭 후 “F6” Shift+Alt+Ctrl+R 을 누르면 눈금자가 생긴다.

7. 모션 트위닝 예제 반복되는 기와 이미지를 Shift키를 누른 상태로 왼쪽으로 옮겨준다. 이 때, 부자연스럽지 않게 하기 위해 같은 그림에 맞춰준다.

7. 모션 트위닝 예제 기와 레이어의 가운데 프레임에 우클릭 나오는 메뉴 중 Create Motion Tween 선택. 바뀜

7. 모션 트위닝 예제 완성

8. 쉐이프 트위닝 예제 모습을 서서히 드러내는 건물 모습을 서서히 드러내는 건물.fla를 연다.

8. 쉐이프 트위닝 예제 빛 레이어의 50프레임 클릭 후 “F6” 빛 레이어의 가운데 프레임 우클릭, 나오는 메뉴 중 Create Shape Tween 클릭

8. 쉐이프 트위닝 예제 빛 레이어를 제외한 나머지 2개의 레이어에 잠금 활성화를 시킨다. 빛 레이어의 50 프레임 클릭 후 태양을 건물 상단으로 이동 잠금 이동

8. 쉐이프 트위닝 예제 빛 레이어를 잠그고 지구 그림자 레이어의 잠금을 푼다 지구 그림자 레이어의 50 프레임 클릭 후 “F6”

8. 쉐이프 트위닝 예제 도구 상자의 Gradient Transform Tool 클릭

8. 쉐이프 트위닝 예제 그라데이션 조절자를 클릭하여 가로 크기를 줄이고 가운데 클릭 후 왼쪽 하단으로 이동시킨다. 지구 그림자의 레이어 가운데 클릭 후 Create Shape Tween 클릭 클릭 후 크기 줄임 클릭 후 이동시킴

8. 쉐이프 트위닝 예제 완성

감사합니다.