개발단에 가입하여 베르의 게임 개발 유튜브를 후원해주세요! https://www.youtube.com/channel/UC9j37A2ACL9ooSbsT4mtGww/join

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다!

이번에는 유니티 씬 뷰 조작법에 대해서 알아보겠습니다.

 

사용 엔진 버전 : 2021.3

 

타임라인

0:00 인트로

0:16 준비

0:33 씬 기즈모

1:03 씬에서의 이동 방법

2:45 아웃트로

 

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

이번 영상에서는 유니티의 게임 오브젝트와 컴포넌트에 대해서 알아보도록 하겠습니다.

게임 오브젝트

게임 오브젝트는 유니티 엔진에서 가장 중요한 개념이며, 씬에 배치되는 가장 기본 단위의 오브젝트입니다.

한마디로, 캐릭터나 바닥에 떨어진 아이템, 배경으로 배치된 건물이나 소품, 폭발하면서 발생하는 이펙트, 빛을 밝히는 광원, 모든 장면을 찍는 카메라까지 씬 안에 배치되는 모든 것은 게임 오브젝트입니다.

그리고 이 게임 오브젝트에 어떤 컴포넌트가 추가되느냐에 따라서 게임 속에서 그 게임 오브젝트의 역할이 결정되는 구조입니다.

한마디로 게임 오브젝트는 기능을 구현하는 컴포넌트들을 담는 하나의 컨테이너 역할을 하는 것입니다.

게임 오브젝트는 기본적으로 이름, 태그, 레이어를 가지고 있는데 이것을 이용해서 나중에 원하는 오브젝트를 찾는 등의 처리를 할 수 있습니다.

컴포넌트

컴포넌트는 게임 오브젝트에 붙일 수 있는 다양한 기능을 가진 구성요소입니다.

앞서 이야기했듯이 비어있는 게임 오브젝트에 어떤 컴포넌트를 붙이느냐에 따라서 그 게임 오브젝트의 역할이 달라집니다.

간단한 예시를 들기 위해서 빈 게임 오브젝트를 하나 만들어 보겠습니다.

하이어라키 뷰에 우클릭 한 뒤 Create Empty 메뉴를 선택합니다. 이것은 비어있는 게임 오브젝트를 만든다는 의미입니다.

새로 생성된 게임 오브젝트를 보면 트랜스폼 컴포넌트가 붙어있는 것을 볼 수 있습니다.

비어있는 게임 오브젝트를 만들겠다고 했는데 왜 트랜스폼 컴포넌트가 붙어있는지 의문이 들 수도 있습니다.

유니티 엔진에서 트랜스폼 컴포넌트는 모든 게임 오브젝트에 기본 컴포넌트로 반드시 부착되어 있도록 되어 있으며 게임 오브젝트로부터 제거할 수 없게 되어 있습니다.

트랜스폼 컴포넌트는 이 게임 오브젝트가 씬의 어느 위치에 어떻게 회전되어서 어떤 크기로 배치되어 있는지를 결정합니다.

그럼 게임 오브젝트에 컴포넌트를 추가하는 방법을 배우기 위해서 방금 만든 빈 게임 오브젝트에 카메라 컴포넌트를 부착해서 새로운 카메라로 만들어보겠습니다.

컴포넌트를 추가할 게임 오브젝트를 선택하고 인스펙터창에서 Add Component 버튼을 누르면 게임 오브젝트에 추가할 수 있는 컴포넌트들의 목록이 보입니다.

이 중에서 게임 오브젝트에 추가할 컴포넌트를 찾아서 선택하면 됩니다.

하지만 이 상태로는 카메라 컴포넌트를 빠르게 찾기 어렵기 때문에, 검색창에 camera를 검색하여 선택합니다.

그러면 비어있던 게임 오브젝트 자리에 카메라 모양이 생기며 게임 오브젝트가 카메라가 된 것을 확인할 수 있습니다.

이렇게 유니티에서 제공하는 기본적인 컴포넌트 외에도 개발자가 직접 컴포넌트를 만들어서 게임 오브젝트에 붙일 수도 있습니다.

대부분의 실제 게임 기능을 하는 시스템들은 이런 커스텀 컴포넌트로 만들어지고 게임 오브젝트에 추가됩니다.

커스텀 컴포넌트를 만드는 방법은 프로젝트 뷰에서 우클릭한 뒤 Create > C# Script 항목을 선택하는 것입니다.

그러면 New BehaviourScript라는 이름으로 C# 스크립트 파일이 생성됩니다.

이렇게 만든 컴포넌트는 보통 용도에 맞게 이름을 지어줍니다.

커스텀 기능이 만들어지는 예시를 위해서 만든 스크립트를 더블 클릭해서 스크립트 에디터를 엽니다.

그리고 업데이트 함수에서 스페이스 바를 누르면 간단한 로그를 출력하도록 코드를 작성하겠습니다.

코드를 저장하고 에디터로 돌아갑니다.

이렇게 생성한 컴포넌트를 다른 컴포넌트와 마찬가지로, 게임 오브젝트를 선택하고, Add Component 버튼을 누른 뒤, 추가할 컴포넌트의 이름을 검색해서 게임 오브젝트에 붙일 수 있습니다.

그리고 게임을 플레이하고 스페이스 바를 누르면 작성한 코드대로 로그가 출력됩니다.

이런 간단한 예시를 확장해서 앞으로 여러분들이 게임에 필요한 기능들을 만들어 나가는 방식으로 개발을 하게 되는 겁니다.

아웃트로

이번 영상에서는 유니티의 게임 오브젝트와 컴포넌트에 대해서 알아보았습니다.

이 강좌는 시청자 여러분들의 시청과 후원으로 제작되었습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

 

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형

개발단에 가입하여 베르의 게임 개발 유튜브를 후원해주세요! 

 

베르의 게임 개발 유튜브

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다! 게임 개발에 도움이 되는 강좌들을 올리는 채널입니다! [투네이션 후원] https://toon.at/donate/637735212761460238 [유니티 어필리에이트

www.youtube.com

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다!

이번에는 앞에서 만든 와이어 수리 임무 UI를 게임과 직접 연결해봅시다.

 

