2D 타일맵으로 그림 그리듯이 맵 만들기 | 유니티

유니티 엔진에서 2D 게임 맵을 만드는데 도움을 주는 타일맵에 대해서 알아봅시다.
영상에서 사용되는 타일맵 텍스쳐를 다운로드 받을 수 있는 링크입니다.
drive.google.com/file/d/1ZnJL...
유니티 테크놀러지에서 제공하는 2D Extra 패키지를 다운로드 받을 수 있는 링크입니다.
github.com/Unity-Technologies...
타임라인
0:00 인트로
0:08 - 타일맵이란?
1:16 - 타일맵 기능을 사용하기 위한 패키지 임포트
1:46 - 타일맵 리소스 임포트
1:55 - 타일맵 텍스쳐 세팅
3:57 - 타일 팔레트 만들기
4:39 - 씬에 타일맵을 그릴 수 있게 해주는 타일맵 게임 오브젝트 배치하기
5:28 - 타일맵 그려보기
5:46 - 타일 자동 연결 기능을 위해서
6:18 - 유니티 2D Extra 패키지 임포트하기
6:36 - 타일 자동 연결 기능 - 룰 타일(Rule Tile)
6:52 - 룰 타일 생성하기
7:23 - 타일링 규칙(Tiling Rule) 정하기
8:24 - 타일링 규칙 상세
8:31 - 타일 규칙
9:15 - 방향 규칙
10:24 - 출력규칙
11:29 - 타일맵 사용시 주의점
본 영상의 오프닝은 비디오몬스터를 이용해서 만들어졌습니다.
videomonster.com/
[유니티 어필리에이트 프로그램]
아래의 링크를 통해 에셋을 구매하시거나 유니티를 구독하시면 수익의 일부가 베르에게 수수료로 지급되어 채널의 운영에 도움이 됩니다.
- 유니티 에셋스토어 : prf.hn/l/vJl41D5
- 유니티 플러스 : prf.hn/l/wLNyJZG
- 유니티 프로 : prf.hn/l/qXOybmp
[투네이션]
toon.at/donate/63773521276146...
[Patreon]
/ wergamedevchan
#유니티강좌 #타일맵 #게임만들기

[@user-mz6cf1ly5n]

우와 하나하나 왜 그런지 다 설명해 주셔서 정말 좋네요. 다른 강의 영상들은 그냥 "픽셀퍼 유닛에서 싱글을 멀티플로 바꾸고 어플라이 누르고 스프라이트 에디터에서 슬라이스 누르세요"하고 넘어가는데 왜 그렇게 해야 하는지 알려주셔서 정말 감사합니다! 좋아요 구독하고 갑니다!

[@2M7F]

ㅎㅎ

[@gorani_TV]

드디어 다 정독했습니다! 각 컴포넌트에 대해 이렇게 깊이있는 설명까지 하셔서 정말 도움이 많이 됩니다. 이런 강좌 누가 찍어 줄 수 없나 기대했는데 베르님이 똭 등장하셨군요. 앞으로도 좋은 강의 부탁해요

[@wergia]

기능 단위로 만드니까 좋아요 ㅎㅎ

[@user-el8vu1be8j]

고라니님 여기서도 보게되어 반갑습니다

[@2M7F]

ㅎㅎㅎㅎㅎ

[@신데스나인]

맨땅에 헤딩으로 유니티 공부를 하는데 정말 도움이 많이 되었습니다!

[@user-ym9wx1qh4x]

연습으로 게임을 하나 만들고 있는데 맵 같은 경우에는 terrain과 AssetStore의 에셋을 이용하여 본인이 원하는대로 일일이 꾸미는 건가요? 혹시 맵 제작시에 편리하게 할 프로그램 같은게 있을까요? 참고로 3D RPG 형식 제작중입니다 유튜브에 맵 제작 관련하여 검색하니 terrain 말고는 따로 나오는게 없어서 여쭤봅니다

[@wergia]

네 대부분은 터레인을 이용하거나 에셋스토어에서 필요한 에셋을 구매해서 배치합니다. 원하는 테마의 에셋을 구하기 어려우면 직접 제작해야하구요. 그리고 맵 배치 설계를 해서 적절하게 배치해줘야 합니다.

[@user-dz4ij8sb8j]

제가 Tiled에서 맵을 만들면서 SuperTiled2Unity를 사용하여 Unity에서 Costom package를 눌른다음 연동시킬려고 Tiled에 command에 Arguments창안에 주소를 넣을 SuperTiled2Unity.exe를 찾아봤는데 없네요 ㅜㅜ 어떡해 연동시킬방법 없나요??

