메뉴 건너뛰기

XE : Xpress Engine




웹디자인 강의

기타 질문하기:http://www.funcafe.co.kr

프로모션따라하면 애니메이터처럼한다

4회 - 달리는 애니메이션 만들기

- 이번강좌에서는 프로모션을 이용해서 달리는 케릭터(?)를 애니메이션해보도록하겠습니다.

1. 프로모션에서 file->new sceen/animation..을 선택합니다

    그리고나서 이미지사이즈를 정하고 프레임수는 1로 합니다.

2. 전경색을 흰색으로 정하고 뒷배경에 페인트툴로 색을 입힙니다.

3. 키프레임이 되는 이미지중 시작키프레임을 그립니다.

4. 이제 하단에 위치한 control panel에서

+ 를 눌러 프레임을 추가시킵니다.또는 키보드의 ctrl키와 insert키를 동시에 눌러줍니다.

그럼 하단 프레임정보에 보면 2프레임이 생기고 현재 2프레임인 것을 볼 수 있습니다.

5. 2프레임은 마지막 애니메이션이 끝나는 마지막키프레임으로 합니다. 마지막키프레임의

동작에 맞게 프레임의 이미지를 수정합니다.

6.그럼이제 애니메이션의 시작키프레임과 마지막 키프레임을 그렸습니다.

이제 중간 사이에 들어가는 애니메이션 동(動)화를 만들기위해서 전의 강좌2회에서

했던 방법대로 라이트박스기능을 이용해보겠습니다.

우선 프레임위치를 1프레임으로 이동하고나서 프레임을 추가합니다.(ctrl+insert키)

그리고나서 현재 프레임2에 있는 이미지를 브러쉬툴이나 박스툴을 이용해서

배경색으로 칠해 없앱니다.

키보드의 ctrl+alt+L키를 누릅니다

Lighttable 설정을 아래와같이 layer:1 은 frame : -1 , brightness:80 transparnet color:배경색

으로 합니다.

이제다시 layer바를 오른쪽으로 하나이동하여서  layer:2로 갑니다.

layer:2는 frame:1  brightness:40 transparnet color:배경색 으로합니다.

그럼 아래그림과 같이 1프레임과 3프레임(키프레임)이 비춰집니다.

그럼 이제 키프레임(원화)를 토대로 중간의 동작을 완성합니다.

이제 다시 1프레임과 2프레임사이의 그림을 그리기위해 우선 1~2프레임사이에 프레임을 추가합니다.

그럼 전에 만들었던 2프레임은 3프레임으로 이동하고 생긴 프레임2번의 이미지를 지우고

위의 방법과 같이 라이트박스를 이용해서 1~3프레임사이의 그림을 토대로 중간그림을 그립니다.

이런식으로 중간에중간에 프레임을 추가해가면서 사이사이 그림을 그려줍니다.

그렇게 해서 5프레임의 애니메이션을 완성합니다.

중간그림을 그려가면서 아래와같이 총 5프레임의 달리는 애니메이션을 완성합니다.

위의 프레임제작순서를 보면 먼저 1키프레임그리고->5키프레임그리고->프레임추가하고->3중간프레임그리고->프레임추가

->2프레임그리고->3~5프레임사이에 들어갈 4프레임추가시킨후->4프레임그린다.

그리고나서 L키를 눌러서 라이트테이블을 없애준뒤

각프레임사이의 value값(시간)을 정해준뒤 키보드의 숫자 4키 를 눌러서 테스트해본다.

그럼 이제 plugin->export->gif89ae선택후 옵션을 체크해주고(옵션은 이전강좌를 참고)

저장한다

그럼 아래와같은 달리는 애니메이션을 볼 수가 있습니다.

 

번호 제목 글쓴이 날짜 조회 수
공지 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] Eccen 2004.12.15 48026
42 PNG 파일의 포맷에 대하여 알려드릴께요. [21] ZipShin 2002.11.27 6659
41 이미지의 저장 GIF 인가 JPG(JPEG)인가? [15] ZipShin 2002.11.25 7496
40 이쁜(?) 텍스트 만들기 [8] file w:)style 2002.11.03 5308
39 [그림판강좌2탄] 벅스뮤직 메뉴바 따라해보기. [12] file 바른생활NZEO 2002.10.29 7526
38 본메뉴에 마우스오버스시 서브메뉴 나타나기(허접강좌ㅡㅡ;;) [5] 박은석 2002.09.18 9232
37 형용사적인 색의 연상. [9] Neople 2002.09.14 3783
36 단일색의 연상. [8] Neople 2002.09.13 3534
35 하이링고님의 말씀에 대한 공식적인 사과문 [4] 김광욱 2002.09.11 14621
34 나두 컬러 팁 하나....^^ [6] 유현우 2002.09.06 3976
33 칼라 팁? ㅡㅡa [17] 날수없는하늘 2002.09.05 4560
32 제원이가 하는 SWiSH 첫강좌! -iMBC 쇼코너 따라하기- [7] file w:)style 2002.09.01 4706
» [프로모션]제4회 달리는 애니메이션 만들기 [13] 정현석 2002.08.27 646
30 [기타] 포토샵을 이용한 윈앰프3 스킨 만들기. [11] file 엔카일 2002.08.27 5192
29 [프로모션]백그라운드칼라 투명값주기 [4] 정현석 2002.08.27 4615
28 [프로모션]애니메이터의작업처럼 라이트박스기능활용 [3] 정현석 2002.08.27 3070
27 [프로모션]프로모션 따라하면 애니메이터처럼한다 1회 프로모션의 설치/인터페이스 [2] 정현석 2002.08.27 3206
26 일러스트와 벡타 3d를 이용해 회전 문자 만들기~ㅎ_ㅎ [3] file Click 2002.08.20 3187
25 색배합도 하고 원하는 배경 이미지도 만들자;!(외국 사이트 소개) [12] 김현경 2002.08.10 6421
24 [하이링고] 꼭 함 읽어주셨음 해요!! 심란한 링고.. [39] 하이링고 2002.08.04 4541
23 [아이콘 셋] 퀄리티 높은 아이콘 셋입니다. [3] file jury 2002.07.16 8112