WEBVTT

00:00:00.000 --> 00:00:04.993
2D Tilemap is a powerful tool that provides you with a simple way to create

00:00:05.025 --> 00:00:08.293
2-dimentional environments, based on the grid layout.

00:00:08.914 --> 00:00:12.652
In 2018.3, Unity is adding support

00:00:12.652 --> 00:00:14.144
for a new type of grid

00:00:14.208 --> 00:00:16.949
which will allow you to make isometric levels

00:00:16.949 --> 00:00:19.103
the like of which can be seen in:

00:00:19.103 --> 00:00:20.689
Pillars of Eternity

00:00:20.689 --> 00:00:22.236
The Banner Saga

00:00:22.581 --> 00:00:25.487
Shadowrun, and many more.

00:00:26.321 --> 00:00:29.044
In addition, since 2018.2,

00:00:29.599 --> 00:00:31.940
Unity also support hexagonal grids

00:00:32.258 --> 00:00:34.622
which are commonly encountered in strategies,

00:00:34.622 --> 00:00:36.474
and other turn-based games.

00:00:37.645 --> 00:00:39.855
In this video, you will learn how to setup

00:00:39.855 --> 00:00:42.658
the new isometric and hexagonal tilemaps,

00:00:43.091 --> 00:00:45.088
as well as all the essential workflows

00:00:45.088 --> 00:00:46.728
that will help you get started.

00:00:47.811 --> 00:00:51.081
Be sure to check out the demo project
in the video description,

00:00:51.256 --> 00:00:54.738
if you'd like to use the demonstrated assets yourself

00:00:55.332 --> 00:00:59.620
Tilemap has been a part of the editor since 2017.2

00:00:59.907 --> 00:01:03.593
and doesn't require any additional package downloads to work.

00:01:04.123 --> 00:01:06.046
To use the new tilemap grids,

00:01:06.046 --> 00:01:07.310
you just need to make sure

00:01:07.310 --> 00:01:09.719
that you are on the right version of Unity.

00:01:10.230 --> 00:01:14.769
You are going to need 2018.2 or higher for hex tilemaps.

00:01:15.272 --> 00:01:19.175
And 2018.3 onwards for isometric。

00:01:20.204 --> 00:01:24.492
Tilemap consists of several components working together.

00:01:24.893 --> 00:01:27.270
First we have a grid GameObject.

00:01:27.814 --> 00:01:30.581
This create your chosen grid type in the scene

00:01:30.581 --> 00:01:33.835
and gives you further options to customize its parameters,

00:01:33.835 --> 00:01:35.260
such as the cell size.

00:01:38.251 --> 00:01:42.470
We can then attach one or more tilemap game objects to our grid.

00:01:43.120 --> 00:01:44.504
Once we have a tilemap,

00:01:44.504 --> 00:01:48.203
we need to create a palette which will hold our tile assets.

00:01:48.927 --> 00:01:50.912
You can access the tile palette menu

00:01:50.912 --> 00:01:54.263
from Window -> 2D -> Tile Palette

00:01:55.117 --> 00:01:57.429
From here, you can create new palettes

00:01:57.429 --> 00:02:00.162
corresponding to each of the different grid types.

00:02:00.162 --> 00:02:01.794
You can add tiles to a palette

00:02:01.794 --> 00:02:05.702
by simply dragging the sprites from the Project Window onto the palette.

00:02:06.745 --> 00:02:08.287
Once you have a tile ready,

00:02:08.287 --> 00:02:10.221
select it with the brush tool,

00:02:10.481 --> 00:02:13.419
and choose the tile map game object you wish to paint on.

00:02:14.361 --> 00:02:16.205
If you go back to the scene view,

00:02:16.205 --> 00:02:19.285
you will now be able to start painting with your tile.

00:02:20.680 --> 00:02:25.500
Your isometric or hexagonal grid can hold more than one tilemap.

00:02:27.110 --> 00:02:31.487
You can use this to place some decorative objects on top of your tiles.

00:02:31.763 --> 00:02:35.116
Or to create elevation levels and buildings.

00:02:35.812 --> 00:02:38.654
You can change the sort order of the new tilemap,

00:02:38.654 --> 00:02:41.223
so that it renders on top of the previous one.

00:02:41.473 --> 00:02:43.780
You can also change the tile anchor setting,

00:02:43.780 --> 00:02:47.184
to place your tiles on the higher point relative to the grid.

00:02:47.954 --> 00:02:53.225
If you're using isometric tiles, you could also use a Z as Y tilemap,

00:02:53.225 --> 00:02:58.017
and create elevation by simply changing the Z position of the tiles.