[@wergia]

음 저는 SuperTiled2Unity를 사용해보지 않아서 답변을 드리기가 어렵네요 ㅜㅜ

[@꿈꾸는모험가]

크흡.... 정말 유료강의급 퀄러티에 그저 감탄을...

[@wergia]

ㅎㅎ 감사합니다! 다른 분들께도 많이 소개 해주세요!

[@2M7F]

ㅎㅎㅎ

[@cy8854]

그 동안 스프라이트 이미지로 만들어왔었는데 타일맵 방식을 알고나니 정말 편하게 작업하게 되었습니다. 감사합니다. 그런데 타일맵 방식에 대해 궁금한게 있습니다. Sprite 이미지 방식을 사용할 때에는 지형이 좌, 우 또는 상, 하로 움직이는 스크립트가 부착된 발판을 프리팹으로 만들어서 필요할 때마다 Sceen으로 끌어다가 사용할 수 있었습니다. 그런데 타일맵은 그걸 어떻게 해야 할 지 모르겠습니다. 타일맵에 스크립트 붙여서 해봤는데 그 타일맵에 그려진 타일이 다같이 움직이더라구요. 그렇다고 이동 발판 하나 하나 타일맵을 찍어내는게 맞나 싶어서 이렇게 질문 드립니다.

[@wergia]

이동 발판에 타일맵을 하나 만드는 것보다는 스프라이트 렌더러로 타일을 배치해서 박스 콜라이더로 감싸는 방식으로 발판을 만드는게 좋을 것 같습니다. 그리고 그 발판을 프리팹으로 만들어서 재활용하면 될 것 같습니다.

[@cy8854]

@@wergia 감사합니다

[@Cargold_]

좋은 영상 감사합니다 ㅠ

[@user-xw2lm3jh8i]

혹시 2d-extras 파일 다운은 받고 assets 공간에 넣었는데 create 메뉴에서 2d-extra관련되서 새로 만드는 항목이 추가되지않습니다. 왜그런걸까요 ㅠㅠ

[@wergia]

유니티 에디터에서 콘솔 뷰를 봤을 때, 에러가 표시되지는 않나요? 만약 에러가 있다면 해결해주셔야 항목이 표시될 겁니다. 에러가 승현님 코드에서 발생하는 것이라면 코드를 수정하시면 되고 2d-extra에서 받은 코드에서 에러가 나는 것이라면 에디터 상단 메뉴 바에서 [Window > Package Manager] 항목을 선택해서 패키지 매니저를 연 다음 2D Sprite 패키지와 2D Tilemap Editor 패키지를 검색해서 설치해보세요!

[@user-xw2lm3jh8i]

@@wergia 한번해보겠습니다. 상세설명 감사합니다!!

[@user-xe1hj4el8r]