사용 엔진 버전 : 2019.4

 

타임라인

0:00 인트로

0:12 초기화 기능 추가

0:32 닫힘 기능 만들기

1:44 임무 오브젝트 배치와 UI 연결

6:23 아웃트로

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

지난 시간까지는 와이어 수리하기 임무의 기본 구성을 만들었으니 이제 이 기능을 본격적으로 게임과 연결해보겠습니다.

초기화 기능 추가

먼저 게임에서 임무창이 꺼졌다가 켜졌을 때 내용이 다시 초기화되는 기능을 만들어야 합니다.

FixWiringTask 스크립트를 열겠습니다.

그리고 OnEnable 함수에서 LeftWires 리스트에 들어있는 왼쪽 와이어들을 대상으로 연결을 초기화하는 코드를 작성합니다.

닫힘 기능 만들기

그 다음으로는 임무를 완료하거나 도중에 그만 뒀을 때 UI가 닫히도록 만들 차례입니다.

Open 함수와 Close 함수를 만들어줍니다.

이 Open 함수에서는 임무 UI를 켜는 것은 물론 도중에 캐릭터가 움직이지 않도록 IsMoveable을 false로 바꾸는 작업도 해야합니다.

Close 함수는 Open 함수와 반대로 동작하도록 만들면 됩니다.

그 다음에는 CheckCompleteTask 함수를 만들고 와이어를 검사해서 모든 와이어가 연결된 상태에서만 UI가 닫히도록 코드를 작성합니다.

그리고 이 함수는 Update 함수에서 오른쪽 와이어와 연결되고 끊어지는 순간마다 검사하도록 만들어줍니다.

코드를 모두 작성한 다음에는 저장하고 에디터로 잠시 돌아갑니다.

에디터에서는 Task UI 오브젝트 아래에 이미지를 하나 추가하고 화면 전체를 덮게 만들어 줍니다.

그리고 거기에 Button 컴포넌트를 붙이고 Transition을 None으로 바꾼 뒤 OnClick 이벤트에 FixWiring의 Close 함수를 등록해줍니다.

임무 배치하기

이제 임무를 실행하기 위한 오브젝트를 배치할 차례입니다.

먼저 맵이 잘 보이도록 만들기 위해 하이어라키 뷰에서 캔버스와 라이트맵 오브젝트를 꺼줍니다.

그리고 맵 리소스에서 관리실의 전선함 이미지를 찾아서 관리실 복도에 배치해주고 머티리얼을 M_Highlight로 변경해줍니다.

그 다음엔 배치한 스프라이트를 복제해서 원본의 자식 컴포넌트로 만들고 크기를 살짝 키운 뒤 Order in Layer를 원본 스프라이트보다 뒤로 가도록 설정해줍니다.

그리고 스프라이트 렌더러의 머티리얼에 전에 만든 M_Outline 머티리얼을 할당해줍니다.

BoxCollider2D 컴포넌트도 붙여주고 Is Trigger를 체크한 뒤 복도를 적당히 커버하도록 콜라이더의 크기와 위치를 수정합니다.

그리고 Sprite Renderer 컴포넌트를 비활성화 시켜줍니다.

이제 이 콜라이더에 캐릭터가 닿았을 때 색을 변경하도록 기능을 만들어야 하는데, 이전에 만든 OutlineObject 스크립트를 조금 확장하도록 하겠습니다.

OutlineObject 스크립트를 찾아서 열어줍니다.

스크립트가 열리고 나면 SpriteRenderer 변수의 지정자를 protected로 변경해줍니다.

그리고 OnTriggerEnter2D, OnTriggerExit2D 이벤트 함수들 역시 protected로 지정자를 변경하고 virtual 키워드를 붙여줍니다.

그 다음에는 잠시 에디터로 돌아가서 MissionOutlineObject라는 이름으로 새 스크립트를 생성합니다.

스크립트 생성이 완료된 다음에는 클래스의 상속을 MonoBehaviour에서 OutlineObject로 바꿔줍니다.

실제 기능은 나중에 구현하도록 하고 저장하고 에디터로 돌아가서 앞에서 만든 아웃라인 오브젝트에 컴포넌트를 붙여줍니다.

그 다음에는 FixWiringTaskObject 스크립트를 생성하고 스크립트 에디터를 엽니다.

이 스크립트에서는 먼저 Sprite 타입의 UseButtonSprite와 SpriteRenderer 타입의 SpriteRenderer 변수를 선언해줍니다.

그리고 Start 함수에서는 GetComponent 함수로 게임오브젝트에 부착된 SpriteRenderer를 가져오고 가져온 SpriteRenderer로부터 머티리얼을 인스턴싱하도록 코드를 작성해줍니다.

그 다음에는 OnTriggerEnter2D와 OnTriggerExit2D 이벤트 함수를 만들어줍니다.

이 두 함수에서는 IngameCharacterMover의 접근을 감지해서 머티리얼의 _Highlighted 값을 바꾸도록 해줍니다.

그 다음에는 IngameUIManager로 이동합니다.

그리고 스크립트의 상단에 UnityEngine.UI 네임스페이스와 UnityEngine.Events 네임스페이스를 using 선언해줍니다.

그리고 멤버 변수로 Button 타입의 useButton과 Sprite 타입의 originUseButtonSprite를 선언해줍니다.

그 다음에는 SetUseButton 함수를 만들고 useButton의 sprite를 교체한 뒤 버튼에 이벤트를 등록해줍니다.

이어서 UnsetUseButton 함수를 만들고 useButtone을 원상태로 돌리는 코드를 작성해줍니다.

이 함수들을 작성하고 난 다음에는 FixWiringTaskObject 스크립트로 이동해서 OnTriggerEnter2D와 OnTriggerExit2D 함수에서 호출하도록 만들어 줍니다.

<재녹음>이때 버튼 이벤트에 등록할 OnClickUse 함수를 만들어두겠습니다.

그리고 IngameUIManager 스크립트으로 이동해서 fixWiringTask 변수를 만들어서 캐싱이 가능하게 만들어줍니다.

