|
 |
1. 나비 효과 만들기
플래시 모션을 이용하여 날개를 펄럭이는 나비 효과를 만들어 보겠습니다. |
|
|
|
(1) 플래시 CS3를 실행합니다. 사용자의 컴퓨터에 따라 환경설정이 다를 수 있으니 플래시 CS3 환경을 맞춰 보겠습니다. New Document에서 새 문서를 만듭니다. |
 |
|
(2) 속성창의 'Size 항목에서 '문서 속성' 버튼을 클릭합니다. |
 |
|
(3) 'Document Properties' 대화상자가 나타납니다. 각각의 항목을 다음과 같이 설정한 후 'OK' 버튼을 클릭합니다. |
 |
|
(4) 나비 이미지를 그립니다. 이미지는 다른 이미지로 대체하거나 간단하게 그려도 무방합니다. |
 |
(5) 나비이미지 그리기가 완성된 후 각각의 날개를 선택하고 F8을 클릭하면 Convert to Symbol 창이 뜹니다.
심벌네임을 '날개위'라고 적은 후 Type에서 Graphic을 선택하고 Registration은 좌측 상단을 선택합니다. 선택을 모두 하였으면 'OK' 버튼을 클릭합니다. 날개 아래도 심벌네임을
'날개아래'라고 적은 후 같은 방법으로 Graphic Symbol로 만듭니다. |
 |
(6) 이번에는 나비날개 위 부분만 무비클립 심벌로 한 번 더 만들도록 하겠습니다.
'날개위'라는 그래픽 심벌을 선택하여 단축키 [F8]을 누르면 Convert to Symbol 창이 뜹니다. 심벌네임을 '날개위모션'이라고 입력하고 Type에서 'MovieClip'을 선택, Registration
은 '좌측 상단'을 선택하고 'OK' 버튼을 클릭합니다. |
 |
(7) 위와 같이 하였으면 '날개위모션'이라는 무비클립 안에 '날개위'라는 그래픽 심벌이 생성되었을 것입니다.
이젠 날개모션을 만들어 보겠습니다. '날개위모션'이라고 만든 무비클립 심벌을 더블클릭합니다. '날개위모션' 무비클립 심벌 안으로 들어가면 Layer1이라는 레이어가 있습니다.
15프레임을 클릭한 후 단축키 [F6]을 눌러 키프레임을 만듭니다. |
 |
|
(8) 15프레임에 있는 '날개위' 그래픽 심벌을 선택하면 'Properties' 창에 'Color' 탭이 생성됩니다. 'Brightness'를 선택하고 값을 '-50'으로 설정합니다. |
 |
(9) 한 번 더 15프레임에서 '날개위'라는 그래픽 심벌을 선택한 후 Tool에서 'Free Transform Tool'을 선택하면 아래와 같이 점 9개가 나옵니다. 'Alt' 키를 누른 상태에서 좌측상단
점을 오른쪽으로 이동시킵니다. |
 |
|
(10) 아래 이미지만큼 너비를 줄입니다. |
 |
|
(11) Layer1에서 16프레임을 선택한 후 단축키 [F6]을 눌러 15프레임에 있던 프레임을 복사합니다. 17프레임 역시 단축키 [F6]을 눌러 앞에 있는 프레임을 복사합니다.
|
 |
|
(12) 이번에는 Layer1에서 30번째 프레임을 선택한 후 단축키 [F7]을 눌러 빈 프레임을 만듭니다. |
 |
|
(13) 1프레임을 선택한 후 마우스 오른쪽 버튼을 눌러 'Copy Frames'을 선택합니다. |
 |
|
(14) 다시 Layer1에서 30프레임을 선택한 후 마우스 오른쪽 버튼을 클릭하여 'Paste Frame'을 선택합니다. 1프레임에 있던 그래픽 심벌이 30프레임으로 복사되었습니다. |
 |
(15) 각각의 프레임에 모션트위닝을 적용시키도록 하겠습니다.
- 각각의 키프레임 사이에 마우스 오른쪽 버튼을 클릭한 후 'Create Motion Tween'을 선택합니다. |
 |
(16) 오니온 스킨 상태로 확인한 모습입니다. 날개가 접히는 모습이 연속으로 보이는 것을 알 수 있습니다.
* 오니온 스킨이란?
모션과 모션 사이의 연속 동작을 보여주는 것입니다. 레이어의 아래 부분에 오니온 스킨을 설정할 수 있는 아이콘이 있습니다. 오니온 스킨을 설정하면 모션의 중간 단계를 화면에서
확인할 수 있습니다. |
 |
|
 |
|
 |
(17) 날개 아래 부분도 모션을 넣어 보겠습니다. '날개위'와 같이 움직여야하므로 '날개위'를 복제하여 변경하는 방법으로 설정하겠습니다.
우선 '날개위' 모션에서 scene1을 클릭합니다. |
 |