타일맵을 동적할당으로 배치하고싶습니다 isometric모드로 배치하려고하는데 일반모드로 배치되네요 며칠째 어려움을 겪고있는데 조언부탁드려요 ㅠㅠ using System.Collections; using System.Collections.Generic; using UnityEngine; public class ABCD : MonoBehaviour { [SerializeField] private GameObject tile; public float TileSize{ get { return tile.GetComponent().sprite.bounds.size.x; } } // 시작 부분에 사용 void Start () { Grid Ttile ; Ttile = GameObject.Find("FFF").GetComponent(); Ttile.cellLayout = Grid.CellLayout.Isometric; CreateLevel(); } private void CreateLevel(){ Vector3 worldStart = Camera.main.ScreenToWorldPoint(new Vector3(0, Screen.height)); //5*5 tile map for (int y = 0; y < 5; y++){ //the y position for (int x = 0; x < 5; x++){ //the x position PlaceTile(x,y,worldStart); } } } private void PlaceTile(int x, int y, Vector3 worldStart){ GameObject newTile = Instantiate(tile); newTile.transform.position = new Vector3(worldStart.x + (TileSize * x), worldStart.y - (TileSize * y), 0); } }

[@wergia]

타일맵 동적 배치 영상도 만들려고 준비 중이긴 합니다 ㅎㅎ 다만 코드를 분석해보니까 타일을 생성하는 부분이 유니티 타일맵 기능을 사용하는게 아니라 스프라이트 렌더러를 따로 만들고 있네요. 좌표도 일반 좌표를 사용하고 있구요. 그리고 코드에서도 Grid는 가져와서 셀 레이아웃을 아이소메트릭으로 만들기만 하고 전혀 사용을 안하고 있어요. using UnityEngine.Tilemaps; 이 네임스페이스를 선언하고 Tilemap map; 변수를 생성해서 map = GetComponent(); 으로 컴포넌트를 가져온 다음에 map.SetTile() 함수를 사용해보면 될 것 같아요.

[@user-xe1hj4el8r]

@@wergia 헉 감사합니다!! isometric 좌표는 어떻게 구현하는게 맞나요? Grid 사용법 또한 잘모르겠어요 ㅠㅠ

[@user-io9yy3hx6h]

마지막 주의점에 나온 것처럼 팔레트에 넣고 움직였는데 터진건지 화면이 아예 안 움직이고 안 닫히네요 어떻게 할 방법이 있을까요?ㅠㅠ

[@wergia]

Ctrl + Shift + ESC를 눌러서 작업관리자를 켜서 봤을 때 유니티 엔진이 응답없음이면 터진겁니다. 끄고 다시 실행해보세요!

[@user-io9yy3hx6h]

@@wergia 끄고 다시 실행해도 그대롭니다 ㅠㅠ

[@donaldtrump1123]

좋아요 눌러요

[@user-ol8oe2fb9z]

스크립트 상에서 타일맵을 넣어줄 때 룰 타일을 넣을 수는 없나요?

[@wergia]

제가 시도해보지는 않아서 가능할지 모르겠네요.

[@ssabsonhe]

16px * 16px 이면 유니티에서 도트 화질이 뭉개지는 것은 당연한건가요??

[@wergia]

이미지를 선택하고 Filter Mode를 Point로 변경해보세요.

[@ssabsonhe]

@@wergia d아!....감사합니다! 바로 해결됐어요1

[@user-it9fc6xs5c]

이걸로 겁나 크게 그렸는데 오브젝트가 타일 아래로 내려가서 가려져 있어요 z좌표 문제인거 같은데....

[@wergia]

sorting order를 한 번 바꿔보세요 2D는 3D랑 다르게 Z좌표보다는 Sorting Order의 영향을 받습니다.

[@HaNong075]

ppu 가 16이여야 한다고 하셨는데 혹시 어떻게 계산이 나온건지 수식으로 설명해 주실 수 있을까요ㅠㅠ...

[@wergia]

수식이라기 보다는 영상에서 타일맵 리소스로 사용하고 있는 텍스처를 보시면 전체 텍스처의 해상도가 128x128인 것을 보실 수 있습니다. 그리고 텍스처에 그려진 텍스처는 가로x세로 각 8개로 한 타일당 16픽셀인 것을 알 수 있습니다. Pixel Per Unit은 몇 개의 픽셀을 유니티에서 1유니티미터의 단위로 볼 것인가를 정하는 값이라고 알려드렸습니다. 보통 유니티에서 1타일을 1유니티미터에 대응하도록 하는게 좋기 때문에 16픽셀을 1유니티미터로 보게 만든거죠. 만약 사용하는 타일맵 텍스처가 한 타일당 64픽셀을 사용한다면 이 PPU를 64로 지정해주시면 됩니다.

[@HaNong075]

@@wergia 아아 이해했습니다! 타일당 유닛에 맞게끔 떨어지게 하기 위해 설정하는거군요...영상 보는중에 답변을 해주신다니 다른 일 하시는데 방해한게 아닌가 싶네요ㅠㅠ답변 정말감사드려요!

[@wergia]

영상 만들기 전에 항상 댓글 확인하고 답변 다는 시간이 있어서요 ㅎㅎ

[@2M7F]

ㄷㅎ

[@user-ex8uw8zt1o]

타일맵 다운로드 링크가 깨져있는 것 같습니다.

[@user-ex8uw8zt1o]

현재 Unity2020.3.1f1 버전을 사용중이며 2D Sprite와 2D TileMap Editor를 임포트한 상태입니다. 오류가 발생하여 정상적인 진행이 되지않습니다. 오류가 나는 부분은 확인해보니 OnAddElement에서 사용되는 RederableList에 IsSelected라는 함수가 정의되어 있지 않다고 합니다. 영상의 유니티 버전이 2019인 것으로 보이는데 버전차이로 인한 문제인건가요?

[@user-ex8uw8zt1o]

2019.4.23f1 버전에서도 동일한 오류가 나옵니다.

[@wergia]

우선 링크는 복구해뒀습니다. 오류 부분은 저도 확인해봐야 겠네요

[@rabe486]

혹시 해결되셨나요?.. 저도 비슷한 경험을 겪었습니다.

[@ksong5589]

강의 쩝니다 형님

[@2M7F]

e e ㄷ ㄷ