다시 FixWiringTaskObject 스크립트로 돌아가서 OnClickUse 함수에서 FixWiringTask UI를 열도록 코드를 작성합니다.

코드를 모두 작성한 다음에는 저장하고 에디터로 돌아갑니다.

에디터로 돌아온 다음에는 앞에서 맵에 배치해둔 전선함 스프라이트 오브젝트에 콜라이더를 배치하고 위치를 잡아준 뒤 Is Trigger 체크해줍니다.

그리고 FixWiringTaskObject 컴포넌트를 붙이고 스프라이트 프로퍼티에 Use 버튼 스프라이트를 넣어줍니다.

그 다음에는 IngameUIManager 컴포넌트에 비어있는 프로퍼티들을 채워줍니다.

작업을 모두 마친 다음에는 게임을 빌드하고 실행해서 테스트합니다.

테스트를 진행해보면 전선함 근처에 다가가면 오브젝트가 강조되고 Use 버튼이 활성화됩니다.

그리고 버튼을 누르면 와이어 연결 임무 UI가 뜨고 전선을 모두 알맞게 연결하면 UI가 꺼지는 모습을 볼 수 있습니다.

아웃트로

이번 영상에서는 맵에 전선함 오브젝트를 만들고 앞에서 만든 와이어 연결 임무 UI와 연결해보았습니다.

이 강좌는 시청자 여러분들의 시청과 후원으로 제작되었습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형

개발단에 가입하여 베르의 게임 개발 유튜브를 후원해주세요! 

 

베르의 게임 개발 유튜브

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다! 게임 개발에 도움이 되는 강좌들을 올리는 채널입니다! [투네이션 후원] https://toon.at/donate/637735212761460238 [유니티 어필리에이트

www.youtube.com

 

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다!

이번에는 유니티 에디터의 레이아웃에 대해서 알아봅시다.

 

사용 엔진 버전 : 2020.3

 

타임라인

0:00 인트로

0:09 유니티 에디터 레이아웃

0:26 씬 뷰

1:09 하이어라키 뷰

1:50 프로젝트 뷰

2:39 인스펙터 뷰

3:03 게임 뷰

3:34 콘솔 뷰

3:53 그 외

4:09 레이아웃 변경

4:46 레이아웃 저장

5:39 아웃트로

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

이번 영상에서는 유니티 에디터의 기본 레이아웃에 대해서 알아보겠습니다.

유니티 에디터 레이아웃

우선 유니티 에디터의 기본 레이아웃을 살펴보기 위해 유니티 엔진을 실행하겠습니다.

처음 실행했을 때 유니티 에디터의 레이아웃은 이렇게 되어 있을 것입니다.

유니티 에디터 화면 안에 있는 각 패널들을 유니티에서는 보통 뷰라고 부릅니다.

그럼 이 뷰들에 대해서 알아보도록 하겠습니다.

씬 뷰

제일 먼저 살펴볼 부분은 씬 뷰 입니다.

씬 뷰가 무엇을 하는 뷰인지 알기 위해서는 씬이라는 개념에 대해서 먼저 알아야 하지만 그렇게 어려운 개념은 아닙니다.

유니티에서 씬이라는 것은 쉽게 말해서 게임에서의 맵이나 레벨에 해당합니다.

즉, 씬 뷰는 게임 맵, 혹은 레벨을 보여주는 뷰입니다.

이 씬 뷰를 통해서 게임 레벨에 소품이나 건물 등의 배경 오브젝트들을 배치할 수 있습니다.

간단한 예를 보여드리자면 씬 뷰를 통해서 레벨에 이렇게 오브젝트를 배치하고 움직이거나, 회전시키고, 크기를 조절할 수 있습니다.

그리고 간단한 키보드 마우스 조작으로 씬 내부를 돌아다니면서 씬의 상태를 확인할 수도 있습니다.

하이어라키 뷰

그 다음은 씬 뷰의 왼쪽에 있는 하이어라키 뷰입니다.

하이어라키 뷰는 지금 로드되어 있는 씬과 그 씬에 배치되어 있는 오브젝트들을 계층구조로 보여주는 뷰입니다.

하이어라키 뷰에서는 가장 상단에 SampleScene이라는 이름으로 현재 열려 있는 씬의 이름이 표시되고, 그 아래에 씬에 들어있는 오브젝트들이 나타납니다.

하이어라키 뷰를 통해서 지금 씬에는 Main Camera라는 이름의 카메라와 Directional Light라는 이름의 조명, 좀 전에 배치한 큐브 오브젝트가 배치되어 있는 것을 볼 수 있습니다.

씬에 배치되어 오브젝트가 많거나 오브젝트가 넓게 배치되어 있어서 씬 뷰에서 원하는 오브젝트를 바로 찾기 어려울 때는 이 하이어라키 뷰에서 빠르게 찾아서 그 오브젝트로 이동할 수 있습니다.

프로젝트 뷰

하단에는 프로젝트 뷰가 있습니다.

프로젝트 뷰는 현재 프로젝트에 포함된 텍스처나 모델링, 스크립트, 씬 등의 애셋을 보여주는 뷰입니다.

개발 경험이 많지 않은 경우에는 프로젝트 뷰에 애셋들이 추가되는 대로 중구난방으로 쌓아두는 일이 많습니다.

그렇게 되면 나중에 원하는 에셋을 바로 찾기가 어려운 경우가 생깁니다.

그래서 에셋들을 잘 분류해서 정리해두는 버릇을 들이는게 중요한데 저 같은 경우에는 보통 폴더를 분류 별로 나누는 편입니다.

그래서 제일 자주 쓰이는 씬 폴더를 00_으로 번호를 붙이고, 스크립트 폴더에 01_로 번호를 붙입니다.

그 외의 폴더는 보통 생기는 순서대로 번호를 붙입니다.

이런 식으로 평소에 에셋을 잘 정리해두시면 나중에 필요한 애셋을 찾거나 불필요한 애셋을 정리할 때, 큰 도움이 되며 개발 속도에 긍정적인 영향을 미칩니다.

인스펙터 뷰

가장 오른쪽에 있는 뷰는 인스펙터 뷰입니다.