|
(18) scene1에서 '날개아래' 그래픽 심벌은 삭제합니다. '날개위모션' 무비클릭을 선택하고 제자리에 붙여넣기 합니다. 위치는 '날개위모션' 아래에 오도록 합니다. |
 |
|
(19) 복사한 '날개위모션'을 선택한 후 마우스 오른쪽 버튼을 클릭하여 'Duplicate MoviClip'을 선택, 복제합니다. |
 |
|
(20) 복제 무비 심벌 이름은 '날개아래모션'으로 정하겠습니다. |
 |
|
(21) 복제한 무비 '날개아래모션'을 더블클릭하여 무비클립 안으로 들어갑니다. '날개위' 그래픽 심벌을 선택한 후 Properties에서 'Swap' 버튼을 클릭합니다. |
 |
|
(22) 'Swap' 버튼을 클릭하면 'Swap Symbol'이라는 창이 뜹니다. 현재 '날개위'에 선택되어 있는 것을 '날개아래' 그래픽 심벌로 선택한 후 'OK' 버튼을 클릭합니다. |
 |
|
(23) '날개위' 그래픽 심벌이 '날개아래' 그래픽 심벌로 바뀌었습니다. 15, 16, 17, 30 프레임에 있는 '날개위' 그래픽 심벌도 같은 방법으로 '날개아래' 그래픽 심벌로 바꿉니다. |
 |
|
(24) 오니온 스킨 상태에서 본 모습입니다. 아래쪽 날개가 접히는 모습을 볼 수 있습니다. |
 |
|
(25) 이제 Scene1을 클릭하여 장면을 이동합니다. |
 |
|
(26) '날개위모션' 무비클립을 복사하여 제자리에 붙인 후에 오른쪽으로 이동시킵니다. |
 |
|
(27) 복사한 '날개위모션' 무비클립을 선택한 후 메뉴에서 Modify → Transform → Flip Horizontal을 클릭하여 반전시킵니다. |
 |
|
(28) 아래와 같이 '날개위모션' 무비클립 심벌이 반전되었습니다. 적당한 위치로 이동시킵니다. |
 |
(29) '날개아래모션'도 위와 같은 방법으로 복사 → 제자리에 붙여넣기 → 오른쪽으로 이동시키기 → 복사한 '날개아래모션'을 선택하여 (Modify→Transform→Flip Horizontal)
반전시키기 → 적당한 위치로 이동시키기를 합니다. |
 |
|
(30) '날개위' 두 개를 선택하여 마우스 오른쪽 클릭 → Arrange → Bring to Front를 선택하여 배열의 위치를 맨 위로 보냅니다. '날개위'와 '날개아래'의 위치 값을 정확히 맞춥니다. |
 |
|
(31) 이젠 Scene1에 있는 모든 오브젝트를 선택한 뒤 단축키 [F8]을 눌러 '나비모션'이라는 무비클립을 만듭니다. |
 |
(32) '나비모션' 무비클립 심벌을 선택한 후 좌측에 있는 Transform에서 'Constrain'은 38%, Rotate는 30.8도로 지정합니다. Transform 탭이 없을 경우
메뉴 → Window → Transform을 체크하면 됩니다. |
 |
|
(33) 배경을 넣어 보도록 하겠습니다. 새 레이어를 만듭니다. |
 |
|
(34) Layer2가 생성되면 맨 아래로 레이어를 이동시킵니다. 레이어의 이동은 해당 레이어를 클릭한 상태에서 원하는 위치로 이동하면 됩니다. |
 |
|
(35) 배경 이미지를 불러옵니다. File → Import → Import to Stage를 선택합니다. |
 |
|
(36) 불러올 이미지를 선택합니다. |
 |
|
(37) 다음과 같이 바탕화면에 배경이 삽입되었습니다. |
 |
|
(38) 텍스트 삽입하기
|
| 이제 텍스트를 삽입해 보겠습니다. Tool에서 |
 |
Text Tool(단축키 [T]) 버튼을 선택합니다. |
|
| (39) 폰트는 Georgia, 사이즈는 30, Bold, Anti-aliasfor animation, 색상 #FFFFFF로 설정한 뒤 'Butterfly'라고 입력합니다. |
 |
(40) 'Butterfly' 아래 부분을 마우스로 선택한 후, 폰트 Tahoma, 사이즈 10, Bold, 자간 1.5. 색상 #FFFFFF, Anti-alis for animaion으로 설정하고 'ASAFLASH MOTIVE'라고
적습니다. |
 |
|
(43) 이젠 Ctrl+Enter 을 눌러 미리보기를 하겠습니다. 아래 그림과 같이 날개모션이 있는 나비효과를 보실 수 있습니다. |
 |
나비 효과 만들기 
