엽기토끼 죽이기 팀명 : 청순가련.

Presentation on theme: "엽기토끼 죽이기 팀명 : 청순가련."— Presentation transcript:

1 엽기토끼 죽이기 팀명 : 청순가련

2 주제 : 액션스크립트를 이용한 플래시 애니메이션 목표 : 플래시의 프레임과 모션을 이용해 캐릭터의 자연스런 동작을 표
현한다. 목적 : 플래시 외의 프로그램을 이용한 이미지(혹은 소리)를 플래시로 불러들여, 적극 활용(캐릭터, 배경, 소리)하고, 액션스크립트 기능의 Go To, Stop, 무비클립을 사용하여 보다 완성도 높은 애니메이션을 만든다. 소개 : 단순히 움직이기만 하는 애니메이션이 아니라, 액션스크립트 기능을 이용해 상호 인터페이스가 가능한 애니메이션을 만들것입니다 그리고 2차원에서만 머무는 애니메이션이 아닌, 배경에 3차원을 써서, 2차원과 3차원의 조화로 이루어진 애니메이션을 만들어 볼 계획입니다.

3 구성 스토리보드 소리 배경 캐릭터 애니메이션

4 스토리보드

5 3D MAX로 작업 *나무 : 3D MAX의 front화면에서 Creat-shapes-line과 circl을
그려준 후, line을 선택해서 gomoetry의 compound objects에서 loft를 선택하고, get shape으로 circle를 선택해서 나무 기둥의 모양을 만들어 줍니다.

6 그리고 modify안의 loft defomations내의 scale에서 자연스럽게 모양을 만들어 줍니다.
(나뭇가지도 같은 방법으로 만들어서 위치를 잡아줍니다.)

7 잎부분은 sphere를 여러 개 모아놓아 모양을 만들어 주었다
완성이미지

8 바닥(땅)의 경우는 plane을 만든 후, length segs와 width segs를 각각 80으로 면의 개수를 많이 만든 후, modify에서 noise를 적용시켜 주었다.
완성이미지

9 : 나뭇잎을 uvw map(spherical)적용 후, 매핑을 해준다.
원형의 모습에서 벗어난 경우는, 매핑이 이루어지지 않기 때문에 uvw map (인위적으로 매핑 좌표 설정)을 해준 후, 매핑을 해주어야 합니다.

10 Diffuse-bitmap에서 (tilling 가로 세로 각각 3으로 준 뒤) 나무와 땅에 각각 어울리는 이미지를 적용시켜 준다.

11 배경으로 하늘을 넣어주기 위해 Render-Environment에서 구름 이미지를 적용시켜 준다
배경으로 하늘을 넣어주기 위해 Render-Environment에서 구름 이미지를 적용시켜 준다. (Environment Map-use map체크)

12 다음으로, 조명은 lights에서 omni를 선택해, 전체적으로 환하게 비치게만 해준다.
카메라는, target을 선택한 후, 원하는 그림이 나오게 위치를 잡아준다.

13 마지막으로, Rendering에서 Render를 클릭해, 원하는 이미지를 bitmap형식으로 저장한다.

14 포토샵 3D에서 만들어준 이미지가 너무 강렬하므로, 포토샵에서 수정해 주었다.
포토샵에서 이미지를 연 후, curves와 Brightness/contrast에서 명암과 채도를 수정해 배경으로 사용하기 적합하도록 해주었다.

15 illustrator 일러스트에서 pen tool을 사용하여 Mashimaro 를 그렸고 음영은 그라데이션을 이용하였으며 일러스트에선 잘 사용하지 않는 레이어를 적극 활용하였다.

16 일러스트에서 Layer 를 잘 사용하지 않는것으로 되어 있지만 Layer를 이용함으로써 수정이 편리하였고 플래시에서 동작을 표현하려면 팔, 다리,몸…등이 따로 분리되어 있어야 하므로 조금의 번거로움을 피할 수 있었다

17 GOLD WAVE 깎어! 그것도 못해! 죽어! 소리를 GOLD WAVE를 이용해서, 직접 녹음해 넣어준다.
우선 프로그램을 연 후, 화면상단의 NEW 버튼을 클릭하면 NEW SOUND대화상자가 나온다. 예쁜 목소리를 위해 RADIO음질을 선택하고, 채널은 스테레오로 잡는다. 그리고 OK를 누른다.

18 그리고 녹음을 시작한다. Ctrl + 빨간버튼을 누르면, 녹음이 시작된다
그리고 녹음을 시작한다. Ctrl + 빨간버튼을 누르면, 녹음이 시작된다. 녹음을 끝낸후, 우측 상단의 ZOOM아이콘 중 SEL이라고 쓰여진, ZOOM SELECTION을 눌러서 확대한다.

19 그러면 침묵이 있는 부분이 보인다. 그 부분을 제외한 소리가 시작되는 부분에서 마우스 왼쪽 버튼을 눌러주고, 소리가 끝나는 부분에서 마우스 오른쪽 버튼을 눌러준다. 그러면 소리가 있는 부분만 선택이 된다.

20 다음으로 잡음을 제거해 주기위해, EFFECTS메뉴의 FILTER-NOISE REDUCTION을 누르면 대화상자가 나타난다
다음으로 잡음을 제거해 주기위해, EFFECTS메뉴의 FILTER-NOISE REDUCTION을 누르면 대화상자가 나타난다. OK를 눌러주면 잡음이 제거된다.

21 다음으로 소리를 가공해 주기 위해, EFFECTS메뉴의 DOPPLER을 누르면, 현재 음성의 속도가 1

