flappy bird 만들기 세미나 자료
Post on 18-Jan-2015
1.023 Views
Preview:
DESCRIPTION
TRANSCRIPT
Flappy Bird 만들기창원대학교 정보통신공학과
!김대호 & 박동규
http://ivis.cwnu.ac.kr/tc/dongupak/
Flappy Bird 란?
• 베트남의 Dong Nguyen이 만든 iOS, 안드로이드용 모바일 게임
• 중독성이 강하고 아주 단순한 점프액션게임의 한 종류
Flappy Bird 란?
• 관련 동영상
• http://www.youtube.com/watch?v=fQoJZuBwrkU
• http://www.youtube.com/watch?v=sf2nFL9Z3v0
• http://www.youtube.com/watch?v=UZXWp83gtog
순서• 배경화면 만들기
• FlappyBrid 와 Cactus 만들기
• 충돌반응(GameManager)
• 소리효과
• GUI(점수)
• Intro,GameOver Scene
리소스 받기• 유니티 Project 만들기
• FlappyBird라는 이름의 프로젝트를 만들자
•
• 홈페이지에 올려 놓은 Resource 파일을 받아 Project 창에 Import한다
• 리소스에는 게임 텍스쳐. 사운드, 애니메이션, iTween이라는 Tweening script가 있다.
http://ivis.cwnu.ac.kr/tc/dongupak/245
리소스 받기
Drag & Drop
배경화면 만들기
Hierarchy 창에서 Plane을 두 개 생성 후 각각의 이름을
bgBack, bgGround로 이름 변경
배경화면 만들기
리소스 파일의 Assets/Textures/ForLoop에서 bg_2파일을 bgBack에, Ground 파일을
bgGround에 각각 맵핑을 합니다
Position: 위치 Rotation:회전각 Scale:크기
Transparent/Diffuse:하얀색으로 덮힌부분을 처리해줌
Tilling: 축의 방향으로 이미지의 갯수를 생성 Offset:축의 방향으로 위치를 잡아 해당 지점의 위
치부터 보여줌
배경화면 만들기
리소스 파일의 Assets/Textures/ForLoop에서 bg_2파일을 BG_back에 Ground 파일을
BG_ground에 각각 맵핑을 합니다
배경화면 만들기
Directional Light를 추가시켜 밝게 보이도록 합니다.
배경화면 만들기
Orthographic: 원근감이 없는 환경 Size: 카메라의 크기 숫자가 작을 경우 시선이 좁아
진다
결과
배경화면 만들기(ScrollMove)
Project 창에 Folder를 생성후 Script폴더를 만듬
배경화면 만들기(ScrollMove)
Project 창에 Create-> C# Script 생성
*ScrollMove.cs
//targetOffset 은 시간에 따라 속력을 곱하므로 시간에 따라
Offset 값이 바뀜
ScrollMove.cs를 bgBack,bgGround 오브젝트에 연결시켜줌
배경화면 만들기(ScrollMove)
bgBack은 0.1 bgGround는 3
의 속력을 각각 넣는다
결과
뒷배경과 앞배경이 원근을 가지고 움직이는 것을 볼 수있다.
선인장 만들기GameObject -> Create Empty로 Hierarchy에 GameObject를 생성
Project창에 Sprite폴더의 cactus 파일을 GameObject의 하위객체로 총 3개를 넣는다
선인장 만들기GameObject의 이름을 CACTUS로 바꾸고 위아래 Cactus를 2개
중간이 Goal를 1개 생성한다
Cactus 객체는 게임상에서 충돌을 피해야할 장애물이며 Goal은 통과해야할 객체이다
선인장 만들기
Goal 의 Sprite Renderer 체크 해제하여 게임창에 이미지가 보이지않도록한다.
Position을 설정하고 난 후 게임화면에 나타나는 Cactus와 Goal의 모습, Goal은 게임객체로는 존재하나 화면에는
보이지 않는다
선인장 만들기(CactusMove)
//선인장 장애물의 속도
//왼쪽으로 속도값 만큼 움직임
//y축은 랜덤값을 주어서 높낮이가 랜덤으로 생성됨
오브젝트포지션이(x축) -6을 넘어설때 객체는 사라짐
OnEnable() : Start() 함수보다 먼저 선언되는 메서드 객체를 초기화 시켜주는 메서드
선인장 만들기(CactusMove)
연결시킴
선인장 만들기(Prefab)
Script로 연결된 CACTUS를 Project Prefab 폴더를 생성하여 이동시키면 자동으로 프리팹이 만들어짐
프리팹이란? 게임 오브젝트의 생성과 관리를 수월하게 해주는 일종의 설계도면
Flappy Bird 만들기GameObject->GameEmpty를 통해
빈 오브젝트를 만들고 이름을 BIRD 로 지정
Sprite폴더에 bird_A_01을 BIRD 의 하위객체로 지정후
이름을 Bird로 함
Flappy Bird 만들기
새의 크기를 맞게 설정함
Inspector창에 Add Component에서 Animator(철자 주의)를 추가시킴
Bird의 오브젝트 설정
Flappy Bird 만들기
Animation폴더의 Bird 애니메이션을 Animator에 집어넣음
결과
…………
Flappy Bird(Bird.cs)
//점프 파워
//새 이미지
// 마우스를 클릭했을 경우 점프가 발동
// Awake 함수는 스크립트 객체의 라이프타임 동안 단 한번만 호출 게임이 시작 할 때 객체를 초기화 시키는
기능
// 새가 점프했을 경우 새의 LookDirection을 변화시켜 Y축으로 회전시켜주는 기능
Flappy Bird(Bird.cs)
Bird.cs 스크립트를 Bird에 입힌 후
Flappy Bird(Bird.cs)
Bird는 Bird 스크립트의 ImageBird 객체와 연결시킵니다.
Flappy Bird(Bird.cs)
BIRD에 rigidbody 컴포넌트를 추가시킨다.
충돌반응(GameManager.cs)
빈 GameObject 생성하고 이름을 MANAGER 이라 만듦
새 스크립트를 생성하여 GameManager.cs를 만듦
MANAGER 객체는 게임의 상태관리를 위하여 사용할 것이다.
GameManager?
• 게임의 전반적인 동작을 로직하고 관리하는 게임구동의 핵심적인 역할
• 게임의 준비, 종료, 시작을 모두 처리함.
• 게임이 준비상태인지, 게임중인지, 종료되었는지를 체크하는 상태변수를 이용하여 각 상태에 따른 화면의 제어와 객체의 제어를 수행한다
충돌반응(GameManager.cs)
//장애물 오브젝트
//InvokeRepeating : 메소드를 일정 시간마다 호출시켜주는 함수
ready 변수를 쓰는이유?? 메소드 호출의 중복을 막기위한 코드 또한 차후 게임 진행요소에 기여함
ready 변수는 차후 게임이 종료되었는가를 구분하는 변수로 쓰이게 됩니다.
충돌반응(Tag 설정)
Cactus를 클릭 후 Inspector -> Add Tag를 하여 Tag를 추가시킴
Tag?
충돌반응(Tag 설정)중간부분인 Goal과
위아래 Cactus 두가지를 생성
Cactus 두 개는 Cactus로 Goal은 Goal로 태그지정
충돌반응(Collider 입히기)
CACTUS 하위객체를 모두 선택한후 Box Collider를 입힘
충돌반응(Collider 입히기)
Is Trigger는 ON으로 설정하고 Box Collider Size Z 값을 10 으로 변경
설정을 다한 CACTUS를 prefab으로 다시 맵핑
충돌반응(Collider 입히기)
충돌반응(Collider 입히기)
맵핑 된 CACTUS를 GameManager Cactus에 연결시켜준다
중간결과
충돌반응(Collider 입히기)
BIRD 객체를 클릭한후, Add Component의 Sphere Collider를 생성한다
Is Trigger는 OFF Radius는 0.35로 맞춰준다
충돌반응(Collider 입히기)
BG_ground는 충돌반응을 인식하기위해 IsTrigger를
ON으로하고 태그를 Cactus로 한다
충돌반응(Collider 입히기)
바닥을 뚫리지 않기위해 bgBack에서
Box Collider를 입하고 is Trigger는 OFF로한다
충돌반응(OnTriggerEnter)
OnTriggerEnter() 메소드는 is Trigger가 On인 상태에서 충
돌을 감지함
Tag값이 Cactus이면 아래로 떨어지게 됨
*Bird.cs
OnTriggerEnter
• Is Trigger 가 On 되었을 시 충돌을 감지하는 메서드
충돌반응(게임시작,종료)
BIRD 객체에서 use Gravity를 비활성화 시킨다
-> 최초상태는 중력에 영향을 받지않아 떨어지지 않게 된다
충돌반응(게임시작,종료)
마우스 클릭이 발생하고 ready가 true일때 UseGravity가 활성화되어 게임이 시작된다
GameManger.cs
게임의 종료를 알려주는 변수
게임을 종료시키는 GameOver() 메서드에서는
MakcCactus 메서드의 Invoke를 중지시켜 더 이상 선인장이 화면에 나타나지 않게한다
충돌반응(게임시작,종료)
Game Play
Game Ready
Game End
ready = true end = false
ready = false end = false
ready = false end = true
충돌반응(게임시작,종료)
end가 false 일 경우만 점프가 가능하다.
Bird.cs
충돌반응(게임시작,종료)
Game Play
ready = false end = false
충돌반응(게임시작,종료)
Cactus와 충돌되었을 때 GameManager의 GameOver() 메서드를 호출한다.
호출
Bird.cs GameManager.cs
Game Play
Game End
ready = false end = false
ready = false end = true
충돌반응(iTween)
• 유니티에서 제공하는 스크립트
• 애니메이션 이나 오브젝트의 움직임을 관리해준다.
충돌반응(iTween)
iTween.cs를 Script폴더에 넣는다.
GameManager.cs에 GameOver() 메소드에서 iTween의 메서드를 호출한다.
실행 후 게임이 종료되면 화면이 흔들리는 것을 알 수 있다.
충돌반응(iTween)
충돌효과를 내기 위해 x,y 축으로 0.2만큼 0.5초의 짧은 시간에 카메라를 흔든다.
최종결과
버튼이 누르면 게임이 시작되며 충돌반응이 일어났을 때 게임이 종료되고
화면이 흔들리며 Flappy Bird가 움직이지 않고 있습니다.
ㅜㅜ
소리효과(Jump Sound)
BIRD를 클릭 후 Add Component에 Audio Source를 추가시킴
소리효과(Jump Sound)
Audio Source 영역의 Audio Clip에 Sounds 폴더의 Jump 파일을 넣음
소리효과(Jump Sound)
이 한줄이면 끝
소리효과(Death, Goal)
Bird.csGameManager.cs
소리효과(Death, Goal)
MANAGER 에서 Audio Source 를 추가
소리효과(Death, Goal)
Death Sound Goal Sound에 각각 소리를 집어넣음
GUI(점수)
Score에서 Add Component를 눌러서 Text Mesh를 추가시킴
GameObject를 생성하여 이름을 Score로 바꿈 하위객체로 지정
GameObject를 생성하여 이름을 GUI로 바꿈
GUI(점수)
설정에 맞게 조정함
slkrcre글꼴을 넣어줌
결과
GUI(GameManager.cs)
//Goal 지점을 통과했을때 점수가 1점 플러스됨
GUI(점수)
MANAGER의 GameManager에 Score_text에 Score를 연결시킴
Intro SceneSprite 폴더에 있는 ready와 ready_image를
각각 GUI의 하위객체로 만듬
이름을 각각 GetReady,
ReadyTap으로 바꿈
Intro Scene
Game스크린상에서 잘보이도록 객체의 Transform을 잘 설정해준다.
Intro Scene
GameManger.cs에서 시작전의 이미지를 사라지게 하게 만들어주는 코드이다
GameManager.cs
Alpha 값을 0으로하여 0.5초만에 사라지게 된다.
Intro Scene
각각의 이미지를 연결시켜준다
Intro Scene이제 버튼을 누르면 서 이미지가 사라지고 게임이 시작된다.
GameOver Scene
GameOver 스프라이트를 GUI의 하위객체로 설정한다
GameOver Scene
GameOver객체를 GetReady 뒤에 설치하고 알파값을 1로하여 투명하게 만들어준다
GameOver Scene
GameManager.cs에서 GameOver_Image를 만든후 iTween 메서드가 alpha값을
1에서 255로 바꿔준다
GameManager.cs
GameOver Scene
GameOver_Image를 GameOver Sprite 와 연결해준다.
결과
ㅠㅠ
점수관리
1.빈 오브젝트를 생성후 FinalWindow라 하고 Finish_Window 하위객체로 생성 이름은
FinishWindow로 함
점수관리
2.Score텍스트를 두번 복사하여 각각 BestScore,FinalScore로 만든후 하위객체로 생성
3.Transform 지정
점수관리Final_Window(상위)
Final_Window(하위) BestScore FinalScore
결과
Scene창에서 Game화면상 밑에 설치를해준다
점수관리
게임이 종료되었을시 iTween을이용한 이동시키는(MoveTo) 기능을 호출한다.
점수관리
MANAGER 스크립트에 연결시켜준다
리플레이
PlayButton 스프라이트를 Final_Window의 하위객체로
생성시킨다
리플레이
PlayButton 의 Inspector창에 Add Component에서
Box Collider를 입혀 충돌을 반응하게한다
리플레이
Project창에서 스크립트를 하나 생성하고 파일이름을 ResetScene으로 하여 위의 코드를
입력한다
ResetScene.cs
점수관리
PlayButton에 ResetScene 스크립트를 입힌다
점수관리
new 스프라이트를 FinalWindow 하위객체로 생성하고
이름을 ImageNew로 한다 그리고 BEST 글자 옆에 위치시키도록한다
점수관리
GameManager.cs 영역에 아래의 코드를 입힌다.
점수관리현재 Score가 BestScore일 시
ImageNew를 Active 시키고 아니면 Active 시키지 않는다.
결과
감사합니다.
top related