00:02:58.480 --> 00:03:02.601
There's an example available on the 2d tech demos repository,

00:03:02.725 --> 00:03:04.484
where you will find a scripted brush

00:03:04.484 --> 00:03:07.963
that lets you adjust the set value dynamically as you paint.

00:03:08.290 --> 00:03:12.257
You can find a link to the repository down in the video description.

00:03:13.360 --> 00:03:17.769
At some point you will likely want to add collision to your tiles.

00:03:18.366 --> 00:03:22.309
For this purpose you can use a Tilemap Collider 2D component,

00:03:22.608 --> 00:03:27.217
which will automatically generate collision shapes for each individual tile.

00:03:28.269 --> 00:03:30.062
In the tile asset settings,

00:03:30.062 --> 00:03:33.636
you can adjust the type of physics shape each tile has.

00:03:33.679 --> 00:03:38.833
You can change the collider to be either sprite based or grid based.

00:03:39.288 --> 00:03:41.230
If your tile has a grid Collider,

00:03:41.230 --> 00:03:44.692
its collision shape will match exactly with the shape of the grid cell

00:03:44.692 --> 00:03:46.313
it is attached to

00:03:46.986 --> 00:03:51.013
With a Sprite Collider you can add a custom physics shape to your tiles

00:03:51.013 --> 00:03:52.941
by using the sprite editor.

00:03:53.454 --> 00:03:55.489
Once you have a tilemap collider,

00:03:55.489 --> 00:03:58.222
you might wish to merge the individual shapes into one

00:03:58.222 --> 00:04:00.745
by using a Composite Collider 2D

00:04:01.872 --> 00:04:07.596
As you can see tilemap offers a simple and fast
solution to creating physics shapes.

00:04:08.501 --> 00:04:11.110
If you have characters in your top-down
game,

00:04:11.110 --> 00:04:13.480
you will most likely want them to be able to

00:04:13.480 --> 00:04:16.470
go behind and in front of objects on your level.

00:04:17.040 --> 00:04:17.909
In this case

00:04:17.909 --> 00:04:21.269
be sure to set the sort mode on the tilemap with your objects

00:04:21.269 --> 00:04:22.679
to "Individual".

00:04:23.529 --> 00:04:27.604
Now if your character sort order is the same as that of the tile map

00:04:28.037 --> 00:04:31.692
it will appear to go behind and in front of the tiles on that tile map

00:04:32.391 --> 00:04:35.088
You could adjust the sort order dynamically

00:04:35.088 --> 00:04:38.506
to move the character to higher or lower elevation levels

00:04:39.467 --> 00:04:42.537
If you want to speed up your world building with tilemap,

00:04:42.537 --> 00:04:45.501
you can use Rule Tiles to extend your tile presets.

00:04:46.631 --> 00:04:51.184
For example, you could make it so that when you're painting a certain type of terrain,

00:04:51.184 --> 00:04:54.873
the correctly oriented tiles are chosen automatically for you.

00:04:55.467 --> 00:04:59.116
You could also randomize different variations of the same tile.

00:04:59.782 --> 00:05:04.945
Rule Tiles can save you a great amount of time in creating complex 2d environments.

00:05:05.645 --> 00:05:09.558
The new hexagonal and isometric Rule Tiles are now available

00:05:09.558 --> 00:05:12.151
on the 2d tech demos repository.

00:05:12.449 --> 00:05:15.973
So feel free to go ahead and check them out for yourself.

00:05:17.163 --> 00:05:21.648
Of course you're also able to extend tilemap with your own tile types.

00:05:22.161 --> 00:05:25.211
Take a look at the featured documentation to learn more

00:05:25.511 --> 00:05:30.471
Hopefully, this video has taught you some useful workflows for the new types of tilemap.

00:05:30.924 --> 00:05:32.642
There's a lot more you can do,

00:05:32.642 --> 00:05:35.031
but these basics will be a good starting point

00:05:35.031 --> 00:05:36.981
if you want to try them out yourself.

00:05:37.358 --> 00:05:41.140
You may also want to check out some of our tilemap blog posts,

00:05:41.140 --> 00:05:44.823
including the one on procedural generation by Ethan Bruins.

00:05:45.559 --> 00:05:49.414
The assets used in this video are available down in the link below

00:05:49.414 --> 00:05:52.169
and are free for you to use as you wish.

00:05:52.853 --> 00:05:56.033
As always, we're looking forward to seeing all the awesome projects

00:05:56.033 --> 00:05:59.014
that you will create using unity's new tools.

00:05:59.251 --> 00:06:03.471
Please share your creations and feedback on the unity forum