230316
[2023 메타버스 달서 공모전] 출품을 위해, 제페토를 공부하는 일지
1. 점프맵 제작
(1) 새로운 신 생성
-
[Assets] → [Scenes] 폴더에
JumpMapScene을 하나 생성한다. -
플레이어를 세팅한다.
-
기존에
CharacterController.ts컴포넌트를 적용했던Player오브젝트의 역할을,Character Controller오브젝트가 하도록 변경하였다. -
그리고
ZepetoPlayers와Character Controller오브젝트를Player라는 빈 오브젝트의 자식으로 오게 하였다. (내가 보기 편하도록)
-
-
Publish 버튼 옆의 [▼] 버튼 → [Open World Settings]
- Orientation을 Horizontal로 변경해 주었다.
- 게임 화면이 가로로 보이는 옵션이다.
-
유니티 최상단 메뉴 [File] → [Build Settings]에 현재 신을 추가해 주고, QR 테스트를 진행해 보았다.
-
실행 결과
(2) 오브젝트 배치 및 색 변경
-
오브젝트는 [3D Object] → [Cube]를 이용해서 일단 두 개 배치하였다.
-
맵에 색을 넣기 위해, Asset 폴더에 Materials 폴더를 만들고, 그 안에 새로운 Material을 생성해 준다. 이름은 Floor라고 지었다.
-
인스펙터 창의 Albedo 속성에서 원하는 색을 선택한다.
-
이
Floor머티리얼을 드래그해서 신 뷰의Plane오브젝트에 놓으면, 바닥의 색이 바뀐다.
-
위와 같은 방법으로, 발판 오브젝트의 머티리얼도 생성해서 적용해 준다.
-
그 후 적당히 레벨을 디자인한다.
(3) 회전하는 발판 제작
-
제페토에서 기본적으로 제공하는
SampleScript.ts를 참고하여, 돌아가는 발판을 만들어 보자. -
우선 직사각형의 발판을 만들어 준다.
-
📑
Rotator.ts스크립트 생성 -
변수
// 각 축을 기준으로 회전하는 속도 public rotatorX : number = 0; public rotatorY : number = 0; public rotatorZ : number = 0;
-
Update()함수Update() { // transform.Rotate(x, y, z): 매 프레임마다 -축을 기준으로, -의 속도로 회전 this.transform.Rotate(this.rotatorX, this.rotatorY, this.rotatorZ); }this: 이 컴포넌트가 적용된 오브젝트transform.Rotate(x, y, z): 인자에 값을 넣으면, 해당 축을 기준으로 넣어준 속도만큼 회전한다. (Update 내부이니, 매 프레임마다 3의 속도로 회전하게 된다.)
-
위 오브젝트에
Zepeto Script컴포넌트를 추가한 다음,Rotator.ts스크립트를 드래그해서 넣는다. 그리고 y축을 기준으로 1의 속도로 회전하도록 만든다.
-
실행 결과
(4) 상하좌우로 움직이는 발판 제작
-
일반적인 점프로는 닿을 수 없는 곳에 발판을 위치시킨다.
- Cylinder 오브젝트를 생성했는데, 콜라이더가 캡슐이기 때문에, 밟을 때 미끄러져서 Box Collider로 바꿔주었다.
-
📑
Movement.ts스크립트 생성 -
변수
public movingTime : number = 0; // 발판이 방향을 바꾸는 주기 (sec) public movingRangeX : number = 0; // X축 방향으로 이동하는 범위 public movingRangeY : number = 0; // Y축 방향으로 이동하는 범위 private delta : number = 0; // deltaTime 값을 누적해서, 얼마의 시간이 흘렀는지를 판단 private movingFlag : boolean = true; // 어느 방향으로 움직일지 결정movingTime: 발판이 방향을 바꾸는 주기. 값이 1이면, 1초마다 방향을 바꾼다.movingRangeX: 발판이 X축 방향으로 움직이는 범위movingRangeY: 발판이 Y축 방향으로 움직이는 범위delta: 매 프레임 간의 시간 차이인 deltaTime의 값을 누적해서, 얼마의 시간이 흘렀는지 판단한다.movingFlag: 발판이 어느 방향으로 움직일지 결정 (true면 정방향, false면 역방향)
-
Update()함수Update() { // Time.deltaTime: 이전 프레임과 현재 프레임 사이의 시간 차이 this.delta += Time.deltaTime; // 매 ~초마다 실행되는 코드 if (this.delta >= this.movingTime) { this.delta = 0; this.movingFlag = !this.movingFlag; } // movingFlag가 참일 땐 정방향으로 움직임 if (this.movingFlag) { this.transform.Translate(this.movingRangeX * Time.deltaTime, this.movingRangeY * Time.deltaTime, 0); } else { this.transform.Translate(-this.movingRangeX * Time.deltaTime, -this.movingRangeY * Time.deltaTime, 0); } }delta에Time.deltaTime값을 누적한다.delta의 값이 내가 설정한movingTime(방향 전환 시간)의 값보다 크거나 같아지면delta의 값을 0으로 초기화하여, 다시movingTime을 체크하도록 한다.movingFlag의 값을 반대로 바꾼다.- → 즉, 매
movingTime초마다 방향을 바꾸는 코드가 된다.
- 만약
movingFlag의 값이 true이면, 정방향으로 움직이도록 한다.- Translate(x, y, z)는 위치를 바꾸는 함수
- Time.deltaTime을 곱해서, 프레임이 달라도 같은 속도로 움직이도록 한다.
- 만약
movingFlag의 값이 false이면, 역방향으로 움직이도록 한다.- -를 곱한다.
-
상하로 움직이는
Cylinder (1) - Vertical오브젝트에 위 스크립트를 적용한다.
- 상하로 움직이기 때문에,
Moving Time과Moving Range Y속성에만 값을 입력하였다.
- 상하로 움직이기 때문에,
-
좌우로 움직이는
Cylinder (3) - Horizontal오브젝트에 위 스크립트를 적용한다.
- 좌우로 움직이기 때문에,
Moving Time과Moving Range X속성에만 값을 입력하였다.
- 좌우로 움직이기 때문에,
-
실행 결과
2. 다음에 할 일
-
캐릭터 텔레포트
-
오브젝트 상호작용 구현
-
유니티 셰이더 공부
-
타입스크립트 공부
3. 후기
- 왜 제페토가 타입스크립트를 사용하는지 궁금했는데, 오늘 영상을 보면서 알게 됐다. 제페토는 기본 앱으로 여러 게임을 플레이할 수 있는데, 타입스크립트가 C#보다 더 가벼워서 그렇다고 한다.
- C#에서는 [SerializeField]로, private 변수도 인스펙터 창에서 설정할 수 있었는데, 타입스크립트는 그걸 선언하는 방법을 모르겠다. public으로 하면 나중에 스크립트 짤 때 실수할 것 같은데... 이건 좀 더 구글링을 해 봐야겠다.
- 근데 맵 디자인 정말 어렵고 힘든 것 같다. 모든 게임 제작자 분들이 존경스럽다. 요즘 게임을 공부하면서 달라진 점이 있다면, 아무리 버그가 많고 재미 없는 게임일지라도 '오 이 부분은 어떻게 구현했을까?'를 먼저 생각해 본다는 것이다. 세상에 못 만든 게임은 없다고 생각한다. 진짜로...