아마 눈썰미가 좋은 분이라면, 앞에서 다른 뷰를 설명하면서 오브젝트를 선택할 때마다, 인스펙터 뷰의 내용이 바뀌는 것을 얼핏 보셨을 겁니다.

이 인스펙터 뷰는 씬에 배치된 오브젝트를 하이어라키 뷰에서 선택하거나 프로젝트에 포함된 애셋을 프로젝트 뷰에서 선택하면 선택된 오브젝트나 애셋의 정보를 보여주는 역할을 합니다.

게임 뷰

그 다음은 씬 뷰 뒤에 겹쳐져 있는 게임 뷰입니다.

게임 뷰는 씬 뷰처럼 씬을 보여주는 역할을 하지만, 씬 뷰에서는 개발자가 씬 내부를 이리저리 움직이면서 살펴보고 게임 오브젝트를 선택하거나 여러 작업을 할 수 있었던 것과 달리, 씬 안에 배치된 카메라가 보여주는 것만을 볼 수 있는 뷰입니다.

즉, 실제 게임 화면을 미리 보여주는 역할을 하는 것이 게임 뷰입니다.

그리고 이렇게 겹쳐진 씬 뷰와 게임 뷰에서 알 수 있듯이 유니티 에디터의 레이아웃에서는 한 위치에 여러 개의 뷰가 겹쳐질 수도 있습니다.

콘솔 뷰

그 다음은 프로젝트 뷰 뒤에 숨어있는 콘솔 뷰입니다.

콘솔 뷰는 개발자가 기능 테스트를 위해서 출력시킨 로그나, 개발 도중에 발생한 에러, 경고가 출력되는 창입니다.

게임을 개발할 때는 기능이 원하는 대로 잘 동작하는지 확인해야 하는 경우가 많아서 로그를 자주 띄워보기 때문에 콘솔 뷰는 항상 잘 보이는 위치에 두는 것이 좋습니다.

그 외

이 외에도 에디터 상단 메뉴 바에서 Window 메뉴를 선택하여 드롭다운 메뉴를 펼치면 숨겨져 있는 뷰의 목록을 보고 필요한 뷰를 열어서 사용할 수도 있습니다.

유니티의 뷰에 대해서 대략적인 설명을 모두 드렸습니다.

레이아웃 변경

그럼 이제 유니티 에디터의 레이아웃을 바꾸는 방법을 알아봅시다.

유니티 에디터의 레이아웃은 이렇게 뷰의 탭을 잡고 드래그하면 에디터에서 완전히 떼어내거나 다른 곳에 배치할 수 있어서 언제든지 사용자가 사용하기 편한 방식으로 수정할 수 있습니다.

자 그럼 저를 따라서 레이아웃을 한 번 수정해보도록 하겠습니다.

먼저 프로젝트 뷰를 하이어라키 뷰 아래로 옮기고 콘솔 뷰를 씬 뷰 아래로 옮깁니다.

그리고 게임 뷰와 씬 뷰를 동시에 보고 싶기 때문에 씬 뷰를 떼서 게임 뷰 옆으로 옮깁니다.

그 다음에는 각 레이아웃의 크기를 적절하게 수정해줍니다.

레이아웃 저장

이렇게 수정한 레이아웃은 저장해두고 언제든 다시 불러올 수 있습니다.

에디터 우측 상단 제일 구석에 있는 Layout 버튼을 클릭합니다.

이 버튼을 클릭하면 저장된 레이아웃을 불러오거나, 새로 만든 레이아웃을 저장할 수 있습니다.

Save Layout... 버튼을 클릭하면 수정한 레이아웃의 이름을 지어줄 수 있는 대화상자가 뜹니다.

제가 배치한 레이아웃은 좌측부터 게임 뷰, 씬 뷰, 콘솔 뷰가 한 묶음으로 묶여있고, 그다음에 하이어라키 뷰와 프로젝트 뷰, 마지막으로 인스펙터 뷰가 나열되어 있습니다.

각 뷰들이 3-2-1 방식으로 배치되어 있으니 이 레이아웃의 이름은 countdown이라고 하겠습니다.

레이아웃을 저장하고나면 Layout으로 되어 있던 버튼 이름이 Countdown으로 바뀌어 있으며 추가한 Countdown 레이아웃이 드롭다운 목록에 추가되어 있는 것을 확인할 수 있습니다.

이렇게 레이아웃을 저장해두면, 나중에 레이아웃이 바뀌어도 언제든지 손쉽게 자주 사용하는 레이아웃으로 돌아올 수 있습니다.

아웃트로

이번 영상에서는 유니티 에디터의 레이아웃에 대해서 알아보았습니다.

이 강좌는 시청자 여러분들의 시청과 후원으로 제작되었습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형

에셋스토어의 상반기 빅세일! 스프링세일을 맞아 유니티 유튜버 베르님과 함께 몇가지 에셋을 함께 살펴봅니다. 방송에서 소개드릴 에셋은 아래와 같습니다.

 

👇 Show More 클릭! 👇

1. Fluffy Grooming Tool​

2. Destructible 2D

3. AAA Projectiles Vol.2

4. RT-Voice PRO

5. KWS Water System (Standard Rendering)

6. Pure Nature

7. Amplify Impostors

8. Weather Maker - Volumetric Clouds and Weather System for Unity

9. Space Graphics Toolkit​

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형

 

개발단에 가입하여 베르의 게임 개발 유튜브를 후원해주세요! 

 

베르의 게임 개발 유튜브

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다! 게임 개발에 도움이 되는 강좌들을 올리는 채널입니다! [투네이션 후원] https://toon.at/donate/637735212761460238 [유니티 어필리에이트

www.youtube.com

 

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다!

지난 블랙 프라이데이 세일에 이어서 이번 스프링 세일 라이브커머스도 진행을 맡게 되었습니다!

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형

개발단에 가입하여 베르의 게임 개발 유튜브를 후원해주세요! 

 

베르의 게임 개발 유튜브

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다! 게임 개발에 도움이 되는 강좌들을 올리는 채널입니다! [투네이션 후원] https://toon.at/donate/637735212761460238 [유니티 어필리에이트

