플래시 CC 무작정 따라하기

(1)

플래시 CC 무작정 따라하기

넷째마당 – 고급 애니메이션과 멀티미디어 적용

(2)

셀 애니메이션 만들기

: Frame by Frame :

062

빈 키프레임 삽입하기

① Timeline 패널에서 ‘Weather’ 레이어의 3프 레임을 선택한 다음 마우스 오른쪽 버튼을 클릭하여 Insert Keyframe을 실행

② 같은 방법으로 ‘6, 9,12…’와 같이 3프레임마 다키프레임을 추가

색상 변경하기

① Timeline에서 3프레임을 선택한 다음 Tools 패널에 서 선택 도구 선택

② 스테이지의 여백을 클릭하여 선택을 해제하고 오 른쪽 위 초록색 사각형을 선택

③ Properties 패널의 Fill color 색상 상자를 선택하고 색상 선택 창이 표시되면 ‘#d263a1’을 입력

④ 같은 방법으로 Timeline 패널에서 ‘6, 9, 12…’처럼 3 프레임마다 선택한 다음 18프레임까지 사각형 색 상을 ‘#d263a1’로 설정

(3)

일부분씩 보여지는 무비 만들기

: Create Shape Tween :

063

벡터 객체 변형 및 이동하기

Tools 패널에서 자유 변형 도구를 선택한 다음 중심점을 스테이지 왼쪽 위로 이동하고 일러스 트가 모두 가려지도록 사각형의 오른쪽 아래 조 절점을 스테이지에 맞춰 드래그

셰이프 트위닝 적용하기

Timeline 패널에서 ‘도형 마스크’ 레이어의 1~30프레임 사이를 선택한 다음 마우스 오른 쪽 버튼을 클릭하여 Create Shape Tween을 실 행

(4)

날아오는 이미지 만들기

: Create Classic Tween :

064

이미지를 심볼로 등록하기

① Ctrl+R 키를 눌러 Import 대화상자가 표시 되면 04 폴더에서 ‘0~2.jpg’ 파일을 선택한 다음 <열기> 버튼을 클릭하여 이미지를 불

② 선택 도구로 ‘0.jpg’ 파일을 선택한 다음 심러오기 볼로 등록하기 위해 F8 키를 누릅니다

클래식 모션 트윈 실행하기

① 1~30프레임 사이를 선택하고 마우스 오른 쪽 버튼을 클릭하여 Create Classic Tween 을 실행

② Properties 패널의 Tweening 항목에서 Ease 를 ‘100out’으로 설정하여 모션의 시작 부 분은 빠르게, 끝 부분은 천천히 이동

(5)

모션 트위닝 편집하기

: Motion Editor :

065

모션 편집기 사용하기 - Motion Editor

❶ Location : X /Y /Z 좌표를 이용하여 Ease를 설정합니다.

❷Transform : 객체의 기울기와 크기 좌표를 설정합니다.

❸ Filters : 다양한 필터 효과를 설정합니다.

❹Add anchor point on graph : 그래프에 기준점을 추가합니다.

❺ Restore View : 그래프 크기를 화면 크기에 알맞게 조정합니다.

❻ Remove tween for selected property : 트윈 모션을 삭제합니다.

❼Add Ease : Ease 효과를 추가합니다.

❽ Zoom : Motion Editor를 확대 또는 축소합니다.

(6)

가이드에 따라 움직이기

: Classic Motion Guide :

066

클래식 모션 트윈 적용하기

‘Guide’ 레이어의 1~40프레임 사이를 선택한 다음 마우스 오른쪽 버튼을 클릭하여 Create Classic Tween을 실행

모션 가이드 만들기

Timeline 패널에서 ‘Guide’ 레이어를 선택한 다 음 마우스 오른쪽 버튼을 클릭하여 Add Classic Motion Guide 를 실행

(7)

기준점을 따라 이동하기

: Create Motion Tween :

067

모션 트윈 적용하기

‘Bus’ 레이어의 5~50프레임 사이를 선택하고 마 우스 오른쪽 버튼을 클릭하여 Create Motion Tween을 실행

객체 이동하기

Timeline 패널에서 ‘Bus’ 레이어의 10프레임을 선택한 다음 그림과 같이 버스를 오른쪽으로 드 래그하여 이동