22 마지막으로 CUT아이콘을 눌러주면, 필요한 부분만 남는다
마지막으로 CUT아이콘을 눌러주면, 필요한 부분만 남는다. 그러면 상단의 PNEW아이콘을 누르면, 필요한 파형만 존재하는 창이 뜬다. 이것을 SAVE로 저장하면 된다.

23 Flash 엽기토끼 죽이기 로딩 화면이 나온 후 제목과 함께 엽기토끼가 나온다.
로딩 화면이 나온 후 제목과 함께 엽기토끼가 나온다. 메인 화면과 모든 서브메뉴를 하나의 SWF로 만들면 용량면에서 부담이 큽니다. 때문에 메인 화면 부분만 하나의 SWF 로 만들고 서브 메뉴들은 각각의 SWF 로 만들어서 사용자가 메인 화면에 있는 메뉴 버튼은 누를 때 서브내용이 로드 되도록 할 경우에 사용 엽기토끼 죽이기

24 로딩은 속성을 무비클립으로 만든다 로딩의 정도는 글자의 색이 빨간색으로 변함으로써 보여준다.

25 프레임 액션에서 Basic Action 의 If Frame Loaded로 준다.
그리고 GO TO 액션을 이용해 다음 프레임으로 넘어가게 해준다.

26 일러스트에서 작업한 그림을 플래시로 불러들인다. ( File Import )
[ 유의해야 할 것 ] 보통 같은 벡터형식의 파일이고 호환이 되므로 일러스트파일을 불러오는데 가끔 일러스트파일이 불러들여와 지지 않을 때가 있다. 그럴 경우에는 일러스트의 버전을 지정하여 저장가능 하므로 낮춰서 저장하면 불러들여와 지는 수가 있다. 이때 버전은 ( 6.0버전) 으로 저장한다.

27 Library에 그래픽으로 모든 그림 (마시마로, 사과, 칼…)을 저장한다

28 Library 에 그래픽으로 저장하는데 움직이는 동작을 만들어야 하므로 몸과 움직여야 하는 부분들 팔, 다리, 꼬리를 각각 따로 저장한다.
( 무비가 상영되는데 용량에 의해 break 현상이 많이 좌우되므로)

29 [ 사과 ] Guide line을 이용하여 날아오게 만든다. Orient to path direction 항목을 체크 – 사과가 날아올 때 라인을 따라 회전하며 날아오게 된다.

30 [ 무비 클립 ] 애니메이션을 자체적으로 포함할 수 있는 심볼로 메인 타임라인으로부터 완전히 독립적으로 작동된다.그리고 무비내의 도형은 심볼로 만든다. 무비심볼 클립을 만든다. 그리고 무비클립은 아래와 같은 모양으로 표기됩니다.

31 무비심볼 편집모드로 전환한다. ( Ctrl+E 키 이용)
Library 에서 저장해 둔 그래픽을 불러온다. 이것을 Key frame을 이용하여 손, 칼, 사과를 조금씩 움직여서 자연스러운 움직임을 만든다.

32 [ 사운드 삽입 ] 타임라인에 애니메이션이 설정되어 있을 때 애니메이션의 특정지점에서 사운드가 재생되도록 하려면 그 시점에 key frame을 삽입 후에 사운드를 삽입하면 된다. 골드웨이브로 녹음한 “ 그것도 못해! 죽어!” 삽입과 배경음악으로 깔리는 “빵 빵 빠…” MP3 효과음을 삽입한다.

33 [ 버튼 ] 버튼은 어느 특정한 무비를 제어, 재생하거나 화면의 전환시와 같이 여러 용도로 이용된다. 버튼심볼 클립을 만든다. 그리고 버튼클립은 아래와 같은 모양으로 표기됩니다.

34 [ 버튼에 사운드 삽입 ] 사용자가 버튼을 조작할 때 사운드가 재생되도록 하려면 버튼 심볼의 심볼 편집모드에서 원하는 key frame 에 삽입하면 된다 ( over에 기계음16 삽입)

35 [ 버튼 ] 상황을 대표하는 소품을 이용하여 4개의 버튼을 만든다.

36 Basic Action의 Go To Action 을 적용한다.
버튼을 선택하면 각각에 상황에 맞는 scene 으로 이동해서 바로 Play되도록 되어 있다. 각각의 상황을 scene 으로 나누어서 만들었다.

37 이동한 각 scene에 Back버튼을 추가하여 전 장면으로 이동하게 하여 반복해서 볼 수 있도록 있게 했다.
그리고 각 scene 에서의 애니메이션은 앞과 동일하게 무비클립(key frame)을 이용해서 움직임을 만든 후에 사용하였다.

38 작품후기 삽입 그림 wordart에서 위의 목차로 이용 클립아트, 그림파일이용 (배경그림 .eps파일)
슬라이드쇼 애니메이션 사용자 정의(텍스트 애니메이션) 을 이용하여 글자에 움직임을 첨가 쇼 설정은 발표자가 진행으로 설정 (한 슬라이드의 소요시간은 정확히 측정할 수 없으므로) 키보드 Print Scrn SysRq 을 이용하여 화면을 캡쳐해옴

39 문제점 마시마로를 일러스트에서 그려서 플래시로 가져갔는데
플래시에서 열리지가 않아서 모두 다 버전을 6.0버전으로 낮춰서 저장하여 다시 불러 들여서 사용하였다. 그런데 플래시에서 그림들이 깨져 있어서 수정을 하였지만 완벽하게 되지 않았다. (일러스트를 처음부터 잘못 그린 것이 아니다) 가장 큰 문제는 우리가 프리젠테이션의 개념을 잘 몰랐던 것에 있다. 우리는 첨으로 Power Point를 하기위해 책을 뒤지며 만들었는데 잘 만들지는 못해지만 하는 동안 새로웠고 재미 있었다.