www.youtube.com

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다! 이번에도 임무를 계속해서 만들어봅시다.

 

사용 엔진 버전 : 2019.4

 

타임라인

0:00 인트로

0:08 오른쪽 전선 배치

0:41 RightWire 클래스 생성과 연결 기능 구현

2:23 기능분리

5:05 아웃트로

 

[예제]

https://drive.google.com/file/d/1EsCSDsd5Ekt4eehA9WhIyWT0QTsVzw0N/view?usp=sharing

 

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

지난 영상에 이어서 임무를 계속해서 만들어보겠습니다.

오른쪽 전선 배치

이번에는 끌어온 왼쪽 전선이 연결될 오른쪽 전선을 만들 차례입니다.

Left Wire를 복사해서 크기를 -1로 변경한 다음 오른쪽으로 옮겨 줍니다.

그리고 오브젝트의 이름을 Right Wire로 바꿔준 뒤 Wire Body에 붙어있는 Left Wire 컴포넌트를 제거해줍니다.

참고로 하이어라키에서 Right Wire가 Left Wire보다 상단으로 가도록 배치해줘야 합니다.

RightWire 클래스 생성과 연결 기능 구현

그 다음에는 오른쪽 와이어에 붙을 클래스를 만들 차례입니다.

Right Wire라는 이름으로 C# 스크립트를 생성하고 스크립트 에디터를 엽니다.

그리고 LeftWire 스크립트로 이동합니다.

LeftWire 스크립트의 Update 함수에서 마우스 클릭을 떼는 부분을 찾아줍니다.

여기서 클릭을 떼는 순간에 RayCast를 발사하고 RightWire를 찾도록 만들어줍니다.

RightWire를 찾은 다음에는 LeftWire의 길이와 방향을 발견한 RightWire를 향하도록 만들어줍니다.

코드를 모두 작성한 다음에는 저장하고 에디터로 이동합니다.

에디터에서는 앞에서 배치해둔 Right Wire의 Wire Body에 RightWire 컴포넌트를 붙여줍니다.

그리고 게임을 플레이해서 테스트해보면 왼쪽의 와이어를 끌어서 오른쪽 와이어에 붙일 수 있는 것을 볼 수 있습니다.

잠시 플레이를 중단하고 오른쪽 와이어를 복사해서 아래 쪽으로 쭉 배치해줍니다.

그리고 다시 플레이하고 테스트 해보면 오른쪽 와이어 중에 하나를 골라서 마음대로 연결할 수 있는 모습을 볼 수 있습니다.

그럼 한 번 더 플레이를 중단하고 이번에는 왼쪽 와이어를 복사해서 배치해줍니다.

그리고 다시 플레이해서 테스트 해보겠습니다.

이번에는 제 의도와는 조금 다르게 왼쪽 와이어 중 하나만 선택해도 모든 와이어가 딸려나오는 모습을 볼 수 있습니다.

기능 분리

이제 LeftWire에 몰아 넣어둔 기능을 분리할 때가 왔습니다.

먼저 FixWiringTask라는 이름으로 C# 스크립트를 생성합니다.

사실 원래라면 여러 임무 클래스를 사용해야하기 때문에 BaseTask 클래스를 만들고 그 클래스를 상속받는 방식으로 구현하겠지만 지금은 강좌 진행 속도를 위해서 FixWiringTask 클래스에서 바로 구현하도록 하겠습니다.

스크립트 에디터로 이동해서 FixWiringTask 클래스의 멤버 변수로 List<LeftWire> 타입의 mLeftWires와 List<RightWire> 타입의 mRightWires를 선언해줍니다.

그리고 현재 선택된 와이어를 기억하기 위해서 LeftWire 타입으로 mSelectedWire도 선언해주겠습니다.

멤버 변수 선언이 끝난 다음에는 LeftWire 스크립트로 이동합니다.

이 Update 함수에 있는 코드를 FixWiringTask의 Update 함수로 옮겨줘야 합니다.

그전에 이 코드에 있는 기능 중에 LeftWire가 자체적으로 처리해야 하는 코드를 함수로 따로 빼겠습니다.

SetTarget 함수를 만들어주고 Update의 코드 중에 마우스 위치를 대상으로 와이어의 각도와 길이를 수정하는 코드를 붙여넣은 뒤 수정해줍니다.

그 다음에는 ResetTarget 함수를 만들고 와이어의 위치와 각도를 원상복구하는 코드를 옮겨줍니다.

함수를 모두 만든 다음에는 Update 함수의 각 부분의 코드를 함수로 대체해줍니다.

그리고 이렇게 완성된 코드를 잘라내서 FixWiringTask의 Update 함수로 옮겨줍니다.

그러면 당연하게도 에러가 발생할텐데 대부분은 mSelectedWire로 바꾸거나 추가해주면 됩니다.

코드를 모두 작성한 다음에는 저장하고 에디터로 이동합니다.

에디터로 돌아온 다음에는 와이어들의 부모 오브젝트에 방금 만든 FixWiringTask 컴포넌트를 붙여주고 각 와이어 리스트에 Wire Body들을 넣어줍니다.

모든 작업이 끝난 다음에 게임을 플레이해서 테스트해보면 왼쪽 와이어들이 한꺼번에 움직이지 않고 각자 따로 마우스로 끌어서 오른쪽 와이어에 붙여지는 모습을 확인할 수 있습니다.

아웃트로

이번 영상에서는 끊어진 전선을 연결하는 임무에서 왼쪽 와이어를 끌어서 오른쪽 와이어에 붙이는 기능을 만들어 보았습니다.

이 강좌는 시청자 여러분들의 시청과 후원으로 제작되었습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형
  1. 숲새 2022.03.06 22:28 신고

    안녕하세요 언리얼 관련해서 가끔식 보는 사람입니다
    저도 블로그를 해보려고 하는데
    코드블럭 스타일이 베르님처럼 언리얼에 맞는 코드블럭이 안보이더라구요
    혹시 어떤방식으로 하셨는지 여쭤봐도 될까요?

    • wergia 2022.03.16 13:02 신고

      저는 예전에 코드블럭 작업을 수동으로 했었습니다.

