1

FLASH 를 이용한 GAME 제작

컴퓨터 그래픽스 프로젝터발표자 : 우인호 배현진

2

목차 Game 제작에 필요한 기능설명

Text Field 설명액션스크립 설명

Game 제작과정 설명Ready 심볼 제작 과정 설명 (/5)심볼 배열 과정 (/2)

제작시 어려운 점 참고 자료

3

제작 Game 주요 구성요소 Text Field 이용한 GAME 상의 정보 표시 액션 스크립에서의 임으로 지정된 범위의

마우스 드래그 액션 애니메이션 심벌과 액션스크립의

상호작용 설정

4

Text Field 정의 FLASH4 에서의 새로 추가된 기능 무비가 재생 중에도 사용자의 텍스트

내용을 변경할 수 있다 . 변수 지정하여 서버응용 프로그램과

연동이 가능

제너레이터에서만 가능했던 무비 컨텐츠의 동적인 갱신 제공

5

Text Field Propertices

6

Text Field 속성창의 이해 Draw border and background

: Text 경계선을 보이지 않게 한다 . Password

: 텍스트 모양이 별표 모양으로 된다 . Mutiline

: 입력값에 Enter 값이 있으면 여러 개의 행을 갖을 수가 있다 .

Word wrap: Mutiline 항목을 적용시 자동 줄바꿈이 된다 .

7

Restrict text length to () characters: 텍스트의 입력 값을 제한 함 .

Disable editing: 텍스트 편집을 할 수 없도록 함 .

Disable selection: 텍스트를 선택 할 수 없도록 함 .

8

Do not include font outline: 설정한 폰트를 플래시 무비에 삽입하지

않는다 . Include all font outlines

: 사용자가 설정한 폰트대로 보이게 함 . Include only spcified font outlines

: 제한적인 옵션을 사용 대문자 , 소문자 , 숫자 , 구드점 , 사용자 정의

9

액션의 정의 웹 에니메이션 구현의 핵심 기능 강력한 인터랙티브 구현이 가능 버튼과 프레임의 액션 지정하여 다양한

인터랙티브한 동작을 제어 가능

사용자와 상호작용이라고도 불리우는 인터랙티브 정보 전달 수단

10

액션 기능설명 매개변수Go to 지정한 장면 또는

프래임으로 이동Scene, Number,Label, Expression,Next/Previous FrameGo to and play

play 프레임에서 재생 없음stop 프레임에서 재생을 정지 없음Toggie High Qually 안티알라싱 효과를 켜거나

끔없음

Stop and Sound 사운드의 재생중지 없음Get URL 지정한 URL 문서를 불러온다 .

URL, Window, Variable

Fs Command 외부로 신호를 보냄 Command, Arguments, For standalone player

Load/ unload movie 지정한 URL 의 무비나 변수값 불러옴

Action, URL, Location, Variable

Tell Target 타깃 심벌에 액션 신호를 보냄 Target 입력창에 무비 클립 심벌의 인스턴스 이름을 적음

If Frame is Loaded 프레임에 지정하는 조건문 액션 지정

Scene, Frame

On MouseEvent 마우스 이벤트를 지정하고그사이에 액션값을 지정

Press, Release, Release Outside, Roll Over, Roll Out, Drag Over, Drag Out, Key Press

11

Game 제작 과정구슬 , 막대기 , 바탕 심벌 제작

->구슬 , 막대기 , Ready 애니메이션 심벌 제작

->애니메이션 심벌 액션 값 삽입

->심벌 배열하기

->Export Movie 로 Swf 파일로 생성

12

제작 GAME 구성 구슬 애니메이션 심벌

Name : bbb -> Instance Name : ball 마우스 액션 애니메이션 심벌

Name : note -> Instance Name : mousetrack X 축 막대바 애니메이션 심벌

Name : xxx -> Instance Name : Vert Y 축 막대바 애니메이션 심벌

Name : yyy -> Instance Name : hor Ready 애니메이션 심벌

Name : ready -> Instance Name : Controller

13

Ready 애니메이션 심볼 점수와 구슬상태와 거의 모든 액션을 포함 변수 Score( 점수 ), Lives( 구슬 상태 ) 표시함 Score, Lives Text Field 지정

:Disable editing, Disable selection 설정 Include only specified font outlines 설정에서 Number 와 Character 설정 Character 설정에 ‘ -’ 를 적용

14

15

16

Ready 애니메이션 심볼 제작과정 (1/5)첫번째 프래임에 적용된 액션

Set Variable “xStep”=Random(5) + 6Set Variable “yStep”=Random(5) + 3Set Variable “xModifier”=Random(10)Set Variable “yModifier”=Random(10)If(xModifier>5)

Set Variable : “xStep”=xStep-(xStep*2)End If

If(yModifier>5)Set Variable : “yStep”=yStep-(yStep*2)End If

If (lives=0)Go to and step (22)End If

17

Step 값으로 구슬의 x,y 의 Data 값을 표현 Step 값의 변화를 주기 위하여 Modifier x,y 값

사용 및 Random 함수 사용 Lives 변수 값이 0 을 가르치면 게임 중단

구슬의 Data 값을 변수로 설정한 액션 값

18

Ready 애니메이션 심볼 제작과정 (2/5)스물번째 적용된 액션

Set Variable : “horX”=GetProperty(“/Mousetrack”,_x)Set Property (“/hor”, X Position)=Eval(“horX”)Set Variable : “vertY”=GetProperty(“/Mousetrack”,_y)If(vertY<310)

Set Property (“/vert”, Y Position)=Eval(“vertY”)Else

Set Property (“/vert”, Y Position)=310End If