(8)

기준점을 기준으로 회전하기

: Create Motion Tween :

068

모션 트윈 실행하기

배경 위에 드레스와 나뭇잎이 나타나면 ‘Dress’

레이어의 1~30프레임 사이를 선택한 다음 마 우스 오른쪽 버튼을 클릭하여 Create Motion Tween 을 실행

회전 각도 설정하기

모션 트윈이 설정되면 Timeline 패널에서

‘Dress’ 레이어의 1~30프레임 사이를 선택합 니다. Properties 패널에서 Rotation 항목의 + 를 ‘15°’로 설정

(9)

튀어 오르는 애니메이션 만들기

: Bounce :

069

인스턴스 불러오기

Timeline 패널에서 ‘Ball’ 레이어의 1 프레임을 선 택합니다. Library 패널의 ‘Symbol 1’ 무비클립 심 볼을 스테이지로 드래그

모션 적용하기

심볼 인스턴스를 선택한 채 패널 Dock에서 Motion Preset 패널 단추를 눌러 Motion Preset 패널을 표시하고 공이 튀어 오르는 모션인

‘bounce-out-3D’를 선택하고 <Apply> 버튼을 클릭

(10)

스타워즈 엔딩 크레딧처럼 스크롤 문자 만들기

: Text Scroll :

070

타이포그라피 디자인하기

① Tools 패널에서 선택 도구로 글상자를 선택하고 Properties 패널에서 Text Engine을 ‘Static Text’로지정

② Character 항 목 에 서 Family:Arial, Style:Reqular, Size:20pt로 설정합니다. Paragraph 항목에서 Format 을 ‘Align center’ 단추를 눌러 문장을 가운데 정렬

클릭 한 번에 모션 적용하기

① 패널 Dock에서 Motion Preset 패널 단추 누르고 ‘text-scroll- 3D’를 선택한 다음 <Apply> 버

② 문장을 3D로 변경해야 한다는튼 클릭 경고 메시지 창이 표시되면

<OK> 버튼을 클릭

(11)

필요한 부분만 나타내기

: Mask :

072

마스크 객체 이동하기

Timeline 패널에서 10프레임을 선택하고 자유 변형 도구를 이용하여 그림과 같이 원을 이동하 고 키를 누른 채 조절점을 드래그해서 크기를 변경

셰이프 트위닝 적용하기

Timeline 패널에서 ‘마스크’ 레이어의 1~45프레 임 사이를 드래그하여 그림과 같이 선택한 다 음 마우스 오른쪽 버튼을 클릭해서 Create Shape Tween을 실행

마스크 적용하기

‘Mask’ 레이어를 선택한 다음 마우스 오른쪽 버 튼을 클릭하여 Mask를 실행

(12)

애니메이션에 배경 음악 삽입하기

: Sync :

074

사운드 파일 삽입하기

스테이지에 배경 음악 파일을 불러오기 위해

〔File〕 → Import → Import to Library를 실행

Import to Library 대화상자가 표시되면 04 폴더 에서 ‘sound.wav’ 파일을 선택한 다음 <열기>

버튼을 클릭

(13)

버튼 심볼에 효과음 삽입하기

: Button Sound :

075

사운드 파일 불러오기

〔File〕 → Import → Import to Library를 실행하 고, 파일 불러오기

심볼 편집하기

① Tools 패널에서 사각형 도구를 선택한 다음 Stroke color를 ‘None’으로 설정

② 왼쪽 위 인스타그램 버튼에 드래그하여 사 각형그리기

③ Tools 패널에서 선택 도구를 선택한 다음 사각형을 선택하고 마우스 오른쪽 버튼을 클릭하여 Convert to Symbol 실행

④ Name:Btn01, Type:Button으로 지정한 다음

<OK> 버튼을 클릭

(14)

비디오 삽입하기

: Import Video :

077

비디오 파일 불러오기

비디오 파일을 불러오기 위해 〔File〕 → Import → Import Video를 실행

스킨 디자인하기

영상이 표시될 스킨을 지정하기 위해 Skinning 페이지의 Skin 항목을 ‘SkinOverAll.swf’로 지정 하여 스킨 디자인을 변경