개발단에 가입하여 베르의 게임 개발 유튜브를 후원해주세요! 

 

베르의 게임 개발 유튜브

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다! 게임 개발에 도움이 되는 강좌들을 올리는 채널입니다! [투네이션 후원] https://toon.at/donate/637735212761460238 [유니티 어필리에이트

www.youtube.com

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다!

이번에는 어몽어스의 전선 고치기 임무를 만들어봅시다!

 

사용 엔진 버전 : 2019.4

 

리소스 : https://drive.google.com/file/d/1-QrHUpE40wdpZpNthEFHxo3Iw50-Ufi_/view?usp=sharing

 

타임라인

0:00 인트로

0:27 끊어진 전선 UI 배치하기

2:22 와이어 끌기 기능 구현

4:05 와이어 끌기 기능 테스트

4:27 아웃트로

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

이번에는 크루원들이 진행해야 하는 미션을 만들어보겠습니다.

물론 실제 게임에서는 맵 하나에 굉장히 많은 수의 미션이 있지만 모든 미션을 다 만들었다간 어몽어스 강좌가 앞으로 1년은 더 만들어야 할 것 같으니 하나의 미션과 미션 진행률에 집중하도록 하겠습니다.

본격적인 작업에 들어가기 전에 영상 하단의 링크에서 리소스를 다운로드 받아서 임포트합니다.

끊어진 전선 UI 배치하기

우리가 만들 임무는 끊어진 전선을 연결하는 임무입니다.

먼저 Task UI라는 이름으로 이미지를 배치하고 화면 전체를 덮도록 세팅한 다음 이미지를 투명하게 만들어 줍니다.

그리고 그 이미지 아래에 이미지를 하나 더 배치하고 전선 패널 이미지를 넣어줍니다.

그 다음에는 빈 게임 오브젝트를 만들고 그 아래에 전선 베이스와 맞는 전선끼리 연결되었을 때 불빛이 표시될 이미지를 하나씩 배치합니다.

그리고 Wire Base 아래에 같은 스프라이트를 사용해서 이미지를 하나 더 배치한 뒤 앵커를 middle right로 변경하고 Pivot X를 0으로 변경해줍니다.

그러면 이미지의 길이를 바꿔도 제 위치에서 늘어나게 됩니다.

그리고 Wire Body 아래에 잘린 전선 피복과 끊어진 구리선 이미지를 추가한 뒤 둘 모두 앵커를 middle right로 변경하고 Pivot X를 0으로 변경해줍니다.

그러면 마찬가지로 Wire Body의 길이가 변경되어도 끊어진 부분이 함께 움직이는 것을 볼 수 있습니다.

그 다음에는 끊어진 전선 구리 이미지 오브젝트에 Box Collider 2D 컴포넌트를 붙여준 뒤 콜라이더가 끊어진 전선 부분을 덮도록 만들어줍니다.

그리고 Tag에서 task-wire라는 이름으로 태그를 하나 만들어주고 이 태그를 적용해줍니다.

와이어 끌기 기능 구현

전체적인 UI 배치는 뒤로 넘겨두고 우선 와이어를 컨트롤 하는 기능부터 만들어보겠습니다.

먼저 LeftWire라는 이름으로 C# 스크립트를 생성하고 스크립트 에디터로 이동합니다.

스크립트 에디터가 열리고 나면 스크립트의 상단에 UnityEngine.UI 네임스페이스를 using 선언해줍니다.

그리고 RectTransform 타입으로 wireBody라는 멤버변수와 LeftWire 타입의 selectedWire 변수를 선언해줍니다.

그 다음에는 Update 함수로 가서 마우스 버튼을 누르는 순간에 RayCast를 쏴서 맞은 콜라이더의 부모에서 LeftWire를 찾아서 selectedWire로 설정해줍니다.

그리고 SelectedWire가 비어있지 않은 동안에는 오브젝트의 위치와 마우스 커서의 위치를 이용해서 전선이 움직일 각도와 거리를 계산하고 이것을 wireBody에 적용하도록 만들어줍니다.

마지막으로 마우스 클릭을 떼는 순간에 wireBody의 각도와 거리를 원상복구 시키고 selectedWire를 비워주도록 만들어줍니다.

추가로 게임 해상도가 달라질 때마다 변경되는 캔버스 크기 때문에 distance가 일치하지 않는 문제를 해결하기 위해서 캔버스의 크기를 가져와서 distance에 캔버스 크기의 역수를 곱해주는 코드를 추가합니다.

지금은 기능을 프로토타이핑하는 과정이니 모든 기능을 LeftWire에 추가한 상황이지만 다른 부분을 만들면서 이 기능들을 각자 맞는 위치로 이동시킬 예정입니다.

코드를 모두 작성한 다음에는 코드를 저장하고 에디터로 이동합니다.

와이어 끌기 기능 테스트

에디터로 이동한 다음에는 앞에서 만들어둔 Wire Body 오브젝트에 LeftWire 컴포넌트를 붙이고 WireBody 프로퍼티에 Wire Body 오브젝트를 할당해줍니다.

그 다음 게임을 플레이해서 테스트해보면 끊어진 전선 구리 부분을 클릭해서 드래그 하면 전선이 마우스를 따라서 움직이고 클릭을 떼는 순간 전선이 원래 자리로 돌아가는 모습을 볼 수 있습니다.

아웃트로

이번 영상에서는 어몽어스의 임무 중 하나인 끊어진 전선 수리하기 임무를 만들기 위해서 와이어를 끌어당기는 부분을 만들어보았습니다.

이 강좌는 시청자 여러분들의 시청과 후원으로 제작되었습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형

개발단에 가입하여 베르의 게임 개발 유튜브를 후원해주세요!

 

베르의 게임 개발 유튜브

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다! 게임 개발에 도움이 되는 강좌들을 올리는 채널입니다! [투네이션 후원] https://toon.at/donate/637735212761460238 [유니티 어필리에이트

www.youtube.com

 

안녕하세요! 여러분들과 함께 게임 개발을 공부하는 베르입니다!