Set Variable : “BallX”=GetProperty(“/Ball”,_x)Set Property (“/Ball”, X Position)=BallX + Int(xStep)Set Variable : “BallY”=GetProperty(“/Ball”,_y)Set Property (“/Ball”, Y Position)=BallY + Int(yStep)

19

마우스 애니메이션의 x(horX), y(vertY) 설정 구슬 애니메이션의 x(BallX+Int(xStep)), y(BallY+I

nt(yStep)) 설정

마우스 애니메이션 , 구슬 애니메이션 x 축 y 축 설정

20

Ready 애니메이션 심볼 제작과정 (3/5)

스물 한번째 적용된 액션Set Variable : “Lose” = 0Set Variable : “LeftContraint”=GetProperty(“/hor”,_x)-30Set Variable : “RightContraint”=LeftContrint + 120Set Variable : “UpperContraint”=GetProperty(“/vert”,_y)-30Set Variable : “LowerContraint”=UpperContraint+120Set Variable : “yAccel”=vertY-Getproperty(“/mousetrack”,_y)Set Variable : “xAccel”=horX-Getproperty(“/mousetrack”,_x)If(Getproperty(“/Ball”,_y)>350 OR Getproperty(“Ball”,_y)<50)

If((Getproperty(“/Ball”,_x)>LeftContraint) AND (GetProperty(“/Ball”,_x)<RightContraint)) Set Variable : “yStep”=yStep – (yStep*2) Set Variable : “xStep”=Int(xStep – (0.15*xAccel)) Set Variable : “Score”=Score+100 Begin Tell Target (“/Sounds”) Go to and Play (“Horizontal”) End Tell TargetElse Set Variable : “Lose”=1End If

End If

21

Ready 애니메이션 심볼 제작과정 (4/5)If(Get Property(“/Ball”,_x)>350 OR Get property(“/Ball”,_x) <50)

If((Get Property(“/Ball”,_y)>UpperContraint) AND (GetProperty(“/Ball”,_y)<LowerContraint)) Set Variable: “xStep”=xStep-(xStep*2) Set Variable: “yStep”=Int(yStep-(0.15*yAccel)) Set Variable: “Score”=Score+100 Begin Tell Target (“/Sounds”)

Go to and Play (“Vertical”) End tell Target

Else Set Variable: “Lose”=1

End IfEnd If

If (Lose=0)Go to and Play (20)

22

Ready 애니메이션 심볼 제작과정 (5/5)Else

Set Property (“/Ball”, X Position)=200Set Property (“/Ball”, Y Position)=200Set Variable: “Lives”=Lives-1Set Variable: “Score”=Score-500Go to and Play (1)Begin Tell Target (“/Sounds”)

Go to and Play(“Lose”)End Tell Target

End If

23

상하 좌우 제한 값을 설정 구슬의 y 축이 50~350 이고 좌우 제한 값에 포함 되지 않을 때 구슬 변화 Data 제공 구슬의 x 축이 50~350 이고 상하 제한 값에 포함 되지 않을 때 구슬 변화 Data 제공 그 이외에 값에서 구슬의 변화 Data 제공

구슬의 x,y 축의 제한 값과 이외의 값에 반응을 나타낸 액션 값

24

심볼 배열 과정 (1/2) 바탕심벌을 중앙에 배열함 X,Y 축 애니메이션 심벌을 각각 배열함 X,Y 축 Instance Name 을 vert,hor 로 설정 막대 레이어에 다음 액션 값을 설정한다 .

구슬을 가운데에 배열한다 . Instance Name 을 mousetrack 으로 설정한다 . 구슬 레이어에 다음 액션 값을 설정한다 .

Set Variable: “/Controller:Lives”=“5”Set Variable: “/Controller:Score”=“0”

Fs Command(“allowscale”,”false”)

25

FS Command: 외부의 프로그램으로 신호를 보내는 액션이다 . Command 와 Argument등 두 가지 설정 상항이 있다 . Command 에서 전달한 명령문을 입력하고 , Argument 에서 참조할 독립변수를 입력한다 .

Command Argument 기능Fullscreen true/false true 설정하면 무비가 풀스크린으로 재생

Allowscale true/false true 설정하면 스케일이 조정 가능ShowMenu true/false true 설정하면 마우스 오른쪽으로 메뉴를 불러 올 수가 있다 .Exec 실행파일 이름 외부의 응용 프로그램을 실행Quit 없음 프로젝터를 종료한다 .

26

심볼 배열 과정 (2/2) 마우스 이벤트를 위한 애니메이션 심벌을

구슬 심벌 가운데에 위치 시킨다 . Instance Name 을 mousetrack 라고 입력 마우스 이벤트 레이어에 다음 액션 값을 설정

Ready 애니메이션 심벌을 다른 심벌과 겹치지 않게 위치시키다 .

Instance Name 을 Controller 라고 입력 막대기 , 그림자 , 구슬 , ready, 바탕순으로 배열한다 .

Set Property(“/mousetrack”,Visibility)=“0”Start Drag(“/mousetrack”, L=80, T=80, R=320,B=320 lockcenter)

27

Start Drag(“/mousetrack”, L=80, T=80, R=320,B=320 lockcenter)

마우스 드래그 액션 값“/mousetrack” 는 operation taget 값 L=80, T=80, R=320,B=320 은 이동 범위

lockcenter 은 마우스를 중앙에 고정시키는 옵션

28

29

제작시 어려웠던 점 변수 값에서 Literal 과 Expression 옵션의 차이 각 심벌에서 나왔던 새로운 함수 사용 구슬의 이동경로 예상 구슬의 위치에 따른 Data 값의 변화 계산

30

참고 문헌따라해보세요 Flash4 – ㈜한컴프레스 Flash 액션스크립트 바이블 – ㈜성인당 http://myhome.netsgo.com/proda/ http://www.easyflash.tv/ http://www.bestflash.com/