이번에는 투표 후에 플레이어가 추방되는 연출과 기능을 만들어보겠습니다!

 

리소스 : https://drive.google.com/file/d/1aCeadnc5XUeTM0fwNUsFQvsu5lFv5C8r/view?usp=sharing

 

사용 엔진 버전 : 2019.4

 

타임라인

0:00 인트로

0:24 추방 UI 배치

1:27 추방 UI 기능 구현

8:05 씬 세팅과 테스트

8:59 아웃트로

스크립트

인트로

안녕하세요. 여러분들과 함께 게임 개발을 공부하는 베르입니다.

아주 오랜만에 메이크 더 어몽어스 강좌로 돌아왔습니다.

이번에는 지난 강좌에 이어서 투표로 결정된 추방자가 추방되는 연출을 추가하고 추방된 플레이어가 죽는 기능을 추가해보도록 하겠습니다.

본 작업에 들어가기 전에 영상 하단의 링크에서 리소스를 다운로드 받아서 임포트해줍니다.

추방 UI 배치

바로 직전 강좌에서는 투표 직후에 누가 표를 많이 받았는지 보여주는 결과까지 구현했으니 이제 투표 결과로 표를 많이 받은 플레이어를 추방하는 UI를 추가할 차례입니다.

Gameplay 씬에서 Canvas 오브젝트 아래에 이미지 오브젝트를 하나 생성하고 Ejection UI 라는 이름을 붙여줍니다.

그리고 이 이미지가 화면 전체를 덮도록 만들어주고 색을 검은 색으로 만들어 줍니다.

그 다음에는 이 이미지 아래에 텍스트 오브젝트를 만들고 글자 색과 글자 크기를 적당하게 지정해줍니다.

그리고 이미지 오브젝트를 하나 더 생성하고 방금 전에 임포트한 이미지를 넣어주고 머티리얼과 위치를 설정해줍니다.

마지막으로 추방된 플레이어 이미지가 날아갈 경로의 왼쪽 끝과 오른쪽 끝을 표시하는 오브젝트를 배치합니다.

추방 UI 기능 구현

UI 배치를 마친 다음에는 기능을 만들 차례입니다.

EjectionUI라는 이름으로 C# 스크립트를 생성하고 스크립트 에디터를 엽니다.

스크립트 에디터가 열리고 나면 먼저 스크립트 상단에 UnityEngine.UI 네임스페이스를 using 선언해줍니다.

그리고 EjectionUI 클래스의 멤버 변수로 Text 타입의 ejectionResultText과 Image 타입의 ejectionPlayer를 선언해줍니다.

그 다음에는 추방된 플레이어 이미지가 날아갈 경로의 왼쪽 끝과 오른쪽 끝 위치를 담을 RectTransform 타입의 left와 right 변수를 선언합니다.

먼저 Start 함수를 만들고 ejectionPlayer 이미지의 머티리얼을 인스턴스화 해줍니다.

그 다음에는 Open 함수를 만들고 추방당할 플레이어가 있는지를 뜻하는 bool 타입의 isEjection, 추방당한 플레이어의 색상을 표현할 EPlayerColor 타입의 ejectionPlayerColor, 추방당한 플레이어가 임포스터인지 알려주는 bool 타입의 isImposter, 남아있는 임포스터의 수를 알려주는 int 타입의 remainImposterCount를 매개변수로 선언해줍니다.

이 함수에서는 먼저 isEjection 값에 따라서 출력될 텍스트를 만들어 주고 난 다음 오브젝트를 활성화시켜줍니다.

그 다음에는 ShowEjectionResult_Coroutine 함수를 만듭니다.

여기서는 글자가 순서대로 촤라락 보여지는 기능을 만들기 위해서 텍스트를 앞부분과 뒷부분으로 나눠줄 겁니다.

먼저 추방되는 플레이어의 여부에 따라서 플레이어 이미지의 색을 결정해줍니다.

그 다음에는 추방되는 캐릭터 이미지를 회전시키면서 날아가도록 코드를 작성합니다.

그리고 적당한 딜레이를 주면서 글자를 순서대로 출력하도록 만들어 줍니다.

코루틴 함수를 모두 작성한 다음에는 이 코루틴 함수를 Open 함수에서 호출하도록 만들어줍니다.

마지막으로 Close 함수를 만들어서 EjectionUI를 닫도록 코드를 작성합니다.

그 다음 작업으로는 투표가 끝난 이후에 이 EjectionUI를 호출해줘야 합니다.

우선 이 EjectionUI로 접근하기 쉽도록 IngameUIManager로 이동해서 EjectionUI를 캐싱해서 프로퍼티로 불러올 수 있도록 만들어 줍니다.

그 다음에는 GameSystem 스크립트를 열고 MeetingProcess_Coroutine 함수로 이동합니다.

이 코루틴 함수의 아래에 CalculateVoteResult_Coroutine 함수를 만들어 줍니다.

CalculateVoteResult_Coroutine 함수에서는 투표 결과를 계산해야 하는데 먼저 어느 플레이어가 가장 많은 표를 받았는지 확인해야 합니다.

플레이어들이 받은 표를 계산하여 정렬시키기 위해 IComparer 인터페이스를 상속받아서 CharacterVoteComparer라는 이름으로 클래스를 만들어줍니다.

IComparer 인터페이스를 상속받아서 Compare 함수를 구현하면 배열을 빠르게 정렬할 수 있습니다.

Comparer를 만든 다음에는 CalculateVoteResult_Coroutine 함수로 돌아가서 System.Array.Sort 함수에 players 배열과 방금 만든 CharacterVoteComparer를 넣어서 플레이어들을 받은 표 순서대로 정렬해줍니다.

그리고 남은 임포스터 수를 구해두고 제일 처음에는 표를 가장 많이 받은 플레이어의 받은 표 수와 스킵 표 수를 비교합니다.

스킵 표 수가 가장 많이 받은 표 수보다 많거나 같다면 플레이어는 추방당하지 않습니다.

그리고 가장 많은 표를 받은 플레이어와 2순위 플레이어가 동률인 경우도 추방이 이루어지지 않습니다.

마지막으로 스킵 표와 2순위 표보다 1순위 표가 많은 경우에는 1순위 플레이어를 추방해야 합니다.

이 CalculateVoteResult_Coroutine 함수는 서버에서 호출될 예정이기 때문에 클라이언트에서 EjectionUI를 열도록 만들어둘 RpcOpenEjectionUI 함수를 만들고 ClientRpc 어트리뷰트를 붙여줍니다.

그리고 여기서는 IngameUIManager를 통해서 EjectionUI에 접근해서 Open 함수를 호출해줍니다.

그 다음에는 CalculateVoteResult_Coroutine 함수로 돌아가서 각 상황에 맞게 RpcOpenEjectionUI 함수를 호출해줍니다.

RpcOpenEjectionUI 함수를 호출한 다음에는 플레이어가 추방당하는 분기에서 추방당한 플레이어를 죽음 처리해줘야 합니다.

Dead 함수를 호출하면 될 것 같은데, 현재 이 Dead 함수는 크루원이 임포스터에게 죽는 것을 전제로만 동작하게 되어 있으니 조금 수정이 필요해보입니다.

Dead 함수로 이동해서 매개변수에 bool 타입의 isEject 매개변수를 추가해주고 시체를 만드는 부분을 if문으로 묶어서 추방으로 죽은게 아닐 때만 동작하도록 만들어줍니다.

그리고 아래의 RpcDead 함수에도 같은 매개변수를 추가하고 KillUI가 isEject가 아닐 때만 호출되도록 수정해줍니다.

그리고 이 Dead 함수를 수정함으로써 발생하는 에러 역시 모두 수정해줍니다.

수정이 모두 끝나면 CalculateVoteResult_Coroutine 함수로 돌아가서 가장 많은 표를 받은 플레이어의 Dead 함수를 호출해주고 사망한 크루원의 시체들을 찾아서 제거해줍니다.

추방 작업이 끝나고나면 플레이어들이 다시 테이블 근처에 원형으로 배치되도록 만들어줘야 합니다.

GameReady 코루틴 함수를 보면 캐릭터들을 원형 테이블 근처에 배치하는 코드가 있을 겁니다.

이 코드를 블럭 선택해서 우클릭하고 [빠른 작업 및 리팩터링] 항목을 선택해서 [메서드 추출]로 새 함수로 만들어 줍니다.

그리고 이 함수를 CalculateVoteResult_Coroutine 함수에서 호출해줍니다.

그 다음에는 클라이언트에서 EjectionUI를 닫게 만들어줄 RpcCloseEjectionUI 함수를 만들고 ClientRpc 어트리뷰트를 붙여준 다음 EjectionUI의 Close 함수를 호출하게 만들어줍니다.

그리고 다시 플레이어의 캐릭터가 움직일 수 있게 myCharacter의 IsMoveable을 true로 바꿔줍니다.

완성된 RpcCloseEjectionUI 함수는 CalculateVoteResult_Coroutine 함수에서 모든 작업이 끝나고 일정 시간이 지나면 호출되게 만들어줍니다.

그리고 CalculateVoteResult_Coroutine 함수를 MeetingProcess_Coroutine 함수의 제일 아래에서 호출해줍니다.

아 마지막으로 MeetingUI가 닫히도록 만들어주기 위해서 MeetingUI 스크립트로 이동해서 Close 함수를 만들어주고 GameSystem의 RpcOpenEjectionUI 함수에서 호출해줍니다.

코드를 모두 작성한 다음에는 저장하고 에디터로 돌아갑니다.

씬 세팅과 테스트

에디터로 돌아온 다음에는 EjectionUI 오브젝트에 방금 생성한 컴포넌트를 부착하고 프로퍼티를 할당해줍니다.

그리고 캔버스에 붙어있는 IngameUIManager에 EjectionUI를 캐싱해줍니다.

작업이 끝난 다음에는 게임을 빌드해줍니다.

빌드가 완료되면 게임을 실행하고 테스트합니다.

테스트 해보면 아무도 추방하지 않은 경우, 임포스터가 아닌 플레이어를 추방했을 경우, 임포스터인 플레이어를 추방했을 경우, 모두 다른 문구가 나오는 것을 볼 수 있습니다.

아웃트로

이번에는 어몽어스 게임에서 투표 후에 플레이어가 추방되는 UI 연출과 그 처리를 해보았습니다.

이 강좌는 시청자 여러분들의 시청과 후원으로 제작되었습니다.

이상 베르의 게임 개발 유튜브였습니다. 감사합니다.

 

[유니티 어필리에이트 프로그램]

아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.

 

에셋스토어

여러분의 작업에 필요한 베스트 에셋을 찾아보세요. 유니티 에셋스토어가 2D, 3D 모델, SDK, 템플릿, 툴 등 여러분의 콘텐츠 제작에 날개를 달아줄 다양한 에셋을 제공합니다.

assetstore.unity.com

 

Easy 2D, 3D, VR, & AR software for cross-platform development of games and mobile apps. - Unity Store

Have a 2D, 3D, VR, or AR project that needs cross-platform functionality? We can help. Take a look at the easy-to-use Unity Plus real-time dev platform!

store.unity.com

 

Create 2D & 3D Experiences With Unity's Game Engine | Unity Pro - Unity Store

Unity Pro software is a real-time 3D platform for teams who want to design cross-platform, 2D, 3D, VR, AR & mobile experiences with a full suite of advanced tools.

store.unity.com

[투네이션]

 

-

 

toon.at

[Patreon]

 

WER's GAME DEVELOP CHANNEL님이 Game making class videos 창작 중 | Patreon

WER's GAME DEVELOP CHANNEL의 후원자가 되어보세요. 아티스트와 크리에이터를 위한 세계 최대의 멤버십 플랫폼에서 멤버십 전용 콘텐츠와 체험을 즐길 수 있습니다.

www.patreon.com

[디스코드 채널]

 

Join the 베르의 게임 개발 채널 Discord Server!

Check out the 베르의 게임 개발 채널 community on Discord - hang out with 399 other members and enjoy free voice and text chat.

discord.com

 

반응형

+ Recent posts