IntroductionWelcome| 00:00 |
(MUSIC).
Hi, I'm Adam Crespi, and welcome to Level
| | 00:06 |
Design Basics in Unity.
In this course, we'll look at the planning
| | 00:10 |
and execution of a modular approach to
game design.
| | 00:14 |
I'll start by showing you how to draw out
and think about a modular kit of parts for
| | 00:18 |
your level.
Laying out a level and looking at the
| | 00:21 |
player path, pinch points and strong
points, and places for interactivity.
| | 00:26 |
We'll use Autodesk Maya to export out FDXs
of our kit of parts and bring them into
| | 00:30 |
Unity, so, we can place them in our level.
We'll see how to create prototypes or
| | 00:36 |
white box objects, and then how to replace
them seamlessly with fully detailed artwork.
| | 00:41 |
We'll look at creating custom mesh
colliders for running up stairs.
| | 00:45 |
And also applying animation to objects,
such as spinning fans and blinking lights.
| | 00:51 |
We'll be covering all of these features,
plus plenty of other tools and techniques.
| | 00:54 |
Now, let's get started with level design
basics in unity.
| | 00:58 |
| | Collapse this transcript |
| What you should know before watching this course| 00:00 |
For this course, you should have a good
understanding of unit 3D.
| | 00:04 |
If not, I'd highly recommend checking out
the unity 3D essential training course on Lynda.com.
| | 00:09 |
Additionally its strongly recommended you
have working knowledge of a major 3D
| | 00:13 |
package for creating your own assets, such
as Auto-desk 3Ds Max or Autodesk Maya.
| | 00:19 |
These will allow you to create your own
assets and props.
| | 00:22 |
A basic knowledge of Adobe Photoshop and
or Illustrator is also recommended for
| | 00:26 |
creating textures and planning out your
maps.
| | 00:30 |
So, let's get started with level design
basics in Unit 3D.
| | 00:34 |
| | Collapse this transcript |
| Using the exercise files| 00:00 |
If you're a premium member of lynda.com,
you have access to the exercise files used
| | 00:03 |
throughout this title.
This course uses Autodesk Maya, Adobe
| | 00:08 |
Illustrator, Adobe Photoshop, and Unity
3D.
| | 00:12 |
In each chapter, there's a project for
that particular application.
| | 00:15 |
Adobe Illustrator files are in the chapter
folder, as are standalone PSD or working
| | 00:20 |
Photoshop files, and exported TIFFs along
with any other Word documents, such as a
| | 00:24 |
game design document for the game.
In each chapter, there's a Maya project if
| | 00:31 |
we're working in Maya, and a Unity
project.
| | 00:34 |
Make sure you set your project folder for
each application before opening the scene.
| | 00:39 |
In Maya, choose File > Set Project and
browse to the exercises folder.
| | 00:45 |
In the exercise files, set your project to
the named Maya folder.
| | 00:50 |
In there the default Maya project
directories, click Set, and then open the
| | 00:54 |
scene from that folder.
In unity, set your project first and then
| | 00:59 |
open the scene.
Click File and open project.
| | 01:03 |
Open the unity project, choosing Open
Other, if they don't show up in the
| | 01:06 |
recently opened project list.
In unity, the assets and other parts are
| | 01:11 |
organized in folders.
Folders that are named for a certain video
| | 01:15 |
have the assets that change or are
specific to that video in that folder.
| | 01:20 |
Common assets such as meshes used
throughout are in an imported meshes folder.
| | 01:26 |
This course uses Adobe Illustrator for
laying out the level map.
| | 01:30 |
However, you can use any program you wish.
In addition, you could do this with pencil
| | 01:34 |
and paper if you'd like, if you're more
comfortable drawing it out first.
| | 01:38 |
All of the objects in the Illustrator
document are created natively there, or
| | 01:42 |
exist in the starting document.
Simply open the document and the layer
| | 01:47 |
structure has all the objects in it.
Thanks, and let's get started with level
| | 01:51 |
design basics in Unity.
| | 01:53 |
| | Collapse this transcript |
|
|
1. Planning the LevelSetting goals for the player| 00:00 |
Game levels take a lot of planning before
we jump into 3D.
| | 00:04 |
It's important to plan out your level,
think about what you're doing and what are
| | 00:08 |
your elements you're going to use.
So you can design a level that feels open,
| | 00:12 |
and still directs the player towards where
you want.
| | 00:16 |
We're going to start out with a game
called "Blend".
| | 00:18 |
This is the third edition, the Casablanca
Edition.
| | 00:21 |
The premise of the game is
straightforward.
| | 00:23 |
You're a globetrotting chef and you need
to source out, and produce meals for
| | 00:26 |
exclusive clients.
All of your ingredients must be sourced
| | 00:30 |
locally and sustainably, from local
market.
| | 00:32 |
Your goal then, is to learn enough of each
market to find ingredients, but not to
| | 00:36 |
look like a tourist, thus the name of the
game, Blend.
| | 00:39 |
It's a long duration collection game.
What this means is that it's not a,
| | 00:43 |
frantic timed collection.
But you have to go around and get your
| | 00:47 |
ingredients, before the market closes.
Ingredients will ascend in scarcity and
| | 00:51 |
value, and players can level up by
assembling complete recipies and finding
| | 00:54 |
unique flavor swaps or combinations.
There's also a secondary mechanic of
| | 00:59 |
barter here.
Some shopkeepers maybe willing to barter
| | 01:01 |
for different ingredients and your success
depends on reading the signage and other
| | 01:05 |
way finding devices.
The game takes place over one half day,
| | 01:09 |
roughly either an early morning through
lunch or mid-evening to avoid the hottest
| | 01:13 |
part of the day and following the cycle of
the market's opening.
| | 01:18 |
We need to collect different food items,
spices, oils, and other staples, and
| | 01:21 |
occasionally unique kitchen equipment.
We'll have to design some wayfinding tools
| | 01:26 |
and methods, wayfinding allows us to
orient ourselves in the game environment.
| | 01:31 |
And it can range from simple signage to
color coding and motifs on the wall such
| | 01:35 |
as tile.
Signage is an obvious way of wayfinding,
| | 01:38 |
but we don't want to always just put a
sign in.
| | 01:41 |
We'd like to do it in a way that feels
like a natural part of the environment
| | 01:44 |
that it exists there for the people who
were there whether the player is there or not.
| | 01:49 |
We'll start out with some reference
imagery.
| | 01:51 |
This is set in Casablanca.
So, we've got imagery of different suits
| | 01:55 |
which are narrow winding streets and also
other markets in North Africa and the
| | 01:58 |
Middle East.
This is a spice stall in one of the
| | 02:02 |
markets and we can see just the raw spices
available by weight here along with all
| | 02:06 |
kinds of other goods in jars.
This is a medina, an example of a very
| | 02:11 |
narrow, possibly winding street in an old
part of the market.
| | 02:15 |
In this image, we have a lousha or covered
walkway.
| | 02:18 |
And somebody is selling rugs and they're
strewn on the columns and on the walls.
| | 02:23 |
This is a pot vendor, where they're
selling both serving bowls and decorated
| | 02:27 |
pots and vases.
Here's a rug vendor and it's important to
| | 02:31 |
note that there's a shop down below and
possibly living quarters or other shops up above.
| | 02:36 |
And the building height is used to display
as many pieces as possible.
| | 02:40 |
Here's another, Medina.
What we see in a lots of these places is
| | 02:42 |
that it's a mixture of covered walkways
and open spaces.
| | 02:47 |
Partially covered in some places for
shade, and also because buildings have
| | 02:50 |
been built over the walkways.
So we need a mixture in our game of
| | 02:54 |
enclosed spaces and open ones.
Here's another covered walkway, this one a
| | 02:58 |
little bit taller,with shops off the
walkway, and minurets off in the distance.
| | 03:03 |
This one has lights in it and a flat roof
made of wood.
| | 03:06 |
Here's yet again another covered walkway
or a hallway with doors in it.
| | 03:10 |
Doors and screens are important in a game
environment so that the player can either
| | 03:14 |
stop, be stopped or interact with
something to get in.
| | 03:18 |
Here we're seeing another merchant, this
case rugs, under a canopy of reeds.
| | 03:22 |
This is a large covered market.
Covered for shade, with windows to let in
| | 03:26 |
light, and two stories of shops.
Small shops with either living quarters or
| | 03:31 |
second shops up above.
An this is the spice market again.
| | 03:35 |
It's also important to see the visual
density of these markets.
| | 03:38 |
We'll need to take that into account when
we're designing the texture sheets later.
| | 03:41 |
One of the things that's helpful in laying
out a level, is to draw out elements you
| | 03:45 |
think you might need, in a map.
This can be either done with pencil and
| | 03:49 |
paper or in applications such as Adobe
Photoshop or Illustrator, or even in a
| | 03:53 |
flowchart, such as Microsoft Visio.
It's up to you how you'd like to lay it
| | 03:57 |
out, but drawing out, a kit of parts, an
then laying out the level is an important step.
| | 04:03 |
What we have here in this document is a
series of both shops and connecting elements.
| | 04:08 |
There are small shops, each one with
shelves around and tables in the middle,
| | 04:11 |
and a couple of variations.
And a long shop here, with a door at
| | 04:15 |
either side.
We've got some different elements to be
| | 04:18 |
able to make our connecting spaces.
This square represents a vault, or an
| | 04:23 |
overhead curved stone arch.
And here's a double vault and finally a
| | 04:28 |
barrel vault.
These green pieces represent maybe some
| | 04:31 |
kind of arrangement of a tent on poles or
a canopy.
| | 04:35 |
Whereas the X down here is an all fabric
or reed tent.
| | 04:38 |
There's also some connecting walls and
elements, these are walls with arches and
| | 04:42 |
columns in the middle.
And doorways both opening or swinging and
| | 04:46 |
sliding doors.
And some connecting elements that are curved.
| | 04:50 |
This one is a 15 degree bend while this
wedge is at a 45.
| | 04:54 |
Finally, there's a special case and we may
end up adding more.
| | 04:57 |
This is an eight sided open space able
column or eight sided dome.
| | 05:02 |
That's made to attach to any other object.
Part of what we're after here in laying
| | 05:06 |
out our kit of parts is planning in
advance to avoid art fatigue.
| | 05:10 |
If we have one of every element it's gong
to look very repetitive very fast.
| | 05:14 |
And what we want to do is think about how
do we vary the nature of our world so that
| | 05:18 |
we can reuse the elements but not look
like we're using them too much.
| | 05:24 |
The other things we need here on our
legend are some player goals.
| | 05:26 |
We know we’re after things like poultry,
let’s say, spices, vegetables and so on.
| | 05:32 |
In our goal here on our Mac, we can lay
these out in colored dots.
| | 05:35 |
I’ll start out by making some vegetables.
And I’m just going to use some circles for
| | 05:40 |
these, pressing L for ellipse or circle,
and clicking and dragging down here to
| | 05:43 |
make an over-sized circle.
This would be a 200 pound pumpkin or
| | 05:48 |
something in that scale.
We're not after scale necessarily as much
| | 05:51 |
as a visual recognition of a goal here.
I'll fill it in with a color.
| | 05:55 |
In this case I'm going to use a bright
orange, and press shift x to swap
| | 05:59 |
foreground and background colors.
You can also use, any kind of bush stroke
| | 06:04 |
you'd like.
And simply lay down, some, markings that
| | 06:07 |
denote a goal.
I'll take these pieces, and hold Alt and,
| | 06:10 |
drag, and clone them.
We'll say that this goal here, is going to
| | 06:14 |
be, a vegetable goal.
So it's fairly easy to find.
| | 06:18 |
I'll select these three pieces and press
Ctrl+G to group.
| | 06:21 |
My hot keys here in Illustrator are very
straight forward.
| | 06:23 |
If you used Photoshop you can do
Illustrator.
| | 06:26 |
All of these elements are grouped.
You could either do them here in groups or
| | 06:29 |
in layers if you're working in Photoshop
to lay out the level.
| | 06:33 |
I'll say that this three part circle is my
player goal, and I'm going to take it and
| | 06:36 |
hold Alt while I drag and shift to
constrain direction to make a clone in a
| | 06:39 |
straight line.
An then I'll change the fill color on this
| | 06:44 |
to, let's say red for meats.
I'll clone it one more time here,
| | 06:48 |
selecting, holding Alt, dragging an
holding Shift to clone, an I'll change
| | 06:52 |
this color to, green, for another
vegetable.
| | 06:56 |
We can lay out our goals this way, an
this'll let us take these elements an
| | 06:58 |
position them through the map.
Here's what it looks like to start drawing
| | 07:02 |
this out.
It's very quick to do this, and I;d highly
| | 07:05 |
suggest it, because it lets you lay out
conditions and variations.
| | 07:09 |
I'm going to lay out a row of shops here.
First, I'll take my beginning shop and
| | 07:13 |
drag it down.
And then the shop that's next to it.
| | 07:16 |
I'll let them snap together, but instead
of being exactly in a straight line I'm
| | 07:20 |
going to let them skip just a little bit.
Finally, I'll pull this one back.
| | 07:24 |
What I want to think in terms of when I'm
laying out a level, are natural places for
| | 07:27 |
cover for a flare.
Cover doesn't always have to refer to
| | 07:31 |
being shot at.
What cover may mean is, in places like
| | 07:34 |
this where the wall dips in, we have an
opportunity here in the corner to position
| | 07:37 |
something the player may not have seen
initially.
| | 07:42 |
But may be a valuable find, such as a
hidden spice in a basket.
| | 07:46 |
I also want to look at ways to vary the
condition and change direction.
| | 07:50 |
What we're after in laying out our map is
to avoid a bowling alley.
| | 07:53 |
And I'll illustrate it here by Alt-cloning
these shops.
| | 07:57 |
If I clone them, and click and drag
outside of the bounding box here where my
| | 08:00 |
arrow turns to an up and down for
rotation, I'll make a hallway.
| | 08:06 |
I'll hold Shift to flip around 180
degrees, and I've got the start of a medina.
| | 08:11 |
And right here, I've created art fatigue.
What's going on is that I've got
| | 08:15 |
essentially a symmetric arrangement, or
fairly close to.
| | 08:19 |
And I've also got a clear line of sight
from one end to the other.
| | 08:22 |
What I want to think up in making these
winding suites or in any game level is,
| | 08:26 |
are there ways to limit line of sight.
So that when I'm using tricks like a
| | 08:31 |
(INAUDIBLE) culling later, only culling
which the players could see I can block
| | 08:35 |
the view without looking like an obviously
blocking.
| | 08:39 |
Here's a way around this to draw out this
level.
| | 08:41 |
I'll take this first shop and rotate it.
I don't mind that I've created an odd
| | 08:45 |
wedged space back here as we're not going
to see it.
| | 08:48 |
I'll assume that the shops will fill it in
at some point.
| | 08:51 |
Then I'll take this one and pull it back
to here.
| | 08:53 |
Now I've got a natural bend.
And I'll take my long shop, put it over
| | 08:58 |
there and rotate it into place.
I'll let this one stick out, using the
| | 09:02 |
arrow keys to just nudge back over.
And now what I'm creating, is an
| | 09:06 |
interesting hallway, a blank wall for
signage and standing here, a block line of sight.
| | 09:13 |
If we use the Line tool, accessible by
pressing slash, we can draw a line for
| | 09:17 |
line of sight from the end.
Click and drag hold shift and see where
| | 09:21 |
that line of sight ends here at the wall.
We have to turn in order to see down this
| | 09:26 |
second street we have to be over here.
And so what we're seeing simply in laying
| | 09:31 |
out the level and line of sight tools and
simple blocks is with a little variation
| | 09:35 |
we can make our market.
And create unique local interesting spaces
| | 09:40 |
for our player limiting line of sight and
adding end goals.
| | 09:44 |
I'll take the start of my medina and add
in some vegetables Alt-cloning them in
| | 09:48 |
different shops.
This will be a meat shop here, and
| | 09:52 |
finally, the small one will be a spice
shop.
| | 09:55 |
But there will be some hidden spices way
back here in the long shop that if we're
| | 09:58 |
feeling adventurous, we can go find.
These are some basic tools for laying out
| | 10:03 |
a level.
I'll lay out a few more, and then talk
| | 10:05 |
about directing a player along a path.
| | 10:08 |
| | Collapse this transcript |
| Planning the player path in a directed level| 00:00 |
I've used my market elements to build out
a section of the old corridor of this city.
| | 00:04 |
It's a place of narrow winding streets and
buildings that have been added on over time.
| | 00:09 |
So, that the front line where the front
wall of the buildings don't all quite line up.
| | 00:14 |
Then I sprinkled in my tents and maybe
pole structures, covered shops and
| | 00:18 |
extensions to the shops out in the street.
In the top left I've used my vaults here
| | 00:24 |
to build out maybe an old covered walkway,
or covered arcade starting from this
| | 00:28 |
octagonal piece and that'll be a spawn
point.
| | 00:33 |
What each of these represents for example
then, such as this square is some kind of
| | 00:37 |
growing vault, were two vaults intersect.
This let's me have transitions to spaces
| | 00:43 |
all over on the side, back and front.
I then use these starting from this
| | 00:47 |
octagon to branch out but with an eye
towards keeping it asymmetric.
| | 00:52 |
I've let these volts flow into my barrel
volt which are one way, which don't all
| | 00:56 |
quite line up and finally they empty out
into the street.
| | 01:00 |
I've taken my shops and sprinkled them
throughout making them occasionally come
| | 01:04 |
to a door.
We run down a street and there's a sliding
| | 01:07 |
door we have to go through.
And we can see another door here, which
| | 01:11 |
let's us into a tiny courtyard with two
more shops.
| | 01:14 |
We want to think when we're directing our
player in terms of their path.
| | 01:17 |
And that's what's really vital in a game.
We want the player to have a mission and
| | 01:21 |
be able to go find it and succeed on it.
Even in an open world, or a sandbox where
| | 01:26 |
everybody can simply run around, there's
usually some kind of mission available or
| | 01:30 |
direction we can put in.
What I'll do now is use my food, markers,
| | 01:35 |
to be able to plan in the player path.
This is a very small level actually.
| | 01:41 |
Although it seems like I've created quite
a few buildings.
| | 01:43 |
It's actually one big street that wraps
around a couple of small pieces.
| | 01:49 |
Here's how i'll do this.
I'm going to take my yellow, which are my
| | 01:52 |
root vegetables, my red for poultry and
green for leafy vegetables and add one
| | 01:55 |
more to them.
I'll take the red here and clone it.
| | 02:00 |
And I'm going to change that color here by
using the drop down color swatch to deep brown.
| | 02:05 |
This will be my spices and I may even get
in here.
| | 02:08 |
Press A for direct selection and pick one
of these elements and change its color.
| | 02:13 |
So, that we know that the spices are
tri-colored circles.
| | 02:16 |
We want to think when we're laying this
out in terms of a plan that overall some
| | 02:20 |
things are rare and hard to find and some
are plentiful and necessary but perhaps
| | 02:24 |
the trade off is they're bulky.
And we want to direct our player with the
| | 02:29 |
goals, which should be visible through our
way finding.
| | 02:33 |
Here's how I'll make this work.
I'm going to put the first spice in a tiny
| | 02:36 |
shop here.
And a logical place.
| | 02:39 |
If we can see a small place, maybe they
have small things and I'll tuck it in that shop.
| | 02:44 |
If I keep with the game design dock
telling about different colors, we might
| | 02:48 |
see some kind of a painting on the wall or
draped cloth with gold let's call it or
| | 02:51 |
something similar denoting space shops
tucked back in the corner.
| | 02:57 |
I'll take one other spice and tuck it
somewhere else.
| | 03:01 |
This one will be fairly in plain view
here, around the corner but we have to
| | 03:05 |
walk around to get to it.
I'll make sure when I'm positioning items
| | 03:10 |
that for things like my goals here that I
right click and choose Arrange, Bring to Front.
| | 03:15 |
This way they're visible.
Alternately, you can press F7, pull up
| | 03:18 |
your layers palette and start cutting and
pasting things on different layers.
| | 03:22 |
One of the reason I like illustrator for
game layout is that objects on the layer
| | 03:26 |
non-destructive, we can simply arrange
them front to back.
| | 03:30 |
It's like a good snapping tool and good
precision.
| | 03:33 |
I can also cut Ctrl+X, make a new layer,
and with that layer selected press Ctrl+F
| | 03:38 |
to paste in front so not to loose the
placement of the object when I paste.
| | 03:44 |
I'm going to leave this all on one layer,
so I'll just cut it back and delete that
| | 03:47 |
second and paste it back in.
Simply arranging is good enough for this layout.
| | 03:52 |
Now, I'll sprinkle the rest of my objects
through.
| | 03:54 |
We're going to tend to see things by
district a lot of times.
| | 03:58 |
So, what I'm going to do is designate in
here the first district with the tents as
| | 04:01 |
the meats district.
I'll arrange the meat marker up to the
| | 04:06 |
front and put meat in two or three shops
and one tent.
| | 04:11 |
So, in this case if we can spot where the,
let's say the red flags of the meat
| | 04:15 |
vendors are, we have a good chance of
finding a group of them and fulfilling our
| | 04:18 |
ingredient list.
This will help me direct the player here.
| | 04:24 |
Will have a list and be able to see where
the shops are.
| | 04:27 |
Now, I'll add in the basic ones.
I'll say that the veggie vendors are right
| | 04:31 |
up here in front.
And I'm going to mix in for them the green
| | 04:35 |
and my orange.
So, there are my grains and legumes as
| | 04:38 |
well as my leafy veggies.
Put these through and this way it's fairly recognizable.
| | 04:44 |
The trick to a lot of this, is putting
those goals in so that they're possibly
| | 04:48 |
tucked in places but occasionally they are
logically, commonly arranged.
| | 04:54 |
It's not often we're going to walk into a
market and find every vendor all
| | 04:57 |
completely mashed together.
In almost every market around the world,
| | 05:01 |
there are districts we'll call it within
the market.
| | 05:04 |
This is the meats area.
This is the vegetable area.
| | 05:06 |
Over here are the spice merchants.
These are where the guys selling oil hang
| | 05:09 |
out, etcetera.
And so, we want to think in those terms.
| | 05:13 |
How can we cluster it together so that the
player sequencing through from their spawn
| | 05:18 |
point can identify an area of possible
goal, satisfy a checklist let's say and
| | 05:22 |
move on.
We want to put our rare pieces in places
| | 05:27 |
that are reasonably accessible.
We shouldn't have to go digging for a shop
| | 05:32 |
like a spice vendor, but there just simply
are not as many of them as the vegetable vendor.
| | 05:37 |
And so, they can stand more on their own.
And so, we can tuck them in corners where
| | 05:42 |
the player has to navigate around.
I can place a few more of these.
| | 05:45 |
I'm going to put another quadrant of root
and vegetable vendors down here, and
| | 05:50 |
finally this will have both in it.
And then I can populate the rest of the shops.
| | 05:55 |
I probably need a marker in here for
things like pots and pans or vases or rugs
| | 05:59 |
or whatever else.
Second, in directing the player path,
| | 06:03 |
here's some things I've done.
I'm going to get a marker in for my spawn point.
| | 06:07 |
What I'll do is, underneath the ellipse
tool, fly out that tool and choose Star,
| | 06:11 |
and I'll place a star in this octagonal
shape.
| | 06:15 |
That star, which I'll make in gold, will
denote my spawn point for the player.
| | 06:20 |
And we start in the market, we show up in
the oldest part of the city, the ancient arcade.
| | 06:26 |
In directing the player, here's the things
I'm after.
| | 06:29 |
I've identified some key lines of sight
but I've blocked them so I cannot see forever.
| | 06:34 |
If we can see it, we'll want to go to it.
So, it's reasonable and this is where a
| | 06:38 |
second layer is very helpful to guide the
player by line of sight to the next thing.
| | 06:44 |
I make my line of sight here in, let's
say, a blue stroke.
| | 06:47 |
Clicking on the stroke or the square with
the open middle, and then I'll take off
| | 06:51 |
the fill by clicking on it and clicking on
the None button.
| | 06:56 |
Now, I'm working in a line with the blue
stroke.
| | 06:58 |
And I'll change the stroke size here to,
let's say, three points so it's visible.
| | 07:02 |
And on a separate layer, layer two, which
I can double-click on and name Line of
| | 07:06 |
Sight, or LOS, I'll identify key lines of
sight from the spawn point.
| | 07:12 |
We'll assume that these vaults are bounded
by some kind of walls, and so I'll need to
| | 07:15 |
navigate through.
By putting in these objects with columns
| | 07:19 |
here, shown in brown, I'm already
directing the player.
| | 07:22 |
We want to go to the open spaces.
My next line of sight here, to direct the
| | 07:26 |
player path is to that the door.
But along the way, I'm going to see the vegetables.
| | 07:31 |
If in a game, we see a long space and then
a door, that's telling us to go to the door.
| | 07:37 |
So, although in a real city we may not
have a wall with a sliding door in it.
| | 07:41 |
For my game purposes introducing this
element here, my icon for thick wall with
| | 07:45 |
an orange sliding door, we'll call it or
maybe some kind of screen, guides the
| | 07:48 |
player visually.
They can see the end of the space.
| | 07:53 |
They know where they came from and so they
want to go here.
| | 07:56 |
I'll keep going with this and we're going
to start to see this line of site split up.
| | 08:01 |
I'll press slash for line of sight again
and pick up from the door.
| | 08:05 |
We're going to see one line of sight to
the second door and into the courtyard for spices.
| | 08:10 |
Another one, we'll zip down between the
covered tents.
| | 08:13 |
This is an important one in guiding the
player.
| | 08:15 |
These orange or red Xs we'll call them
represents simply tents.
| | 08:20 |
They're open-sided with tables full of
wares in them.
| | 08:23 |
And for guiding the player then, in this
case maybe it's the preserved meats across
| | 08:27 |
the street from the fresh meats, we're
letting the player see possible things to
| | 08:32 |
interact with.
And so, even though we're seeing the side
| | 08:36 |
of a shop here, the tents tell us that we
may want to go look.
| | 08:40 |
And so by placing them in a place where we
come out of the door to see the spices,
| | 08:45 |
and we exit the spice vendor we look back
to the preserved meat vendors, we're
| | 08:49 |
guiding the player down this path.
Along the way, I've also used more
| | 08:55 |
transparent devices such as these post and
beam structures we'll call them with the
| | 08:59 |
green dots.
Some sort of more permanent wood and reed
| | 09:03 |
that guide the player again with an
element of transparency to see that there
| | 09:07 |
are shops behind.
I will keep adding my liner side to a
| | 09:11 |
place where things started to split.
One I looked down the street.
| | 09:16 |
Two I see an other courtyard ,in the
courtyard I may face a wall.
| | 09:20 |
May be some monumental columns or a
fountain and form there I have a
| | 09:24 |
possibility of making back into a shop or
into a hidden shop that is not accessible
| | 09:28 |
from main street.
And this is a neat one.
| | 09:33 |
When we're designing, we're giving an
option here to loop back.
| | 09:38 |
When we show that we can loop back,
there's more stuff to find and that adds
| | 09:41 |
an interest in the player.
Because people want to find out another
| | 09:46 |
way to do things.
And so, what I've done is to say, if you
| | 09:49 |
get into the small courtyard you'll see a
small shop where there may be things.
| | 09:53 |
You'll also see the back of a shop you may
have been in, and, entering in through the
| | 09:57 |
back of the shop might tell us that
there's something as a bonus in there.
| | 10:02 |
Anywhere I've put a doorway now, that's a
trigger for the player to say, oh, I
| | 10:05 |
should go look there, so it's possible we
want to head that way.
| | 10:10 |
It's possible we'll want to head to
another door, and finally, we're going to
| | 10:14 |
look down this long road.
And again, I'm directing the player.
| | 10:18 |
But I've introduced in another design
element to help.
| | 10:21 |
Instead of a doorway.
I've used these brown elements for, let's
| | 10:24 |
call them, mosque walls or some kind of
walled condition.
| | 10:28 |
Maybe it's an ancient walled city.
And it's visibly different.
| | 10:32 |
That, even though I don't know what these
look like yet.
| | 10:34 |
This marker of the brown wall is different
from the shops.
| | 10:38 |
And to the player that says something is
different down here.
| | 10:41 |
Change in age of the buildings, or what
people are selling.
| | 10:45 |
And so, another visible marker then, is to
change what we're seeing beyond a door.
| | 10:51 |
Did the architecture change from wood to
stone, for example.
| | 10:54 |
In all of these, I'm using these devices
to guide that player around.
| | 10:58 |
And I can line in the rest of this, and we
end up, if we loop back around here in the
| | 11:02 |
medina, almost back at the spawn point.
At the back of other shops to, maybe other
| | 11:08 |
tiny places that have things we need.
Remember this game is about becoming a
| | 11:13 |
logo in the market and not crashing around
like an ignorant tourist.
| | 11:17 |
And so, given the player the opportunities
to loop back to familiar territory while
| | 11:21 |
exploring things from a new direction and
guiding them to line of site along their
| | 11:25 |
path is important.
Most games will follow this.
| | 11:29 |
Some kind of visual clue as to where the
next area is, without simply seeing five
| | 11:33 |
miles ahead.
So, use your elements you've got, blending
| | 11:37 |
between solid walls and transparent or see
through elements, and also different
| | 11:41 |
conditions such as entries or doors to
guide that player along on the path you want.
| | 11:47 |
So, they find what you want them to be
after.
| | 11:49 |
| | Collapse this transcript |
| Bounding the world invisibly| 00:00 |
One of the big concerns when making a game
level is how to end the level.
| | 00:04 |
Not how to, declare it finished in terms
of art, or how to, reach the final goal,
| | 00:08 |
but how to bound the level, so that we
don't get stuck making, the rest of the world.
| | 00:15 |
What we want to do, is to use ways that
are naturally occurring, even in an urban
| | 00:19 |
context such as this.
To visibly bound the level,one technique
| | 00:23 |
that gets to used far too often is a giant
collider.
| | 00:27 |
A collider in a game engine, is simply an
object that defines something you cannot
| | 00:31 |
pass through.
Most objects will have collides on them
| | 00:35 |
cannot walk through a wall for an example.
Using a giant box colliders like throwing
| | 00:40 |
up a big force field, it works, but it's
perhaps not the most elegant solution
| | 00:43 |
because we don't often run into force
fields in our daily lives.
| | 00:48 |
What I've started to do here in the layout
of my level is to bound this world by the
| | 00:52 |
shops, that very quickly our player will
recognize that these shops have one way
| | 00:56 |
in, and that not being able to get any
farther than the back wall of the shop is
| | 01:00 |
an acceptable end to the level.
I've also introduced solid wall elements
| | 01:07 |
with some kind of decoration.
We can assume the they're part of a, maybe
| | 01:11 |
a larger building.
We're just seeing the back or the side of
| | 01:14 |
a and simply not an entry condition.
And finally I've created places in my
| | 01:18 |
level, where I have natural either court
yards or dead ends.
| | 01:23 |
I still have a good chunk of open areas
(UNKNOWN) especially around my (UNKNOWN) point.
| | 01:28 |
A spawn point in the game is where the
player starts.
| | 01:30 |
You may have one spawn point or multiple
spawn points depending on the game.
| | 01:34 |
For this we have one spawn point in the
oldest section of the market.
| | 01:39 |
It's a covered or vaulted structure, and
it's been built onto over time, which
| | 01:43 |
gives it it's asymetric shape, but in my
layout initially, I simply put in this
| | 01:47 |
octagonal spawn point area, put some
vaults around it, and let it go.
| | 01:53 |
And I need to think of how to bound this.
What I'll have to design eventually is
| | 01:57 |
some kind of outside to it.
Maybe the market started out in one big
| | 02:02 |
covered building to be out of the sun, and
then has since expanded out.
| | 02:06 |
I can take my shops and ring this
structure, or I can design something else
| | 02:09 |
to go around.
What I want to avoid is a large wall.
| | 02:13 |
I'll start out then, with the radial array
of shops.
| | 02:16 |
Looking at the market, stacking these
shops on.
| | 02:19 |
And, rotating by holding shift.
By doing this, I'm providing a logical
| | 02:24 |
end, plus what could be doorways or
windows on the side.
| | 02:28 |
So that I'm not completely trapping the
player in some way that's awkward.
| | 02:32 |
We want to avoid simply putting up a wall,
or capping a building.
| | 02:36 |
It's very strange to start out in the
middle of a building with no doors.
| | 02:40 |
And so we want to give our player the
opportunity to say, I can see it, but it
| | 02:44 |
is visibly closed to me and therefore I'm
okay that.
| | 02:48 |
And so by starting out with the shops
here.
| | 02:51 |
Allows me to bound this player because the
(INAUDIBLE) can be solid on the sides here
| | 02:55 |
and enter into the shop with light coming
in between, in my a symmetric arrangement
| | 02:59 |
and therefore is bounded.
Later I can vary these shops.
| | 03:05 |
I don't mind in my drawing right now that
I'm using all of one kind.
| | 03:09 |
I'm also looking for ways to make them
asymmetric.
| | 03:12 |
And right here I can see where we'll have
a couple of shops that collide and I can
| | 03:15 |
probably handle that through some extra
wall pieces or shortening one.
| | 03:19 |
Now I need to think about at the end here
what happened, and this is probably a
| | 03:22 |
place I can simply wall it off, it's been
expanded and built onto and we're okay
| | 03:26 |
with that.
I'll take one larger shop and finish this out.
| | 03:31 |
And I'm actively thinking through bounding
this level.
| | 03:35 |
I'm going to make this shop larger here,
where the door actually extends past the
| | 03:38 |
vault as if it were built later.
And I'll have some wall elements that I
| | 03:42 |
can use to patch that in.
In other parts of my level then, I've
| | 03:46 |
bounded that level using the existing
geometry.
| | 03:49 |
Up here the in the spice courtyard/g,
we'll call it, the door enters into what
| | 03:52 |
is visibly a closed courtyard where I can
just see the sky over the top.
| | 03:56 |
There is a space here, but eventually I'll
probably fill that with a wall element so
| | 04:00 |
I'm not overly concerned.
The ended line of sight here denotes that
| | 04:04 |
I cannot go farther out.
And so I'm bounding that world.
| | 04:09 |
There's simply a limit to how how far we
can go.
| | 04:11 |
I've put my tents, shown as red x's,
against the side of an old building.
| | 04:15 |
Maybe it was another market, or something
similar, and it's simply a decorated wall
| | 04:20 |
we cannot get past.
If we're in a place where we can see a
| | 04:23 |
wall, and the sky above, we're okay with
not seeing further.
| | 04:27 |
The same goes in our level for mountains.
We simply cannot pass over or we cannot go
| | 04:32 |
farther than the cliff for example.
As long as we can see that there is the
| | 04:36 |
sky let's say, and a visible condition we
cannot pass, we are bounding our world.
| | 04:42 |
I've also said in a couple of conditions
here to possibly bound the world.
| | 04:46 |
These doors may simply be locked.
We can get to them but they are not set
| | 04:50 |
with triggers, and we may need to collect
something or find some way to pay our way
| | 04:53 |
through for example.
We made need to get all of the ingredients
| | 04:58 |
in one area before these open.
And so, another way to bound the world is
| | 05:02 |
with a device like these that allow the
player to see it and have a goal.
| | 05:08 |
But, have to unlock to level up, we'll
call it.
| | 05:11 |
It also allows us then, beyond these
doors, to load in another level.
| | 05:16 |
We can do this at will, so that by the
time we reach the doors and trigger them,
| | 05:19 |
the next level is loading, so it doesn't
have to load immediately.
| | 05:23 |
My level is fairly bounded, I'm thinking
through the possibilities where I have
| | 05:26 |
line of sight and not an obvious giant
wall simply stopping the player arbitrarily.
| | 05:32 |
I want to make sure that, within this
context, I am stopping the player,
| | 05:36 |
limiting the area they can run around by
things that would naturally occur there.
| | 05:42 |
Things that look like they should be
there, we simply cannot get past.
| | 05:46 |
And that's an important technique in
games.
| | 05:48 |
We can also use things like an impassable
forest with falling trees, rushing rivers,
| | 05:52 |
or bodies of water, and we simply cannot
go into them.
| | 05:57 |
It's obvious that we cannot get in there,
and so we accept it.
| | 06:01 |
What thinking through the bounding does
for us, then, is allow us to make a finite
| | 06:04 |
kit of parts and not have to generate the
rest of the world.
| | 06:09 |
At some point we will simply make too much
world for our game engine and so we need
| | 06:13 |
to actively think how to make less world
while still feeling like the player is unbounded.
| | 06:20 |
| | Collapse this transcript |
| Sharing the sandbox: Laying out an open world| 00:00 |
When we're designing our game level, we
want to think about if it's a directed
| | 00:04 |
level or a sandbox, and is there a mix
going on?
| | 00:07 |
A sandbox for us is an open world, where
the world appears to function whether
| | 00:11 |
we're there or not.
And may provide us with either side quests
| | 00:15 |
or deeper explorations in addition to the
main missions in the game.
| | 00:19 |
I'll zoom in and inspect my world for
anything obviously missing.
| | 00:23 |
What I'm going to do is take this document
into Photoshop, and rasterize it as a set resolution.
| | 00:30 |
I'll export that image out as a texture.
Making a TIF that I can bring straight
| | 00:34 |
into unity and map onto a plane to put my
first person controller in.
| | 00:39 |
This way I can visually assess the
distances here and say, do I need more
| | 00:42 |
world in my sandbox or not?
There's a lot of games that use the idea
| | 00:47 |
of a sandbox where it's an open world we
can simply run around as we need.
| | 00:51 |
SkyRim for example is famous for this, you
can get quite good at making cheese for example.
| | 00:57 |
Grand Theft Auto is another good example
where it's very possible to go simply sit
| | 01:00 |
and watch TV and soak up what's on.
This is different from any games which are
| | 01:05 |
very mission oriented that to really
experience the full game play.
| | 01:09 |
The player should probably play all the
way through from start to end and finish
| | 01:12 |
the game.
This is also why games like World of War
| | 01:16 |
Craft keep people coming back that there's
so much of an open world here that there's
| | 01:19 |
always something new to explore.
My world seems pretty good.
| | 01:24 |
I think I've got enough elements in here
and so I'll turn off my Line of Sight
| | 01:28 |
layer and save this document out.
I'll save it as 0104 map sandbox n.
| | 01:33 |
And then open that up in Photoshop to
rasterize it.
| | 01:37 |
Here in Photoshop, I can open a native
Illustrator document through PDF.
| | 01:41 |
The reason I'm going to do this is to
specify it to come in at a distinct size.
| | 01:45 |
And also, for a bit of cropping and
lighting information.
| | 01:49 |
I'll choose File and Open and go pick that
Illustrator document from the exercise
| | 01:52 |
folder for Chapter One.
I'll pick my End file.
| | 01:56 |
When Photoshop opens vector based imagery
from Illustrator for example it imports it
| | 02:00 |
via PDF.
What we can say in this how would we like
| | 02:03 |
it to come in and what are we cropping to.
In this case cropping to the bounding box
| | 02:08 |
of the art.
Which clips that document around the art
| | 02:11 |
I've created.
I'm going to bring it in at a size of
| | 02:16 |
4,096 by, it ends up being 3736 at 72 dpi.
I'll make sure those sizes show up
| | 02:24 |
correctly before I click OK.
I can ignore the color mode for the moment
| | 02:27 |
as I'm not color managing and eight bit
depth is fine.
| | 02:31 |
I will click OK, and I will get my
document in and to (UNKNOWN) at 4096, and
| | 02:36 |
looking fairly good from out.
When the document comes in, it comes in clear.
| | 02:41 |
The white background in illustrator is
always there, it's the paper, and so
| | 02:45 |
anything we are drawing is clear, whether
or not objects.
| | 02:49 |
I am going to put another layer under
this.
| | 02:52 |
Making a new layer, and dragging it
underneath in the Layers palette.
| | 02:55 |
Then I'll set my foreground color to a
sandy tan.
| | 02:58 |
This'll be either, let's say, stone, or
sand road, or anything in that range.
| | 03:03 |
I'll fill that layer in, and maybe adjust
it slightly so my pieces read.
| | 03:09 |
It's also good at this opportunity to
maybe gray scale, or change the blending
| | 03:12 |
mode of the market so it's a little more
visible.
| | 03:16 |
I'll take mine and just adjust its
luminance by pressing Ctrl + U and pull it
| | 03:20 |
down this way my walls read nicely.
I don't really care about their color as
| | 03:26 |
long as I can see them ,now I'll see this
document and make sure that I will press
| | 03:30 |
control Alt + C for canvas size align.
My canvas anchor in the top left and the
| | 03:37 |
change the width over here to pixels I'm
going to put the height at 4,096.
| | 03:42 |
I'll make sure the width is 4,096 as well.
And now when I bring this in I can map it
| | 03:48 |
on a giant square plane in Unity, and
simply scale uniformly to match a
| | 03:51 |
designated size.
I'll click OK and press Control +0 to zoom
| | 03:56 |
out making sure I click on my layer too
and fill in with the rest of my sand.
| | 04:02 |
As my level is bounded by the shops and
wandering medinas, I feel okay with some
| | 04:05 |
of these touching the edge of the texture.
Now I'll save this out.
| | 04:10 |
Pressing Control + Shift S for Save As.
I'll save it as a TIFF, and turn off
| | 04:14 |
layers, there's no alpha channel, and I
don't need layers in it.
| | 04:18 |
It's a flattened document.
I'll click OK in the TIFF options and pull
| | 04:22 |
up Unity, where I'll start a new project
to bring this in.
| | 04:25 |
When Unity starts up, it looks for a
project.
| | 04:28 |
It works in a project structure, so you
can keep all of your game assets and
| | 04:32 |
pieces together.
The starting project is in my documents.
| | 04:37 |
And I'll go through and create a new
project with the pieces I need to test out
| | 04:40 |
my sandbox.
First I'll choose File and New Project
| | 04:43 |
from the menu.
In the New Project, I'll browse to my
| | 04:47 |
exercise files folder and create a new
working project.
| | 04:52 |
I'll click Browse in the Chapter One
folder I'll need to create a new folder to
| | 04:56 |
create the project in.
Unity looks for a folder in order to make
| | 05:00 |
the folders' needs.
I'll click on New Folder and I'll name
| | 05:04 |
this one 01_04_Sandbox.
This may not be the actual working Unity
| | 05:09 |
project and actually for this kind of a
prototype it's okay to keep them separate.
| | 05:14 |
This way we can keep our finished pieces
or our working Lightbox pieces in a
| | 05:17 |
separate project for easy organization.
So this is really kind of a scratch or
| | 05:22 |
working unity project for testing this.
Double click on that folder and click
| | 05:27 |
Select folder'.
In here the pieces I need to bring in are
| | 05:30 |
my character controllers and, well that's
really it.
| | 05:35 |
We could bring in scripts and sky boxes if
we'd like just to be able to test or we
| | 05:38 |
can always go in and import them later.
There's not much else we need.
| | 05:43 |
We don't need any of the standard assets,
or Direct X, or water or anything.
| | 05:47 |
So I'll click create and Unity will make
this project and reopen showing that
| | 05:50 |
project and the structure.
Unity has opened my project.
| | 05:54 |
I'll turn off the welcome screen, and now
I'm going to put my TIFF into the assets here.
| | 05:59 |
There's two ways to bring this in.
The first is by simply right clicking and
| | 06:03 |
choosing Import New Asset.
Or you can drag and drop it in a file
| | 06:08 |
explorer into the Assets folder.
I'll just import a new asset here.
| | 06:12 |
It looks to my Unity project to start, so
I'll go up one directory and pic that TIFF
| | 06:16 |
and click Import.
There's that image and I need to get it
| | 06:20 |
onto a plane.
What it says when I import this in, is
| | 06:23 |
there's a maximum size which defaults to
1024 square.
| | 06:26 |
I'm going to upside this and make it 4096.
As I really don't care about performance
| | 06:32 |
and it's just going to be one image on a
plane.
| | 06:34 |
I just want to look around, I'll click
Apply and it'll take a second, and then
| | 06:38 |
register down in the preview the size of
it.
| | 06:41 |
It's a 10 meg document.
That's fine, for this particular test map,
| | 06:45 |
now I'll create a plane, choosing Game
object, create other and plane.
| | 06:50 |
I'll take this plane and put a material on
it.
| | 06:54 |
Right now it's just a great plane and so
I'll right-click in assets and choose
| | 06:58 |
Create Material.
I'll name this new material, calling it Map.
| | 07:04 |
In map then, I'll take this texture and
drag it across to the texture box, and
| | 07:07 |
then pull the map material onto my plane.
Now I need to get the size right to test
| | 07:13 |
this out.
When I start out in Unity, I have a couple
| | 07:16 |
of things that will help guide me in size.
Under assets, there's our standard assets.
| | 07:21 |
And we can look at our character
controllers as a size measurement.
| | 07:25 |
Here in character controllers, I have a
first and a third person.
| | 07:28 |
I'll take my first person controller, and
drop it on the map.
| | 07:32 |
Right now, I'm fairly giant.
The first person controller is two meters tall.
| | 07:36 |
So what we want to do with this is gauge
two meters and also gauge by the size of a cube.
| | 07:42 |
Choosing Create >Create Other, and cube.
Cubes start out at 1 meter squared.
| | 07:48 |
So if I take this cube and scale it out,
assuming a meter size for one of my shops,
| | 07:51 |
and then scale the plane to match.
I'll get a pretty good rough measurement.
| | 07:55 |
There is all kinds of ways to do this, the
alternative would be to take this texture
| | 08:00 |
or the pieces into Maya I would say.
Map them on the plains at distinct sizes
| | 08:05 |
and bring those across in a Unity to have
unique elements to lay out this plan in
| | 08:09 |
Flat view here in Unity.
What I will do is assume that in my shops
| | 08:14 |
here my smaller shop is four meters on a
side.
| | 08:18 |
Or that my host and beam structures here
are three by three meters as a gauge.
| | 08:23 |
I'll put the scale of my cube at three,
three, and three.
| | 08:27 |
Zoom out, I have a giant cube.
And now, if I pick my plain and scale it
| | 08:31 |
by pressing r, I can gauge the size of
those pieces relative to the cube.
| | 08:37 |
I'll pick it, and move that cube over.
Making sure I grab the cube here and
| | 08:41 |
pulling it into place.
It doesn't have to be exact, but I can see
| | 08:43 |
I've got a good bit of scale to do.
I'll take this, and try a scale of 8,8 and
| | 08:48 |
8, making sure I scale uniformly.
Now when I pick the cube and pull it in,
| | 08:53 |
I'm probably pretty close.
Maybe just a little bit bigger.
| | 08:57 |
It's okay to experiment with it a little
bit making sure you get it right and scale
| | 09:00 |
is important in the beginning.
This is pretty good, so scaling up the
| | 09:05 |
plane to a scale of 9 actually comes out
with a 3 meter box fitting roughly on to
| | 09:10 |
those covered areas.
So this is a good gauge for the size of things.
| | 09:16 |
There's my, well at least part of my
Medina, an there's that player controller.
| | 09:22 |
I'll delete this measuring queue, and
I'll, play this and see what it looks like.
| | 09:26 |
When I click the Player Controller, and
click the Play button, I'll be in my game.
| | 09:30 |
An what I'll do to test this is go to the
game window, and choose Maximize On Play.
| | 09:35 |
It's also a little dark, so I may want to
put in a little bit of Light in here.
| | 09:39 |
As an alternate before I play it, 'cuz I
can preview it here in the game window, I
| | 09:43 |
may want in my assets to pick this
material and change its type.
| | 09:48 |
Instead of a Diffuse shader, I'm going to
make it an Unlit Texture, and this way,
| | 09:51 |
when I look in the game, it's just a flat
color, and it's a greate way to gauge how
| | 09:55 |
I'm doing.
I'll click Play after I place the player
| | 09:59 |
in the spawn point.
Selecting the player controller and moving
| | 10:03 |
it into the right position.
When I click Play unfortunately I fall
| | 10:07 |
through the (UNKNOWN) and the reason is
I'm either through there or missing an
| | 10:10 |
mesh collider.
We need to make sure that two things are
| | 10:13 |
going on.
One, the player is slightly higher than
| | 10:16 |
the ground to begin and two, that this
object has a mesh collider on him.
| | 10:22 |
It looks like it's got a mesh collider to
begin with, but if we're falling through
| | 10:26 |
the world we can always delete this
collider and add a new one on.
| | 10:31 |
Right clicking and choosing Remove
Component and now with the plane selected
| | 10:35 |
choosing Components > Physics > Mesh
Collider, or Box Collider works nicely.
| | 10:40 |
I'll put it in as a box and try again.
Now its working.
| | 10:44 |
I start out spawning on the star here and
I can see the size of my shops involved
| | 10:48 |
surround me.
There is a little bit of blur just from
| | 10:52 |
the settings in the camera.
I am going to maximize this on play making
| | 10:55 |
sure in the game tab by click maximize on
play and pushing play again.
| | 11:01 |
Now I've got my game.
And I can see the relative size of things.
| | 11:05 |
I've got vaults here and, small shops.
Turning around I've got a, good lay of the land.
| | 11:10 |
I can see where I spawned and, start to
navigate through.
| | 11:14 |
And I'm going to test out my world a
little bit.
| | 11:16 |
I don't mind if I accidentally cross
geometry, but I can see very readily I've
| | 11:19 |
got a good line of sight.
Down here in the distance, right there
| | 11:24 |
where the mouse is, is that first door and
I've got stores I can see a little bit
| | 11:27 |
into on the sides as I navigate through
the winding streets.
| | 11:32 |
It also feels like I've got places to
explore because there's things tucked in
| | 11:36 |
here and places I can't see readily.
The whole world isn't revealed to me right
| | 11:41 |
away and this is good.
I'll go through my sliding door and
| | 11:44 |
already pressing to back up.
When I hit the door I can see another door
| | 11:49 |
ahead and so I should probably go look.
Here's the second one with the spice
| | 11:53 |
courtyard and the scale of the place is
working.
| | 11:55 |
I'm definitely directed and I can see all
the places that are revealed as I travel
| | 12:00 |
through the market.
My design is good although already I can
| | 12:05 |
feel it's a little small.
That if I can run around this quickly, I
| | 12:09 |
probably need to add more medinas on.
More winding sukes and small streets in
| | 12:15 |
here that, probably doubling the size of
this, is a reasonable proposition to be
| | 12:19 |
able to make enough world to run around.
Because I was able to zip around fairly quickly.
| | 12:25 |
We can see in here how the design of an
open world in sandbox needs to feel big
| | 12:29 |
enough that we are unbounded and I ran
around quick.
| | 12:33 |
So, that tells me I need to add more to my
map and do this test again.
| | 12:37 |
I'll do this and try to get it nailed
before I start making my elements and
| | 12:40 |
planning out my other pieces.
So, I have a good idea of when I'm running
| | 12:44 |
around this place how much will I need.
The other important point is to make sure
| | 12:48 |
we look up.
We can see in here even in a slightly
| | 12:51 |
blurry view that our lines are sider good
but we definitely need more pieces.
| | 12:55 |
And how much of the game as we're looking
down the street we'll show the sky versus
| | 12:58 |
showing buildings is an important one to
think about.
| | 13:02 |
So I mulled over on making more math and
doing this test again.
| | 13:05 |
And then I'll jump into making moderate
pieces and planning them out to actually
| | 13:09 |
make my game 3D.
| | 13:11 |
| | Collapse this transcript |
|
|
2. Designing the Building BlocksPlanning atlas textures and a modular approach| 00:00 |
When we're planning our game level, a
modular approach is a terrific one to take
| | 00:03 |
in an environment like this.
In many games, there is a fixed number of
| | 00:08 |
parts to make the actual game environment
and even a kit of parts for the characters.
| | 00:14 |
What this lets us do is make some
economies for draw calls.
| | 00:18 |
A Draw Call is one call or request for the
graphics engine to display something on screen.
| | 00:24 |
The more draw calls you have the slower
your frame rate gets, and we want our
| | 00:28 |
frame rate high so our player plays
smoothly.
| | 00:31 |
Additionally, certain platforms may have
stiff restrictions on the number of draw
| | 00:35 |
calls they can have.
An Xbox may top out of the thousand and a
| | 00:39 |
mobile platform such as a phone may be
much much lower.
| | 00:43 |
So any chance to reduce the number of draw
calls we can take we should.
| | 00:48 |
We need to look at the reference imagery
of what we're making and it'll suggest
| | 00:51 |
some obvious places to economize on
textures and planning.
| | 00:55 |
I'll start out by previewing the top left
image, 92681260, and looking for things
| | 01:00 |
that are obvious textures I probably want
to repeat in my planning.
| | 01:05 |
This is the shot of a Street in Marrakech.
And it's fairly typical.
| | 01:10 |
There's a mix of construction in here.
Some covered places and an archway at the end.
| | 01:15 |
Some doors that are closed and barred, and
stoops that are raised slightly.
| | 01:19 |
The textures vary.
A lot of the brick has been plastered over
| | 01:22 |
and then painted after that so that the
texture shows through of the brick where
| | 01:26 |
the plaster is worn away.
The doors are made of wood and possibly
| | 01:30 |
metal, and there's also some awnings
overhead.
| | 01:33 |
This is a great inspiration for a modular
approach.
| | 01:36 |
We're going to need sections of wall like
this one here, where the brick is showing
| | 01:40 |
and can be repeated or used in multiple
places.
| | 01:43 |
These are good examples of modular doors
with a couple of sets of beat up wooden or
| | 01:47 |
metal doors we can clone them across the
city.
| | 01:51 |
We can also use a modular approach for
tiling texture or similar like on the
| | 01:54 |
cobble stone road here.
If we craft it well enough, we should be
| | 01:58 |
able to just repeat it along our Medinus.
This arch is an other good example we see
| | 02:03 |
this kind of arch in numerous reference
photos and so if we can replicate this
| | 02:07 |
around we stand a chance of batching one
arch and thereby reducing our draw calls.
| | 02:13 |
This is another good example.
Again we have a floor texture that, really
| | 02:16 |
is a good candidate for a modular or
repetitive approach.
| | 02:20 |
And a plastered over architecture, where
they've made walls out of brick or stone,
| | 02:23 |
and plastered them, and possibly painted
at some point.
| | 02:28 |
There's lot of decay and chipped paint,
and that kind of thing, where the wall is
| | 02:31 |
just showing its age, which is good.
And as long as we allow for a large enough
| | 02:36 |
section of chipped wall, we can reuse it.
The same goes for the arches, and even the
| | 02:41 |
lights here that have been added it after
the fact.
| | 02:43 |
Making one and cloning it will save us
draw calls, and it's a great way to think
| | 02:46 |
it through.
We will need things in our market like
| | 02:49 |
vegetables here.
This is somebody selling vegetables on the
| | 02:52 |
side of the road.
And so we're going to need textures in our
| | 02:56 |
texture sheets for just props.
They're probably an onion texture, an
| | 03:00 |
apple texture, a lettuce texture that we
can simply put on multiple objects, make a
| | 03:03 |
couple of instances of these vegetables
and re-use them.
| | 03:08 |
Beyond that, the wall behind is a great
place for a module and texture.
| | 03:11 |
It's a rough, grey plaster with a dirt on
it.
| | 03:15 |
And we even have some horizontal lines
along it, right here over the apples.
| | 03:19 |
That allow us to link the textures, or let
them span across surfaces.
| | 03:23 |
They're comparatively uniform, and so if
we have a large enough section of this
| | 03:26 |
substance, we can reuse it across walls in
our medina.
| | 03:31 |
This shop is a bit harder.
We've got the hanging gourds and
| | 03:33 |
decorative items, and then baskets and
bags full of different beans and spices.
| | 03:39 |
This does suggest though, that if we make
a few of these bags with different colors,
| | 03:42 |
we can clone an use them in multiple
shops, as there seem to be a lot of em
| | 03:45 |
here, an this is probably not the only
shop.
| | 03:49 |
The archway here is another good
candidate.
| | 03:51 |
We probably will see this kind of arch,
either a round arch, or a pointed one, in
| | 03:55 |
multiple places, an even two of different
arches, on the same shops.
| | 04:01 |
And so if we can make enough of these,
let's say four or five, we can reuse them
| | 04:05 |
and thereby extend our modular approach
and reduce our draw calls.
| | 04:10 |
The same goes for the low benches.
It's really one bench of different heights.
| | 04:15 |
Slightly taller on the right, slightly
shorter on the left, all in kind of a
| | 04:18 |
dingy blue paint and with roughly the same
design.
| | 04:22 |
This is a more elaborate market place and
again we can see the modular approach.
| | 04:26 |
It's really one lantern, one vault, one
screen, and one post.
| | 04:30 |
And so if we plan in a good section of
wood texture we can reuse it on a bunch of
| | 04:34 |
these elements.
The same goes for the lattice work above
| | 04:37 |
and the lanterns.
We'll probably going to see kind of
| | 04:40 |
punched metal in a lot of places, so if we
have a large section of it we should be
| | 04:43 |
able to really use it.
When we get into detail like this, it gets
| | 04:47 |
more difficult, as each of these hats gets
more and more unique.
| | 04:51 |
But we should probably plan for a section
of fabrics in our texture's sheet.
| | 04:54 |
We can reuse for market wares.
In this last image, we can see a good
| | 04:58 |
example of more modular pieces.
In this case there's repetitive overhead
| | 05:03 |
lamps and a lot of the same plastered over
wall, almost the same color.
| | 05:08 |
By looking at this reference we've got
some verification that if we make a good
| | 05:11 |
chunk of dirtier sand colored plaster we
can reuse it a lot of our market.
| | 05:17 |
And beyond we can see the buildings and
that tower and see the same colors.
| | 05:22 |
That's a good indicator that a lot of the
construction is native meaning that it is
| | 05:26 |
very local in material and therefore a lot
of this is going to have the same hues and
| | 05:30 |
same methods.
It's a great way to think it through in a
| | 05:35 |
modular approach, because if we can have
unique but similar construction, it's
| | 05:39 |
going to flow together in the whole city.
Here's one more example of an arch, and
| | 05:44 |
this image is really great.
The reason is not just the ornate doors in
| | 05:48 |
the arch and the visual depth in here, But
they were seen this kind of an arch in a
| | 05:52 |
very common scenario.
It simply an arch in front of some doors.
| | 05:58 |
What that can suggest to us as game
designers looking to make a kid of parts
| | 06:01 |
is that if we make one or two of these
arches and with their doors or maybe as
| | 06:05 |
doors we can add on to it.
We're generating multiple conditions from
| | 06:10 |
one set of geometry, arch with doors, arch
without doors.
| | 06:14 |
That's two different, geometries we can
put in.
| | 06:18 |
If we vary the texture once, we have four
different geometries.
| | 06:22 |
An we can use this to define our level, an
either bound our player or, show them
| | 06:25 |
where to go; keeping in mind that if we,
see doors we tend to want to head to them.
| | 06:31 |
In the basic layouts than in the modules,
we've put in the start of modular approach
| | 06:35 |
we can see in here that there's a fixed
number of parts we started with.
| | 06:40 |
And so if we plan our map laying out our
modular approach from the beginning
| | 06:44 |
instead of trying to draw it all one off
or one at a time, we get an optimized
| | 06:47 |
scene where we were having to build in the
flexibility of placement with a fix kit of parts.
| | 06:55 |
What I can also do in planning my textures
is look at the layout of my map and assess
| | 06:59 |
the longest run of any given texture this
section here with the over head canopies
| | 07:03 |
and long wall is probably the longest run
of my texture with the longest actual run
| | 07:06 |
of it being the paving.
I might want to vary the paving or plan in
| | 07:12 |
my texture some kind of break.
Let's say right across there a band of
| | 07:17 |
some sort of texture.
So what I'll do is on a new layer here in
| | 07:22 |
Illustrator plan in some additional
elements to see how this works.
| | 07:27 |
I'll press B for brush, I'll press X to
pull up the fill, and the forward slash to
| | 07:30 |
delete it.
Now, when I paint, I'm just working in a
| | 07:33 |
black stroke.
And I'm going to make this a little more
| | 07:36 |
eye friendly color.
Let's say I'll work in deep brown and
| | 07:40 |
increase the stroke weight to something
wider.
| | 07:44 |
Here's a 14 point stroke.
So, when I click and drag to paint, I get
| | 07:47 |
a wider stroke, and I may want to go even
bigger.
| | 07:51 |
I'll change my brush as well, going to a 5
point round to something larger, maybe
| | 07:54 |
even using some kind of graphic
representation such as a streak here.
| | 07:58 |
I'll go larger in this stroke weight,
maybe up to 7 and drag across this stroke
| | 08:02 |
to denote paving.
It's okay it's kind of streaky.
| | 08:06 |
It's really just saying we're going to put
a break in the paving here.
| | 08:10 |
And this is a visual indicator as to where
that break will occur looking for any long
| | 08:14 |
runs here and places to bridge across so I
can break up my modular texture in my
| | 08:18 |
paving and not have to create an entire
street worth.
| | 08:24 |
It'll also reduce the risk of seeing how
that texture tiles if I can visually break
| | 08:28 |
up both direction and the amount of
texture on any one polygon.
| | 08:33 |
What I'll do is a final step in planning
my atlas texture.
| | 08:36 |
And an atlas texture is, one texture
loaded for the whole level, is to look at
| | 08:40 |
the conditions I've got, the reference
imagery, and the longest span, and rough
| | 08:44 |
out at least, on a square texture.
Where things will be.
| | 08:50 |
I'll start it out right here in my map,
scrolling down to an empty section.
| | 08:54 |
And what I'll do is press M for rectangle.
I'll click once, and draw in a rectangle.
| | 09:01 |
I'm going to make the width of this
rectangle full size.
| | 09:05 |
We'll go with 2048 by 2048.
I'll do this by clicking OK.
| | 09:11 |
And then move this rectangle into the
blank space here in my map.
| | 09:16 |
I'm going to cut it and paste it onto
another layer, which is pretty straightforward.
| | 09:19 |
Pressing Ctrl+X, making a new layer, and
Ctrl+F.
| | 09:23 |
Now, I'll lock my other layers, and start
drawing in my texture.
| | 09:26 |
We typically want our textures to be
square, although we can make them
| | 09:29 |
non-square if we'd like, using more of a
strip where textures are meant to tile
| | 09:33 |
horizontally, but not vertically.
I'll run with the square initially, and
| | 09:38 |
I'll start laying out some pieces.
What I'll begin with is a large section
| | 09:42 |
down here of tan wall.
I'll flip the colors by pressing Shift+X,
| | 09:47 |
and then I'll start to line in other
elements.
| | 09:50 |
This is going to be my wall, and I know I
need a section in here of paving, which
| | 09:53 |
I'm going to lay in here in something
different.
| | 09:57 |
I'll put this is in as a light tan and
then I'll do one more section here for my
| | 10:01 |
other parts.
This one, and I'll come back and label
| | 10:05 |
these, is going to get a deeper color, and
this will either be 1 more paving or a
| | 10:08 |
variation in wall.
So most of my texture space is actually
| | 10:12 |
taken up with rough plaster and paving,
we'll call it.
| | 10:16 |
Now, I'll start to put in other areas,
thinking about whether they go horizontal
| | 10:19 |
or vertical.
I'm going to need a section of wood.
| | 10:23 |
And so I'm going to put it in right here,
and I'll make this a brown.
| | 10:26 |
I'm also going to need sections of props.
And I'm going to lap them together by
| | 10:30 |
landing in some rectangles.
I'll put the colors for these using
| | 10:34 |
instead my swatches or color palette in
greens and reds and oranges for all of my foods.
| | 10:40 |
Although it's comparatively large, in this
case we're dealing in maybe 12 or 14 feet
| | 10:45 |
of wood and an enormous amount of spices.
Remember that I'm laying out a texture and
| | 10:51 |
taking into account how close I can get to
things.
| | 10:53 |
I can get fairly close to the wall and I
stand a chance of a long run which is why
| | 10:57 |
I visually identified with this large
brown down below.
| | 11:02 |
I'm going to let my paving repeat, so I'm
planning that the polygons will breakup
| | 11:05 |
that texture, and so it's not quite as
much area.
| | 11:08 |
Things like the foodstuffs and general
market wearers, are comparatively big in
| | 11:12 |
the texture, because I stand a good chance
of getting close to these items, and
| | 11:15 |
they're some of the key items in the game.
I'll probably end up needing two sections
| | 11:20 |
of these.
An so this clone here, will let me know
| | 11:23 |
that, I need, multiple sections of, we'll
call them market items.
| | 11:28 |
I'm simply marking it out with a color.
So when I get in here an start to, put in
| | 11:31 |
the actual texture, I can see the
proportion an test it out.
| | 11:35 |
I can also try some test unwrapping, an
using this in a prototype, with just the
| | 11:39 |
color, or even a checkered grid, marking
out where things go.
| | 11:43 |
This last section then, will probably end
up being fabrics.
| | 11:47 |
And I'm going to make them a little bit
bigger.
| | 11:49 |
Here's one in orange, and, one in a
slightly different color.
| | 11:53 |
The trick is to label these.
And then think through, did I catch everything?
| | 11:57 |
Looking back at the reference imagery, if
needed.
| | 11:59 |
I'll put some text on.
And I'll have a rough layout for my
| | 12:02 |
texture sheet.
I've made another layer, pressing F7 to go
| | 12:05 |
to the layers palette.
And making a new layer with the button
| | 12:08 |
down at the bottom.
Now, I'll press T for text, and land in
| | 12:12 |
just text so I'll have a rough idea of
what these are.
| | 12:15 |
I'll call this Stone.
Pressing Esc, right-clicking, and bringing
| | 12:20 |
up the size.
I'll name the next one Paving and hit Esc,
| | 12:24 |
and finally down here we'll see plaster.
This will be Wood, and I'll put in MS for
| | 12:30 |
Market Stuff 1.
I can alt clone text just like any other object.
| | 12:36 |
And I'll alt clone these down and maybe
even change the number.
| | 12:40 |
We can just simply clone that text across.
It's good enough to know it's market stuff
| | 12:44 |
and we'll borrow this for one more piece
here or just name these fabric.
| | 12:50 |
This way with big sections of fabric with
elaborate patterns I probably have enough
| | 12:53 |
texture to handle some rugs if I need when
I combine them together.
| | 12:58 |
I may end up with a separate texture sheet
just for market wares as opposed to the
| | 13:01 |
environment, because I can already see
that I need to take into account metals
| | 13:04 |
and tile.
And so, it's worth kind of visually
| | 13:08 |
thinking through the texture sheet in
advance, and planning out what you need,
| | 13:11 |
versus realizing you're missing the basket
section along the way.
| | 13:16 |
| | Collapse this transcript |
| Defining player scale and field of view| 00:00 |
A big consideration when constructing the
level, is the size and field of view of
| | 00:04 |
the player controller.
We need to think about is, who are we?
| | 00:09 |
Because we're asking the player to immerse
themselves in this game.
| | 00:11 |
We need to think about how we are
presenting our game to them, from our camera.
| | 00:17 |
An image like this in the reference is
good for reference as to how to build.
| | 00:21 |
We get a good idea of the pointed arch,
the way it's trimmed and how they've
| | 00:24 |
inserted a screen up above in this
doorway, we'll call it.
| | 00:28 |
This is not a good image for judging
height, because we can't tell how tall it
| | 00:31 |
is off the ground.
But it is a good image for judging our
| | 00:34 |
field of view, because we need to be able
to look up and take in the detail, the
| | 00:38 |
immersion in this faraway land.
This is a better image for judging the height.
| | 00:45 |
There's a lady walking down the street,
and assuming she is give or take average
| | 00:48 |
height, somewhere between five and six
feet tall is reasonable, we get a good
| | 00:52 |
idea of the size of the street.
And the field of view we need.
| | 00:57 |
When we're standing in a street, and this
is a narrow street, if she is even five
| | 01:00 |
feet tall, this street is barely five
wide.
| | 01:03 |
We know that we're going to end up looking
up a lot more than we are looking to the
| | 01:07 |
side, because our view is simply bounded.
What we should do is play with the field
| | 01:12 |
of view.
A wider field of view is actually going to
| | 01:15 |
make the street feel deeper, and reinforce
the long, narrow feel we're after.
| | 01:20 |
This image of these clay pots and bowls,
is good for telling us how close we're
| | 01:24 |
going to get.
That quite possibly in any or all of our
| | 01:28 |
shops, we're going to get right up to the
wares on display and take in the detail.
| | 01:33 |
Now aside from a lot texture work to get
these looking right, we need to make sure
| | 01:37 |
that our camera supports this wide, yet
very close view.
| | 01:42 |
This is another indicator of what are
going to see, is very possible in some of
| | 01:46 |
our scene especially on some of the wider
streets, wider is relative we can stand
| | 01:50 |
back and see up at least two stories.
And in this case see the rugs that his
| | 01:57 |
merchant has draped over to show them.
Again, we need to have a wide field of
| | 02:02 |
view, so that we feel like we are able to
see and take in all of this rich world.
| | 02:07 |
And also give us a little bit of depth.
We can tell that this is shot with a
| | 02:11 |
little bit wider lens, as the perspective
lines really spread from left to right and
| | 02:15 |
almost fisheye at the top.
There's a good indicator of height here in
| | 02:20 |
the bottom right and this motorbike, give
or take at two and a half feet tall or so,
| | 02:25 |
tells us that roughly, this line where
hanging the rigs is, we'll call it 9 or 10 feet.
| | 02:32 |
That means the whole building is somewhere
in the 20 range, giving us a good idea of
| | 02:35 |
what wee need to be able to see.
This image is a good indicator of
| | 02:39 |
architecture, but not necessarily height.
But it does tell us, in a wider street,
| | 02:44 |
how much we should take in.
The lady in this view is not standing on
| | 02:47 |
the ground, her feet are cut off, as is
the bottom of the doorway on the left.
| | 02:52 |
So, although it's great as a character
piece, we can tell what the walls should
| | 02:55 |
look like, and the depth in the
architecture.
| | 02:59 |
It's a little difficult to judge height in
here and the potted palm on the right,
| | 03:02 |
isn't really a good indicator because that
can be any size in any basket or pot.
| | 03:07 |
As we saw with the painted pottery, this
un-glazed piece shows us an example of the
| | 03:11 |
things we're going to see.
There's a good chance we're going to get
| | 03:14 |
this close and so, these kind of objects
need to be full in the view.
| | 03:18 |
And we should see when we get to our image
effects and depth of field, and also in
| | 03:21 |
planning our field of view, that we want
to be able to see these things with a
| | 03:24 |
shallow depth.
That we're going to see them in focus and
| | 03:29 |
a subtle blur on the rest of the
background.
| | 03:31 |
But there's a good chance in our field of
view we want to be able to feel like we
| | 03:34 |
are close to this rough wall behind.
In this last shot on the street, we have
| | 03:40 |
another similarly sized and shaped narrow
street.
| | 03:44 |
We have a rough indicator of size from the
horse in the background or donkey, and we
| | 03:47 |
also have a decent indicator from the
doors and the padlock on the left side door.
| | 03:53 |
Give or take, this street might be six to
seven feet across, and maybe up under the
| | 03:57 |
arch here in the middle of the view 11,
ten feet tall, somewhere in that range.
| | 04:02 |
Again it reinforces that we need to have a
wide field of view in order to take in our surroundings.
| | 04:08 |
And also, spread out the depth in the
scene, making it look a little bigger, so
| | 04:11 |
it's not claustrophobic.
But still letting us feel like we can get
| | 04:15 |
close to things, because everything in
here is close at hand.
| | 04:19 |
I'll jump into unity, and start to play
with the character controller and field of
| | 04:23 |
view in some experiments to see what is
the right height and focal length or angle
| | 04:26 |
of view.
Here in Unity, I've created a new project
| | 04:31 |
called 02_Research in the Exercise Files.
This allows me by having a separate
| | 04:35 |
project, to do some experimentation
without having those experiments carry
| | 04:39 |
over into my production project for the
actual game.
| | 04:42 |
This way, my experiments can inform what I
am doing and I can take parameters form
| | 04:46 |
them but if I have a dramatic failure for
some reason, it won't effect to the rest
| | 04:50 |
of the game.
It's encapsulated in this project, I've
| | 04:55 |
brought in my map and its sized as before,
one of these arches is roughly three
| | 04:58 |
meters on the side giving my (INAUDIBLE)
size of roughly four meters wide give or take.
| | 05:05 |
I'll select the character controller and
what I can see is that the height starts
| | 05:09 |
out at two meters.
This is actually very tall, six foot seven
| | 05:12 |
and so, we may want to reduce this down a
little bit.
| | 05:16 |
I'll pull that height down to 1.6 and it's
going to reduce the size of that person in
| | 05:20 |
the scene.
So, it feels a little more close to the
| | 05:23 |
ground and a little more intimate in the
view versus always looking down at things.
| | 05:29 |
What I'll also do then, is in that first
person controller look at the main camera.
| | 05:33 |
Right now the fielder view is 60 degrees
and we may want to adjust this a little bit.
| | 05:39 |
We'll get some other objects in to
experiment with how wide we should see and
| | 05:42 |
see what it looks like.
I will start up by creating a cube,
| | 05:46 |
choosing Create Other > Cube.
I'm going to make this cube two meters on
| | 05:50 |
a side by increasing the size here to two
by two by two.
| | 05:54 |
Now if you notice, this is the box
collider so, I need to make sure I do that
| | 05:57 |
also in the scale the object.
This brings up an important point in
| | 06:02 |
changing both of those, if I change the
collider size, scaling the object scales
| | 06:06 |
the collider.
If I change the object scale and not the
| | 06:11 |
collider, the collider stays snapped to
the object.
| | 06:15 |
You're probably saying, why would you want
a collider that is bigger?
| | 06:18 |
Well, what we want to do often is
economize our colliders and I'm going to
| | 06:21 |
plan that in my field of view.
If I can't get quite close to an object
| | 06:26 |
but it feels like I'm close enough to see
it, I can plan a box collider versus a mesh.
| | 06:32 |
A box is the cheapest in terms of draw
calls and resources, collider to use.
| | 06:37 |
So, when I pull this back down for
example, to one by one by one in the
| | 06:41 |
collider size, It fits onto the mesh and I
can get right up next to it.
| | 06:46 |
I'll take this cube, and, snap it down to
the ground by pressing V, and snapping my
| | 06:51 |
transform onto one of the vertices.
And then, snapping this onto the vertex,
| | 06:56 |
this is a two meter square cube.
And I'll duplicate it by pressing Ctrl+D.
| | 07:01 |
Move it up, and change its size back to
one by one by one.
| | 07:05 |
Now I'll take this cube and snap it onto
the top of the bottom cube, again pressing
| | 07:09 |
V and I'll slide it over, so I have a
visual reference as to that height.
| | 07:15 |
Duplicate and slide over again.
I'm not making anything in particular,
| | 07:19 |
just some height markers in here, and I'll
press Ctrl+D to duplicate this out.
| | 07:24 |
I'll duplicate a few times, so I get a
rhythm marching down a street here of,
| | 07:27 |
well, cubes.
But they're a good height marker and size marker.
| | 07:32 |
Now, I'll select this whole bunch of
cubes.
| | 07:34 |
I can do it easily here in the hierarchy
by picking one, holding Shift, and
| | 07:37 |
clicking on the last and duplicate them by
pressing Ctrl+D.
| | 07:42 |
I'll duplicate them, slide them over and
then I'll pick the small cubes and bring
| | 07:45 |
them back.
I'm going to let that one of the end that
| | 07:49 |
I selected accidentally move, so that I
have a bit of a zig in my street.
| | 07:54 |
You may actually want to do this with a
couple of our pieces, approximating the
| | 07:57 |
shifting geometry we see in our level.
But this provides a neat test.
| | 08:01 |
I know that this is a guaranteed three
meters tall and I want to see what my
| | 08:04 |
controller looks like in there.
Gauging the height and field of view in my
| | 08:09 |
narrow street.
When I play my game, even though it's all
| | 08:12 |
grey and unlit, I can tell that the street
feels wide enough, although I'm having a
| | 08:16 |
little trouble gauging the height here
because there is no light in the scene.
| | 08:21 |
I'll press Stop and go make a light
choosing Game Object > Create Other >
| | 08:24 |
Directional Light.
I'll pull this light up and just leave it
| | 08:28 |
alone as long as it's lit, that'll work
well.
| | 08:31 |
I'll play my scene again and what I can
see here as I navigate down the street, is
| | 08:35 |
that with the reduced character controller
height at 1.6, things that are two meters
| | 08:40 |
which is fairly tall for the average
person, feel just above our eye line.
| | 08:46 |
We feel like we're standing in this space
and things that are three meters tall,
| | 08:50 |
definitely feel nicely and comfortably
above us which is the rough height of a
| | 08:54 |
lot of those arches we were seeing.
My street here at give or take three to
| | 09:00 |
four meters wide feels very wide.
That to really bring in the claustrophobia
| | 09:05 |
or at least the close feeling of some of
those sukes I can either put other objects
| | 09:08 |
in such as tents or even tighten down this
street width.
| | 09:13 |
Now I'll change the field of view.
Now that I've established my player
| | 09:16 |
controller, I'll pick the main camera in
the first person controller and change
| | 09:20 |
this field of view.
The 60-degree field of view is somewhere
| | 09:24 |
between a 28 and 35 mm focal length, I'll
pull this up to 65.47, which is the field
| | 09:30 |
of view for a 28 mm lens, a little bit
wider than our standard 35.
| | 09:37 |
I'll press play again.
And what I'll see in my scene is that
| | 09:40 |
things feel, even from the start here when
I spawn, a little bit farther away.
| | 09:45 |
An standing in the street, it almost
starts to fish-eye.
| | 09:48 |
But I definitely get the, long depth in
this short run of boxes, that that wider
| | 09:53 |
field of view has made my street feel
longer.
| | 09:57 |
And I get a greater indication of the
small spaces between as I go by.
| | 10:02 |
It also lets me feel like I can get very,
very close.
| | 10:06 |
Intimate with my surroundings, and staring
at whatever cracked plaster or painted
| | 10:10 |
pots are at hand.
Right here, with that 28 mm field of view,
| | 10:13 |
I can really just shove my face up next to
the wall.
| | 10:17 |
And so, this will give the gawker side in
every gamer a chance to look at the
| | 10:21 |
textures and really explore the
environment.
| | 10:25 |
Because were after the immersion in here.
That clipping does tell me I need to scale
| | 10:28 |
back my controllers a little bit or
increase the collider size, so I'm held
| | 10:32 |
off the wall, just a touch.
This way I won't clip through objects and
| | 10:37 |
break the illusion.
But I like the way the size is going, and
| | 10:39 |
the wider field of view and shorter height
of the character, is going to make me feel
| | 10:43 |
like I'm really in this place.
| | 10:46 |
| | Collapse this transcript |
| Designing semi-autonomous systems| 00:00 |
In our game beyond running around a nice
looking place, we need to have the idea
| | 00:04 |
that the world is functioning.
Even if the functioning world is really
| | 00:08 |
just there to add color to our experience.
We know from our core mechanic here and
| | 00:13 |
secondary mechanic that we're going to
encounter other players or other characters.
| | 00:18 |
Depending on if this game is networked or
not, we may be playing against actual
| | 00:22 |
people or semi-autonomous systems.
One semi-autonomous system we'll need to
| | 00:27 |
take care of, at least the thought of, are
the other shopkeepers.
| | 00:30 |
They should simply appear to function, and
we can interact with them.
| | 00:34 |
A semi-autonomous system is a system that
appears to be functioning, until the point
| | 00:38 |
we interact with it, at which point our
behavior changes what it is doing.
| | 00:43 |
An autonomous system, then, functions on
its own.
| | 00:47 |
An example of an autonomous system in this
game might be the daylight cycle if it's animated.
| | 00:52 |
We might put a sun in and simply have it
cycle over the course of the game.
| | 00:57 |
And so our game timing section has an
indicator of needing to deal with that.
| | 01:01 |
What we can do to design our
semi-autonomous systems initially is to
| | 01:04 |
lay out places for them and zones for them
to happen.
| | 01:08 |
I'll go back to Adobe Illustrator to my
map and block out some areas for both
| | 01:12 |
pedestrian traffic and zones for shop
keepers.
| | 01:17 |
Here in Adobe Illustrator I've got the
texture sheet I had last planed out in the view.
| | 01:20 |
I'll click in the drawing and press Ctrl+0
to zoom extends.
| | 01:24 |
And there is my map with my streets again.
What I'll do is make a new layer here.
| | 01:29 |
Locking first that layer 5, which has my
text and textures on it, and creating a
| | 01:33 |
new layer.
Which I may want to name this one by
| | 01:36 |
double-clicking on semi, or semi
autonomous.
| | 01:39 |
Now I'll start put in some zones for
things to happen.
| | 01:42 |
It's a pretty good bet that all of my
shops will need a shopkeeper.and that
| | 01:45 |
shopkeeper will have a radius outside the
shop that they will stay with in.
| | 01:50 |
What I'll do is use maybe a transparent
object such as a circle to define their zones.
| | 01:55 |
I'll fly out my Rectangle tool and pick my
ellipse, and in my colors here, I'm going
| | 01:59 |
to use something recognizable.
I'll pick a light blue and then go under
| | 02:05 |
Opacity and drop down the percentage to
maybe 40%.
| | 02:10 |
Now when I draw this shape it's going to
shade in this blue.
| | 02:13 |
And I can always go in and if it's
selected, change the opacity if I need.
| | 02:17 |
What I'm going to do is to draw out
circles and define places where systems happen.
| | 02:24 |
I'll put a big ellipse inside this shop
first.
| | 02:27 |
And then a circle, outside here, making
sure I select both of these, and changing
| | 02:31 |
their opacity.
This will be fairly consistent for my
| | 02:35 |
shops, and it's a zone where that
shopkeeper semi-autonomous system will happen.
| | 02:40 |
What I need to do is to define these,
because this will impact the player path.
| | 02:45 |
When I take these objects and group them
and move them, or just alt clone them
| | 02:48 |
individually, I'll see very quickly that I
have a zone of places where a shopkeeper
| | 02:52 |
may be standing, and the player may choose
to avoid or interact with them.
| | 02:58 |
I'll Alt clone these over, and what we
start to see very quickly is that what we
| | 03:01 |
thought was a narrow street depending on
the path of the player and the want of the
| | 03:05 |
player to interact with their
surroundings, just got narrower.
| | 03:10 |
This is important when we're dealing with
our navmesh.
| | 03:13 |
A navmesh allows our AIs or our NPC, our
artificial intelligence or non-player
| | 03:18 |
characters to define where they should go
and if they should be path-finding within
| | 03:22 |
this game.
Placing this in at least gives me a range
| | 03:27 |
which allows me later, if I need, to
establish a rule-based system that
| | 03:30 |
basically says to these shopkeepers, you
must stay within this radius of your shop
| | 03:34 |
or defined by these areas.
Again, if I can pin this down to a modular
| | 03:41 |
approach of where they should go, I can
take a shopkeeper with a pre-defined area
| | 03:44 |
and simply land those areas wherever I'd
like.
| | 03:49 |
This will let me economize on how many
times I have to reinvent the shopkeepers
| | 03:53 |
staying within a certain area.
There's a great example of this kind of
| | 03:59 |
system in the movie Flyboys, about flying
in World War I biplanes.
| | 04:04 |
The animators were allowed to place
essentially spheres, to define where the
| | 04:08 |
clouds went.
Each sphere would then at render time turn
| | 04:12 |
into the right kind of clouds, as put in
by the visual effects artists.
| | 04:16 |
And this is obviously hidden in a
nutshell, but it would let them
| | 04:19 |
standardize on the clouds they were doing,
and randomize within those zones, so they
| | 04:23 |
could easily define and place any clouds
to make the scenes work.
| | 04:29 |
In this way, I'm making clouds of
shopkeepers we'll call it.
| | 04:33 |
Taking these pieces and using the
semi-autonomous system placement devices
| | 04:37 |
to deform where the player may want to go.
Not where they can go, but want to go.
| | 04:44 |
And so this semi-autonomous systems then
will affect my player path overall.
| | 04:50 |
But now I'm bringing in not just a hard
constraint of a wall.
| | 04:54 |
In this case, what I've also done is set
up a zone for semi-autonomous systems in
| | 04:57 |
the spice courtyard.
These two shopkeepers may be slow enough
| | 05:01 |
in business that they can come out and
talk to each other, so that a stranger
| | 05:05 |
walking through the door is greeted by two
NPCs right here in the middle of the courtyard.
| | 05:11 |
What we'll also see is that around our
kiosks we start to get a large overlap of
| | 05:15 |
our semi-autonomous system placements,
that because these are open and the
| | 05:19 |
shopkeeper may circulate around freely,
there could be at any given time almost a
| | 05:24 |
spare people wall across here.
If there's any other non player characters
| | 05:31 |
or NPCs, milling about this street will
become very full, very fast.
| | 05:37 |
The way we want to think of our design,
while I place a few more of these, is that
| | 05:40 |
these systems should seem to exist.
I'm defining mill zone essentially for
| | 05:46 |
this where the shop keepers will simply
happen and appear to be doing some kind of
| | 05:50 |
cycling or idling animation of shop
keeping.
| | 05:54 |
Similarly other shoppers should have the
same thing.
| | 05:57 |
That they should be doing their thing, and
we simply go and interact with them as we need.
| | 06:02 |
We can finish out this graphic here which
really defines the zones for these to happen.
| | 06:07 |
Having it as a consistent modular
approach.
| | 06:10 |
Will help on the programming and
artificial intelligence side later.
| | 06:13 |
What we need to think of when we get to
the character design for this is, how many
| | 06:17 |
do we have, what are their behaviors and
within this layout of NPC semi autonomous
| | 06:22 |
zones what's going to happen?
| | 06:26 |
| | Collapse this transcript |
| Designing wayfinding systems| 00:00 |
We play games to immerse ourselves in a
place or an experience that we are not in currently.
| | 00:06 |
Very few of us will actually travel to,
say Casablanca.
| | 00:11 |
Even fewer of us will be an ace chef sent
there to source out local ingredients.
| | 00:16 |
Therefore, this game is interesting to
play at least we'd hope, because it is
| | 00:19 |
offering people a chance to do something
that they will probably not do.
| | 00:24 |
What we need to do then in our game, is
give the player a way to acquaint
| | 00:28 |
themselves in the surroundings.
As we can see in this image, there aren't
| | 00:32 |
really signs present, and a lot of the
construction is the same stuff.
| | 00:37 |
That rough plaster over masonry, or
something similar.
| | 00:40 |
The one bright blue spot, the tile down at
the bottom right is a good possibility for
| | 00:45 |
a way finding system.
Also the pavers here, these hexagonal or
| | 00:50 |
at least six sided, almost fish scale like
pavers, might provide us a way to tell
| | 00:54 |
people where they are in this city.
We may also want to look at liked
| | 01:00 |
merchants grouped together, or liked
functions.
| | 01:03 |
This happens to be the rug merchant zone,
for example, where the rug merchants all
| | 01:07 |
hang out their wares.
We may want also some kind of textural
| | 01:11 |
switch on the walls.
Different sections of the city may have
| | 01:15 |
been built during different times.
And so, show either a different
| | 01:18 |
construction or a different overall
coloring.
| | 01:21 |
There may be key colors we'd like to use
as well.
| | 01:23 |
In addition to simply the building
materials, we might see one part of the city.
| | 01:29 |
Maybe one quarter that's known as the
butcher's quarter, all show red and white
| | 01:33 |
on top of the building, or something
similar.
| | 01:36 |
Maybe not even that overt.
But simply using color for a function that
| | 01:39 |
generally but not completely identifies an
area.
| | 01:43 |
Similarly, the potter's quarter or pot
maker's area, we'll call it, might be all
| | 01:48 |
colored in the dust of the clay they use.
As we can see in this image, everything
| | 01:54 |
seems to have that same tint.
Some of it may be from the lighting, but a
| | 01:58 |
lot of it could be decades or even
centuries of that clay dust, and
| | 02:02 |
everything is that sort of rich warm
orange tone.
| | 02:06 |
In all these images, we can notice that
there is really a lack of signage until we
| | 02:09 |
get into a very commercial area.
Even on the interiors, there aren't even
| | 02:14 |
really typical signs, stripes or
indicators of anything.
| | 02:18 |
You're simply expected to know where
you're going.
| | 02:21 |
The one exception might be this stone in
the floor.
| | 02:24 |
It's very possible that we put in way
finding devices like that, that simply
| | 02:28 |
indicate either a direction, or maybe have
an arrow or something similar aiming at a
| | 02:32 |
key feature.
Baths this way, for example.
| | 02:37 |
There may be some signage.
As we can see in the background in this
| | 02:39 |
picture, there's some kind of sign up on
that wall, and perhaps the remnants of a
| | 02:42 |
street sign on the building.
The most overt easiest way is to simply
| | 02:47 |
put sines on everything.
But we as level designers should probably
| | 02:51 |
stay away from simply labeling everything.
That takes the fun out of it as the
| | 02:56 |
player, because if things are simply
handed to you, there's no fun in learning
| | 02:59 |
where you are, and the tips and tricks in
navigating your way around.
| | 03:05 |
There's a good chance that local shops may
have their own signs.
| | 03:08 |
And more importantly, we might see motifs
for some shops that are common to those
| | 03:12 |
shops, such as the tiler's stonework over
the door.
| | 03:16 |
A larger or more public space may have
numerous shopkeeper signs, and then there
| | 03:20 |
may be actual street signs or something
close.
| | 03:24 |
We can take these all into account in our
map in starting the layout first areas of
| | 03:28 |
function designated by color, and then at
least an idea of the motifs we might find.
| | 03:35 |
I'm starting out on my map with my
semi-autonomous systems partially in place.
| | 03:40 |
Now, I'm going to lay in some color on
each shop.
| | 03:43 |
And these colors will define, when I
texture if I have a mask or something
| | 03:47 |
similar, or a motif for a particular
function where it should go.
| | 03:51 |
I'll make a new layer, locking this
semi-layer and creating a new one.
| | 03:56 |
I'll name this one way function.
What I'll do for this is key off the
| | 04:02 |
colors in my text or sheet.
I'll eye drop off to start first one of my
| | 04:06 |
market spice colors, my orange.
I'll use my Pen tool by pressing P, or my
| | 04:11 |
rectangle, zoom in and start to lay down
some color.
| | 04:15 |
It doesn't have to be exact, but what I'll
do is lay out at least major function
| | 04:19 |
either with rectangles or the pen is fine.
I'll switch actually to the rectangle by
| | 04:25 |
pressing M and lay some rectangles over
these few shops.
| | 04:29 |
Now, I'll switch to the pen for the shop
that's off access.
| | 04:32 |
There's two spice shops in the spice zone
and one outside.
| | 04:36 |
I'll select all of these elements and
change their opacity, maybe down to a 20%.
| | 04:41 |
When I turn off my semi-autonomous system
layer, now I can see by function that
| | 04:45 |
these three shops should share some common
motifs.
| | 04:49 |
Maybe the spice traders guild has a
certain motif that's always in the tiles
| | 04:52 |
surrounding the border on their door, or
something similar.
| | 04:57 |
We might also see here on the vegetable
sellers, similar markets.
| | 05:01 |
What this will do is lay out what each
shop is doing so that when we're designing
| | 05:05 |
or way finding and actually thinking about
signage and tile in the texture, we have a
| | 05:09 |
clue of how many different pieces that
should go on.
| | 05:13 |
Once I've got these roughly boxed out
here, I'll go and switch their color and opacity.
| | 05:18 |
In this case, I'm going to put in a dual
function in one shop.
| | 05:22 |
One half is going to be vegetables, and
one will be something else.
| | 05:26 |
I'll select all these pieces and change
them over to green, and lower their opacity.
| | 05:31 |
With a 30% green, I can see that this is
the vegie district.
| | 05:34 |
The easiest one to find pieces on our list
for, and one of the most plentiful.
| | 05:39 |
This gives me a good indication for way
finding then, that if I want to have,
| | 05:43 |
let's say banners, all the vegetable
sellers are known by the verdant green
| | 05:46 |
cloths they hang out, that, I'm going to
see at least eight of them in one field of view.
| | 05:53 |
That when I spawn and emerge from the
vaults, there's a good chance I will see
| | 05:57 |
all the way down to the door in vegetable
sellers.
| | 06:01 |
We can consider the same with the meats.
Maybe the symbol of the meat is a knife or
| | 06:05 |
some kind of other tool.
And we see these prominently displayed, or
| | 06:09 |
we can always tell the meats because they
are always done in white.
| | 06:14 |
It's up to us how we'd like to do it.
And this is the place actually for visible
| | 06:17 |
signage as well.
We may see that the butchers are
| | 06:20 |
identified by perhaps a city plaque,
certifying them as butchers for example.
| | 06:25 |
And in switching to more overt signage, we
need to think of is it repeating or is it
| | 06:29 |
unique and how many will we see?
On the left side I have my dried meats
| | 06:34 |
here in the tent, and I'll box them in
with a different color.
| | 06:38 |
Again, landing a rectangle, changing the
color over to let's say a rich purple,
| | 06:42 |
backing off the opacity, and using that
same color on the other shops.
| | 06:48 |
I can eyedropper from one object to the
next, pressing I for eyedropper and
| | 06:51 |
picking my original rectangle, and the
second one I've just drawn changes to
| | 06:55 |
match that appearance.
I can finish out my map, and this is
| | 06:59 |
helping me in my wayfinding to define
zones where things go on.
| | 07:04 |
As I get more and more into the texture
work, the actual detail, I can define
| | 07:08 |
motifs for each place.
Or use a section of let's say the green
| | 07:12 |
fabric in textures on the awnings for the
vegetable sellers, on some of them.
| | 07:17 |
What this also tells me in my way finding
to keep it organic and not quite
| | 07:21 |
regimented, is that of these in my way
finding, five of the eight vegetable
| | 07:24 |
sellers marked out in green have chosen to
fly the green flag of the vegetable seller.
| | 07:32 |
The other three forgot their green flag or
simply don't like the color.
| | 07:36 |
And although all eight are selling
vegetables, only five of them are clearly
| | 07:39 |
marked in that zone.
With wayfinding then, what we need to
| | 07:44 |
assume in is that some, but not all of the
rules are applied, or that some, but not
| | 07:48 |
all of the conventions are followed.
Or all of the conventions are followed
| | 07:54 |
some of the time.
It's very difficult to have all of the
| | 07:57 |
rules followed all the time in way
finding.
| | 08:01 |
It gets to be monotonous.
We feel like we always know where we are.
| | 08:05 |
And so, the trick is to say, in this zone
there is a probability of 50 or 60
| | 08:09 |
following following the convention.
So, we can learn where we are, but still
| | 08:15 |
have an element of chance.
| | 08:18 |
| | Collapse this transcript |
| Crafting pinch points and strong points| 00:00 |
In any city, it's very difficult to simply
keep running around unimpeded.
| | 00:05 |
At some point, we'll get to a place were
we simply run out of space, where there is
| | 00:09 |
something blocking us.
What we want to think about, and what
| | 00:14 |
makes a level challenging for a player is
if there are pinch points and strong points.
| | 00:20 |
This doesn't necessarily refer always to
an armored, say machine gun nest, as much
| | 00:24 |
as a place in the level where the flow of
traffic is pinched in some way.
| | 00:30 |
Or it's a strong point not a boss level
necessarily, but a place that we have to
| | 00:34 |
overcome in some way that may be more
difficult than the regular run of the mill
| | 00:38 |
shops for instance.
Right now, in this game, I've got going
| | 00:44 |
here and running around the cubes, I can
see that I've got basically an unimpeded
| | 00:48 |
field of view.
I'm going to see what a pinch point looks
| | 00:52 |
like in here by cloning some of the cubes,
and pinching down the view so, I have to
| | 00:56 |
pass through one area.
I'll take my two meter cube and duplicate
| | 01:01 |
it, sliding it over, and pulling it back
just a bit.
| | 01:05 |
Then I'll duplicate it once more, snapping
it onto the other and pulling it back.
| | 01:10 |
Finally, I'll duplicate it one more time
and pull it back here.
| | 01:14 |
What this does for me, is not only make a
pinch point, which is difficult to get
| | 01:18 |
through, but also ends the view.
I'll clone some of the upper cubes around,
| | 01:24 |
just so I don't really see all of the sky,
and finish off this view a bit.
| | 01:29 |
I'm building in non-structures, we'll call
it.
| | 01:32 |
That right now what I've got is a bunch of
things that define a general volume or a
| | 01:36 |
condition more than looking like an actual
something.
| | 01:40 |
I'm going to make sure I take this last
small cube and snug it right next to the
| | 01:44 |
adjoining cube.
Let's see how this pinch point works,
| | 01:47 |
where my wide street becomes a narrow
street, which becomes a tiny hallway I
| | 01:51 |
have to worm through in order to get where
I'm going.
| | 01:56 |
When I spawn in the scene my view is
fairly open.
| | 01:58 |
And I can tell even here on the map that I
have a good deal of navigational freedom,
| | 02:02 |
like dolly forward or walk down.
I've got a good view in the street, helped
| | 02:07 |
out by the wider field of view in my
camera.
| | 02:10 |
I can see at the end there's something
blocking me, and I know that I have to
| | 02:13 |
deal with it in some way.
It may be as benign as simply walking
| | 02:17 |
through a narrow hall, or an angry
shopkeeper may come out, and demand we
| | 02:21 |
bargain with him.
I'll go down here, and already what I can
| | 02:26 |
see is that simply by restricting the
geometry, I've restricted my view and
| | 02:30 |
added a sense of urgency that I feel
trapped.
| | 02:34 |
If these become too small, I can't get my
controller through.
| | 02:37 |
As we can see in here, in the design, that
when this gets too narrow, my controller
| | 02:41 |
is stuck on the colliders.
So, what I need to do in thinking of the
| | 02:45 |
pinch points is to take that character and
collider size into account and visually
| | 02:49 |
pinch without making it completely
impassable.
| | 02:53 |
Back here, I'll take this box I had moved
over and pull it back a touch.
| | 02:59 |
And then also open up that hallway just a
bit.
| | 03:02 |
I'll also raise the roof, making sure that
I have enough head room to pass my
| | 03:05 |
controller through.
I'll try this again, even pulling this box
| | 03:09 |
back, so that what we get is what looks
like a smaller hallway.
| | 03:14 |
But actually kind of bows or bubbles out a
little bit and gives me enough width.
| | 03:19 |
I'll play it and see what it looks like.
As I was running down the street, I had to
| | 03:22 |
duck into somewhere smaller and I
definitely felt the old winding feel of
| | 03:26 |
the streets closing in on me, but then I
emerged into the bright light and the rest
| | 03:30 |
of the madyna /g.
That's a good example of a pinch point
| | 03:34 |
simply in the geometry.
That I've created a small place to pass
| | 03:38 |
through, and it adds a sense of urgency
and closeness to the feel of the game.
| | 03:43 |
It also is a convenient opportunity to
force the players through one particular
| | 03:47 |
area, if I need to load in another chunk
of a level.
| | 03:51 |
Finally, it provides an area in here for a
distinct event to happen.
| | 03:55 |
You must, go into this shop or pass by
this shopkeeper as part of getting on to
| | 03:59 |
the next piece through this pinch point.
In my level map here in Illustrator then,
| | 04:05 |
I've added on to it.
First going on to my main shops level and
| | 04:09 |
adding some more shops off that original
spawn position, I've cloned out the rest
| | 04:13 |
of the semi-autonomous bubbles for the
shop keepers and other people.
| | 04:19 |
And finally, put in some more of the way
finding.
| | 04:21 |
I've used a gold color to define what
colored housewares and other wares as
| | 04:24 |
different from food.
And I've put in the meats in the purple,
| | 04:28 |
the veggies in green and the spices in
orange.
| | 04:31 |
Over here, I've created a pinch point.
Coming off the vault structure of the
| | 04:35 |
original spawn point, I have to come down
and make a turn to the right to go into a hallway.
| | 04:42 |
It's going to feel tight, and I can even
start to think about taking these walls
| | 04:46 |
and pulling them in further, so that as I
run down this hall or hopefully walk and
| | 04:50 |
notice the architecture, it is a one way
or at least a funnel system.
| | 04:57 |
So, I have an opportunity within the
geometry to put in a pinch.
| | 05:01 |
To get through this hole I have to do
something, may be pay a toll, may be find
| | 05:05 |
a key, or may be even just read the sign
on the wall.
| | 05:09 |
But it's a place in the level to define an
area that I have to pass through versus I
| | 05:13 |
would like to pass through or go around.
Once I emerge from that pinch I'm out into
| | 05:19 |
a second courtyard of shops.
There are some freestanding tents and a
| | 05:23 |
long enclosure or arcade structure in
front of these four shops.
| | 05:28 |
There maybe other riches to be found in
here, but I have to get to the pinch point first.
| | 05:32 |
And so, thinking about when we craft the
level, how do we either slow down, stop or
| | 05:36 |
pinch the action off and direct the player
exactly through one area, allows us to
| | 05:41 |
meter the flow of the level here.
That way, even though it's an open
| | 05:47 |
sandbox, at some point, we are forced to
do what the game designer wants.
| | 05:52 |
| | Collapse this transcript |
|
|
3. Laying Out LevelsUsing modular elements| 00:00 |
With our level design fairly together in
the 2D map, it's time to think about the
| | 00:05 |
modules in 3D.
What we need to do once we got our map
| | 00:09 |
roughly laid out is to get together a
working prototype to see if the sizes,
| | 00:12 |
heights and placements actually work in
3D.
| | 00:17 |
It's an important step before we get to
the detailed art.
| | 00:20 |
It's very easy to jump into the art side
and start making things we're going to use.
| | 00:26 |
But we need to hold off and plan a little
more first.
| | 00:29 |
That way, when we make the art, we're
doing it in the right place.
| | 00:32 |
This map is designed in a modular fashion.
We can see the repetitive elements in here.
| | 00:37 |
Three different small stores, and one long
store.
| | 00:40 |
Plus the other parts.
I'll jump over to Maya where I've created
| | 00:43 |
some rough prototypes and gotten texture
sheet example on them.
| | 00:47 |
To start to assemble my modular pieces and
see what else I need.
| | 00:51 |
Here in Maya, I've got a rough collection
of parts I'm going to use.
| | 00:54 |
I'll go full screen by pressing
Ctrl+spacebar so I can see a little bit
| | 00:57 |
more of what I've got.
There's three store fronts without their
| | 01:02 |
stores as it yet.
Each one is been mapped with a text or
| | 01:04 |
sheet and in this text or sheet I've added
checkers and put in the names of that materials.
| | 01:09 |
Obviously, these are made of plastic.
There's walls next to it made of stone and
| | 01:13 |
other archways.
Here's how I have laid out a modular,
| | 01:17 |
model sheet we'll call it, of pieces that
are prototypes to test if it's working in game.
| | 01:23 |
The idea is I'm going to take each one of
these pieces, such as this wall here,
| | 01:27 |
export it out uniquely, and bring it into
unity, where I can make a prefab.
| | 01:32 |
Then If I re-export the FBX later, it will
update in those prefabs with my detailed art.
| | 01:38 |
To start with, I've got three store
fronts.
| | 01:41 |
One with a very wide door, one with a
narrower door, and one with an arch.
| | 01:46 |
I've also got two wall sections, one with
a solid wall in the middle, and one that's
| | 01:49 |
ready for columns of some kind.
What I've also created to join these,
| | 01:54 |
based on the reference imagery area a
series of archways.
| | 01:57 |
A flat arch, curved arch, and narrow door.
Designed to fit in these are two different
| | 02:03 |
door conditions.
There is a rectangular door and a curve
| | 02:06 |
top door each with a frame and its own
wall.
| | 02:10 |
With this lens being a modular approaches
this.
| | 02:12 |
If I've got a wall and I need to simply
pass through an opening I can.
| | 02:16 |
If I want to take that wall and into it
land a doorway, I'll press Ctrl+D.
| | 02:23 |
W for move and slide this over into place.
I can have just like this a wall with
| | 02:27 |
another wall and a door way adding
additional detail in my game and providing
| | 02:31 |
either a closure naturally to an
environment through a locked door or a
| | 02:34 |
pinch point where I have to do something
to get through the door.
| | 02:41 |
It gives me for two modules actually three
different parts to use.
| | 02:45 |
These are made to fit together.
And I've given myself, in the design of
| | 02:48 |
these modules, some flexibility.
As we can see in the back of the door here.
| | 02:53 |
There's a little bit of wall space next to
the inside wall.
| | 02:57 |
So if I take this element, and slide it to
one side or the other.
| | 03:00 |
I have what feels like a different
condition.
| | 03:03 |
I can center it, giving me that indent on
both sides.
| | 03:06 |
Or pull it forward right up to the edge of
that wall, so it's a small shadow line on
| | 03:10 |
one side and a deeper on on the other.
I'll delete that extra element for now as
| | 03:15 |
I already have one saved off to the side.
Then, what I've done is to create a series
| | 03:20 |
of volts in here that I'm going to use in
my narrow winding streets.
| | 03:25 |
This will also help me with my spawn
point.
| | 03:27 |
There's two sets, and they're labeled
here.
| | 03:29 |
And I'll press Ctrl+A to go the Channel
box or Attribute Editor to see this.
| | 03:33 |
This one is called Vault S Circle, Single
B1.
| | 03:37 |
Vaults meaning semi-circular, as opposed
to pointed.
| | 03:41 |
Single, as in, it's a single module B, 01.
There's also A01.
| | 03:47 |
With the intent in here of having this
geometry unwrapped in the same way.
| | 03:51 |
But moved on the texture sheet to a
different place.
| | 03:54 |
Maybe one is done in plaster, and one is
done in stone.
| | 03:56 |
And it's a simple matter of choosing which
one I want, and applying the right material.
| | 04:00 |
I've got double vaults as well.
Because the texture should span.
| | 04:04 |
And that let me save some parleys across
the middle.
| | 04:06 |
And finally, I've got end caps.
These are just round half domes with
| | 04:10 |
extruded walls that are meant to snap
perfectly onto the end of the volts.
| | 04:14 |
So I can have a logical end and small
niches if I need.
| | 04:18 |
I'm ready to try assembling this and to
see if my pieces work.
| | 04:22 |
I'll see if in this kit of parts I need
any extra modules along the way.
| | 04:26 |
What I'll do to start out, is bring these
over into Unity one at a time.
| | 04:30 |
An I'll show it with a few of them.
What I'm going to do, is provide for you,
| | 04:34 |
an export of all the pieces as FBXs
uniquely.
| | 04:38 |
So that way, if you're not running in
Maya, you can still pull-up that full
| | 04:41 |
collection, an use it in Unity.
Here's how I'll handle the FBX process.
| | 04:46 |
First, I'll select all of my objects
except for the doors and center the pivots.
| | 04:51 |
I'll choose modify and center pivot.
I'll also zoom in on things like this
| | 04:56 |
awning and make sure it's all one object
for now.
| | 04:59 |
This awning is a good example of using
multiple materials.
| | 05:02 |
Where I'm going to have let's say wood on
the supports but the fabric here may
| | 05:05 |
actually vary because I have multiple
fabrics designated on my texture sheet /g.
| | 05:10 |
I'll start out with my wall taking the
first one Storefront C01 and choosing
| | 05:15 |
file, export selection.
I'll export this out as an FBX file.
| | 05:22 |
And export out the selection, I am going
to put it into my scenes folder, its a
| | 05:26 |
good idea when you are constructing a
prototype like this instead of exporting
| | 05:29 |
straight into the Unity assets folder you
export separately and drag over
| | 05:33 |
selectively just the pieces you want one
at a time.
| | 05:38 |
Although its an extra step it will help
you stay organize as very quickly we can
| | 05:42 |
end up with a lot of parts.
This is a simple scene and I'm already
| | 05:47 |
into nearly 20.
I'll call this one exactly as it's named
| | 05:51 |
here in Maya /g, Storefront C01.
In my FBX I'll make sure I go under
| | 05:55 |
geometry and include smoothing groups
which are my hard and soft edges in Maya /g.
| | 06:00 |
I'll scroll down and there's no animation
and or cameras or lights so, I don't need
| | 06:03 |
to worry about that.
But, in advanced options under units I'll
| | 06:07 |
uncheck automatic and export out
converting to meters.
| | 06:12 |
This way I can put a scale of one in in
the FBX although the prefab may show
| | 06:15 |
differently I know it'll be in the right
size when it comes in.
| | 06:21 |
I'll click export selection, and run
through the rest of the objects.
| | 06:25 |
Showing what it looks like in Unity when
I'm done.
| | 06:28 |
Here in Unity, I've created a new Unity
project called 03 Unity, in the chapter
| | 06:32 |
three folder in the exercise files.
This way, it's a clean new project that I
| | 06:37 |
can bring my pieces into to assemble.
I'll make sure I bring in the map I had earlier.
| | 06:42 |
But I'd like to keep these projects
separate from my research projects so I
| | 06:45 |
don't have any carryover accidentally.
I'll start out by copying those fpx's into
| | 06:50 |
the assets folder and I'll see them
automatically import so I can get them
| | 06:53 |
sized correctly.
The warning at the bottom here on the
| | 06:58 |
Unity mesh triangle is one we can discard.
Its only talking about a set triangle
| | 07:03 |
preference that may or may not come with
this particular version that we can ignore
| | 07:07 |
because it was nothing its referring to in
the scene.
| | 07:11 |
Here in my Maya project in my scenes
folder are all my fbx's.
| | 07:15 |
Each one being a separate object or
separate collection of objects in the case
| | 07:18 |
of the doors.
So, this way, eventually it can be a prefab.
| | 07:23 |
A prefab for us in Unity is something that
is defined once.
| | 07:27 |
Objects, materials, lights even scripts
and colliders, and then instanced
| | 07:30 |
throughout the scene.
So, all the instances refer back to the
| | 07:34 |
original definition and we can turn on our
Occlusion culling and reduce our draw
| | 07:38 |
calls way down.
I will select all my fpx here and press
| | 07:43 |
Ctrl+c to copy jump over to my 03 Unity
project and paste those into assets folder
| | 07:47 |
here in Unity in Assets folder.
I will paste in those FBXs when I will
| | 07:53 |
switch back to unity it will automatically
import those FBXs in back here in Unity,
| | 07:58 |
all of my parts automatically imported.
What I'll do for each of them is select
| | 08:05 |
them and set the scale to one.
Because I exported out as meters, Unity's
| | 08:10 |
scale being meters means the scale factor
needs to be at one.
| | 08:15 |
And for now I can check Generate
Colliders.
| | 08:18 |
Alternately I could go through and put on
Box Colliders in some of the objects.
| | 08:22 |
But as I'm going to come through and
streamline the colliders later generating
| | 08:25 |
the colliders is fine.
This is not a pretty level necessarily yet.
| | 08:30 |
So, I'm not going to worry about my light
map UVs.
| | 08:33 |
A second set of UVs for light mapping that
automatically flattens out the object for
| | 08:38 |
rendering the white into a texture.
Because this is not the final art but
| | 08:43 |
instead a prototype I can ignore that.
I'll scroll down to the bottom and click apply.
| | 08:48 |
I'll make sure I do this for all the parts
setting the scale to one and generating colliders.
| | 08:54 |
I'll finish this and then show some
organization here in my project folder.
| | 08:58 |
Now, that I've got all of my fbx's set at
a scale of one and all their colliders are on.
| | 09:03 |
I can start to think about assembling them
on a ground plane.
| | 09:06 |
I'll start out by creating a ground plane,
choosing Game Object > Create Other > Plane.
| | 09:11 |
Most likely, I'll end up replacing this
ground plane with custom made ground
| | 09:16 |
elements later.
But this'll give me a zero line to snap
| | 09:20 |
things to initially.
What we want to do is actually vary our
| | 09:23 |
height and our terrain slightly keeping it
reasonably flat and saving our slopes in
| | 09:28 |
slope colliders for things like stairs.
Snapping onto a zero plane initially is
| | 09:33 |
good and then later it gives us the
flexibility to rise up and down by moving
| | 09:37 |
both buildings and passing a ground
through them.
| | 09:41 |
The terrain object is something I'll
reserve for, actual terrain that flows,
| | 09:45 |
such as the desert sands for example,
outside this city.
| | 09:49 |
I won't use the terrain in here, because
it tends to be a bit, soft looking next to
| | 09:53 |
the buildings, an I'd rather have the
control to model unique pieces.
| | 09:57 |
I'll begin by assembling my vaults, and
seeing what special cases I need.
| | 10:02 |
Here's how things snap together in a
modular fashion.
| | 10:04 |
I'll take my end object, my vaults, circle
pair.
| | 10:07 |
And drag it into the heirarchy.
I'll press F to focus, and here it is in
| | 10:11 |
the view.
We can see that the default Unity plane is
| | 10:14 |
actually quite small.
I'll pick this plane and bring it scale
| | 10:19 |
way up maybe 100 by 100 by 100.
Now, I can pick this vault object, pull it
| | 10:25 |
up, press V to snap to one of the corners
and snap it down onto the plane and I'll
| | 10:29 |
start to assemble some of the ends on it.
I can drag straight into the scene but it
| | 10:35 |
may come out below the ground.
What I'd like to do, typically, is,
| | 10:39 |
instead of dragging it that way, I'll drag
it straight into the hierarchy.
| | 10:43 |
And this way, it'll appear exactly in the
space it is in mind, next to the other pieces.
| | 10:48 |
And I can slide it around.
I'll focus in, and see how this looks to
| | 10:52 |
snap on.
What I can do is changed from textured
| | 10:55 |
wire to wire frame for example.
And that's going to tell me a little
| | 10:58 |
clearer where I can snap to.
I'll press V to snap, and snap this right
| | 11:02 |
in, and we can start to see our space
taking shape.
| | 11:06 |
I'll do this by pressing control D, press
E to rotate, hold control, and snap evenly.
| | 11:11 |
There's a 90 degree snap.
If you want, you can go in here in the
| | 11:16 |
inspector and even that out, making it a
perfect negative 90.
| | 11:21 |
Now, press w for move and snap this piece
in.
| | 11:23 |
We can see very quickly when I switch back
to texture for example that we're going to
| | 11:28 |
need more elements.
Although my vaults look good already, I've
| | 11:32 |
got two of the same ends here.
The height works though.
| | 11:35 |
And more pieces will probably look pretty
good in this modular design.
| | 11:39 |
I also need to make the dome, that's our
spawn point and then I can bring in my map
| | 11:43 |
and start snapping these together.
It's a good exercise though in modular
| | 11:47 |
parts to take them, bring them out as
separate fbx's and bring them into your
| | 11:51 |
game engine in such as Unity and really
see how they look when you assemble it.
| | 11:56 |
I'll add on one or two pieces to see how
this works.
| | 11:59 |
If I take my vaults and clone it by
pressing Ctrl + D.
| | 12:03 |
Slide over, zoom in and snap together.
I've created a column and it's good, but
| | 12:07 |
I'm kind of limited by these pieces, and
this is why.
| | 12:11 |
In my creation here all my objects, I made
singles as well.
| | 12:15 |
I can take a single vault and drag it in,
zoom out and snap it on.
| | 12:21 |
And I'm starting to make a collection.
What might be easier also is to look at it
| | 12:24 |
from the bottom view in a wire frame.
Dropping down and choosing wire for example.
| | 12:30 |
And now I can see my pieces and snap them.
When we bring things into Unity, we need
| | 12:34 |
to remember that they are single sided.
And so, we need to look at them in the
| | 12:38 |
right view to be able to tell where we
are.
| | 12:42 |
Because these vaults are all made to face
down, we need to see them from the bottom
| | 12:45 |
and we can start to Clone and Snap.
What I am looking for is I am snapping
| | 12:50 |
these pieces out is that I am creating a
space that is asymmetric, that when I walk
| | 12:54 |
through it's got a good flow to it and I
don't part fatigue from seeing the same
| | 12:58 |
piece over and over.
Here is the final test of my modules.
| | 13:04 |
I'll drop a player controller in, going
under standard assets characters, and here
| | 13:08 |
is my first control, which I'll pull right
into the scene.
| | 13:12 |
Pull it up and make sure I check it out in
a textured or texture plus wire to see if
| | 13:16 |
I'm seeing in the right place.
When I play my game, what I see here,
| | 13:21 |
aside from a lack of light is that kind of
neat rhythm in my space.
| | 13:25 |
I'll get out of this and just put a light
in.
| | 13:28 |
One of the things we can do is just light
up with a Directional light to test.
| | 13:33 |
Alternately, we can put material on
everything that's simply unlit.
| | 13:37 |
I'll choose create other and directional
light, and pull a sun up in the scene.
| | 13:41 |
It's not any particular sun yet, but I'm
at least going to angle it over and then
| | 13:45 |
press play again.and now here I am in my
vaults.
| | 13:49 |
I've got a good height and size going.
And it really feels like I am starting to
| | 13:53 |
be somewhere.
I can see very quickly how the same wall
| | 13:56 |
shows above and over, and so I need to
take into account my modules that more
| | 14:00 |
pieces would really help you.
It's working though, and I have got a good
| | 14:05 |
travel and good sense of scaling the
modules.
| | 14:08 |
So, the quick prototype test of these is
holding up so far.
| | 14:11 |
| | Collapse this transcript |
| Joining modular elements| 00:00 |
Here in Maya, I've modeled the dome I've
needed for the spawn point, quickly taking
| | 00:04 |
some of the original arches I've got for
my single and pair arch modules, cloning
| | 00:08 |
them, and adding on a rough dome.
Later we can detail this out with all
| | 00:13 |
kinds of mosaic tile in the dome, but this
will work for now, because I needed this
| | 00:16 |
one large singular element.
I've exported out as an FBX.
| | 00:21 |
And I'm going to bring it into Unity.
And then I'll bring in my map I made earlier.
| | 00:25 |
And start to lay out my pieces on that map
to see how well my modules flow.
| | 00:31 |
Here in Unity, now that I've placed my
dome FBX in my Assets folder.
| | 00:35 |
That dome I just made is imported in.
And I've set the scale factor to one, and
| | 00:39 |
turned on colliders.
I've also exported the latest version of
| | 00:43 |
my map, naming it 0302 market map, and
I'll let it come in at 2048 on the side.
| | 00:49 |
I'll apply this and now I'm going to get
this on the plane, using one of my
| | 00:53 |
existing modules to size this map too.
I need to see if I have a match here, and
| | 00:58 |
it brings up an important point in scale.
The map elements were drawn, relative to
| | 01:02 |
each other, but not in any particular
scale.
| | 01:06 |
I had in mind that maybe the shops were
three or four meters on a side.
| | 01:10 |
But aside from simply drawing and snapping
them together as a schematic they weren't
| | 01:14 |
quite put together.
So the test here is to see if the modules
| | 01:18 |
I modeled in Maya actually fit on the map
I drew in Illustrator without re-sizing.
| | 01:25 |
If I do have to re-size one or the other
and rethink my layout now is the time to
| | 01:28 |
do it.
I'd rather find out now in the prototype
| | 01:32 |
stage that I need to make, let's say, my
archways bigger, then farther along when
| | 01:35 |
I'm deep in a digital sculpting pipeline
or something similar.
| | 01:40 |
It's important to test these things along
the way and see if this really works.
| | 01:45 |
What I'll do is take my ground plane, and
get a new unlit shader on it so I can see
| | 01:48 |
that map.
I'll create a new material.
| | 01:51 |
Right-clicking in the Assets, and choosing
Create > Material.
| | 01:55 |
In the Materials I'll drop down under
Diffuse, and choose Unlit, and Texture.
| | 02:00 |
In the texture then, I'll drag over that
map I imported and then I'll take this new
| | 02:04 |
material and drag it onto my plain.
I'm going to name this new material
| | 02:10 |
calling it Market Map.
Now comes the test.
| | 02:14 |
If I take this plain and scale it back
down, and scale it in to match the size of
| | 02:17 |
my vaults in the drawing, can I get
everything in correctly?
| | 02:22 |
I'll start by bringing the scale down to
maybe three by three by three so I can
| | 02:26 |
actually see it and scale up.
This is a good place to turn on Texture
| | 02:30 |
Plus Wire so we can see what we're doing.
I'll press R to scale.
| | 02:34 |
And now I'll scale up this element, and
then move it over so I start to get it on
| | 02:38 |
those vaults.
If you need in a place like this, flip
| | 02:42 |
something around.
Grab one of these vaults, for example, and
| | 02:45 |
move it.
I'll take this vault here, and scale up
| | 02:48 |
this map until it fits.
It looks like it's not far off.
| | 02:53 |
As I move this back and forth, I'm almost
in shape.
| | 02:57 |
An alternate way to do this, if you can't
see as well, is to rotate this over.
| | 03:01 |
Flipping it around by pressing E to
rotate, and rotating on the x axis while
| | 03:04 |
holding Ctrl, for example.
If we rotate that over 180 degrees, and
| | 03:10 |
then view from the Bottom view, we can see
both together.
| | 03:14 |
I'll make sure I go into a side view and
move this so that my map is not clipping
| | 03:17 |
through the drawing.
I'll actually move it above those vaults
| | 03:21 |
and now I'll test from the bottom.
With the map selected I'll try scaling.
| | 03:26 |
It looks like I need to get a little
bigger here for these to be able to fit.
| | 03:31 |
I'll move that map into place and keep
testing.
| | 03:34 |
There will be a little bit of a slip and
scale but if I can get it pretty close I
| | 03:37 |
can start to snap my elements together and
see if this works.
| | 03:41 |
I'll scale it up and see what I've got.
That should just about do it.
| | 03:46 |
I think I've got my vaults and the scale
of the vaults on the map pretty close.
| | 03:51 |
I'll add in the dome and start to sequence
these around using the map as a guide.
| | 03:55 |
Switch back to perspective, spin around
holding Alt on the mouse wheel and flip
| | 03:59 |
this map around.
I'll press E to rotate, select the map and
| | 04:03 |
spin it back on the x axis while holding
Ctrl.
| | 04:07 |
I can always click back on this center box
to go back to Home or spin this around
| | 04:12 |
again and Home grid.
It looks like my map is above my objects
| | 04:16 |
so I'll pull this back down.
What I can also do is click in the Y
| | 04:20 |
field, and zero it out.
And now I'm ready to move.
| | 04:23 |
I'll take my existing elements, and delete
them out of the hierarchy.
| | 04:27 |
And start out with my dome.
And bring new pieces in to snap into place.
| | 04:31 |
I'll begin with the dome, dragging it into
the hierarchy.
| | 04:34 |
And there it is.
Then I'll zoom around until I find where
| | 04:37 |
it sits.
This is a good place to turn off Texture
| | 04:40 |
Plus Wire and just go back to texture.
I'll move that dome in and see how things join.
| | 04:46 |
It looks like I have a small difference in
the construction here, but it shouldn't be
| | 04:49 |
a big deal.
I added a little extra thickness to the
| | 04:52 |
walls in the dome as the original is
simply drawn in here with boxes, without
| | 04:55 |
really the thickness of the masonry.
I'll start to get my other pieces on and
| | 05:00 |
see how they join and where I'll need
extra parts.
| | 05:04 |
First, I'll grab one of the pairs, and
pull it into the scene by the dome here.
| | 05:07 |
I'll put this on and snap it in.
I'll switch my view back and forth here,
| | 05:12 |
to textured and wire frame so I can see
what I'm doing, and start joining my
| | 05:15 |
modules and watching out for places where
I might need extra joinery pieces.
| | 05:20 |
I'll duplicate this, slide it over, move
it into place, switch to a wire, and join it.
| | 05:27 |
What we can see here is that with a little
planning in how things join, we can get
| | 05:31 |
our modules together very quickly.
If we don't really worry about how things
| | 05:36 |
sequence together, and I can see that I
have a little bit of a scale difference,
| | 05:39 |
here, it gets more and more difficult to
make up little gaps.
| | 05:44 |
I'll try one more duplication, pressing
Ctrl+D and pulling it into place.
| | 05:48 |
I'll move this over, and I'm almost ready
for some of my end pieces to join on to.
| | 05:53 |
I'm using the map as a schematic so I can
snap my parts into place by holding V.
| | 05:58 |
It seems to be working and I have the
beginnings of a level.
| | 06:01 |
I can see in here that I need a lot of end
walls to finish these modules.
| | 06:05 |
Because right now I've got a lot of
open-vault structures.
| | 06:08 |
What I can also see is I need to look at
making prefabs in this, and that way,
| | 06:12 |
changing one will change them all.
Right now these objects are prefabs, and I
| | 06:17 |
can tell they are because the text is blue
here in the hierarchy.
| | 06:21 |
Denoting that it's a prefab, or has a
connection over to the FBX.
| | 06:26 |
As it gets more complex I'll probably want
to make a prefab first, and then
| | 06:29 |
instantiate it around the scene.
I'll handle that next, but my test of
| | 06:34 |
joining my modules on, and snapping to the
map is working.
| | 06:38 |
| | Collapse this transcript |
| Setting up prefabs| 00:00 |
With my modules imported in Unity, and at
least a quick confirmation that they'll
| | 00:04 |
join nicely plus an import of my map, I
can start to think about setting up some
| | 00:07 |
prefabs before I instantiate modules any
further.
| | 00:12 |
A prefab in Unity is a defined collection
of an object or objects plus lights,
| | 00:16 |
materials, scripts and anything else we'd
like to associate with it.
| | 00:22 |
If we then instantiate the prefab
throughout the design, Unity will refer
| | 00:26 |
back to the original prefab, and instead
of drawing a new one, simply reference it.
| | 00:32 |
This lets us batch and call occlusion.
What that means is that, instead of
| | 00:37 |
defining it once at game time and then
redefining, we'll simply define once.
| | 00:44 |
And also, we can cull them down, meaning
we can draw out only what we see and
| | 00:48 |
thereby reduce our draw culls.
Even in a prototype stage, it's worth
| | 00:53 |
creating come prefabs versus just placing
stuff all over.
| | 00:57 |
Most of the objects are okay as prefabs as
they are.
| | 01:00 |
For example, the vault semicircle pair
objects that I've been using are just fine
| | 01:04 |
as the FBX with their colliders.
But some of the more complex door pieces
| | 01:09 |
could stand a little work on the prefabs
first, before I place them throughout the scene.
| | 01:14 |
I'll scroll down and pick one of my wall
doorway collections.
| | 01:18 |
I'll move off to the side here in my
scene.
| | 01:20 |
This way, I have a little bit of working
room, and I'll pick, for example, wall
| | 01:25 |
doorway A01, I'll drag it into my scene
and press F to focus.
| | 01:30 |
This is actually composed of three objects
here: a wall, a door frame, and a door.
| | 01:36 |
What I'm going to do is to assign some
separate colliders here.
| | 01:40 |
In this case, breaking a prefab, and then
remaking it.
| | 01:43 |
So that once I've got this done, I can
animate the door, and then take this
| | 01:46 |
prefab and clone it around.
I'll start out by picking the door and
| | 01:51 |
removing the Mesh collider by right
clicking on Mesh collider and choosing
| | 01:55 |
Remove Component.
Now, on this door object, I'll put a box
| | 02:00 |
collider, choosing Component, Physics, Box
collider.
| | 02:04 |
A box is the simplest and cheapest kind of
collider we have.
| | 02:09 |
And although the door is actually just a
box, I'm preparing for the future where
| | 02:12 |
the door may have more geometry.
I may also want to put a Physic material
| | 02:16 |
on if I'm thinking that far.
This door could be for example, metal, or
| | 02:20 |
wood, and need to bounce things correctly
if we use physics.
| | 02:24 |
I'm going to leave that alone, and I'll
leave my door frame as a mesh collider and
| | 02:28 |
my wall doorway as a mesh collider.
What I will also do though is get a
| | 02:33 |
trigger on this.
A trigger for us for animation, lets us
| | 02:36 |
walk into a zone and have the door open
for example.
| | 02:40 |
What I'll do is create a new game object.
I'll choose Game Object > Create Other >
| | 02:46 |
Cube, there's this cube.
And I'll scale it up, either in the scale
| | 02:49 |
in the inspector, or by pressing R for
scale.
| | 02:52 |
I'm going to make this fairly big, so that
when we enter this zone, the door will
| | 02:57 |
swing out.
I'll select it, press V for snap while I
| | 03:01 |
move, and snap this down to the bottom of
my wall.
| | 03:05 |
I'll switch over to a texture plus wire,
so, I can see what I'm doing a little more
| | 03:08 |
clearly, as this is unlit at the moment or
in shadow.
| | 03:12 |
I'll pull this into place.
So, this will be the zone in which I
| | 03:15 |
trigger an animation, what I'll do then is
turn off the mesh renderer for this box.
| | 03:21 |
In this case then, it's simply a box
collider and I can turn on his trigger, if
| | 03:25 |
I need, and have it trigger in animation.
Now, I'll take this cube and drag it into
| | 03:31 |
that wall doorway prefab to parent it,
I'll even make sure I name it.
| | 03:36 |
Instead of just cube, we'll call it, Door
Trigger.
| | 03:39 |
Now, I've got a prefab called Wall Doorway
AO1.
| | 03:42 |
It's got a trigger object in it, a
separate box collider for the door, and
| | 03:46 |
mesh colliders for the door frame and
walled doorway.
| | 03:50 |
I can get different materials on if I
need, but I'll call this good enough for
| | 03:53 |
my prefab for now.
I'll take this walled doorway and drag it
| | 03:58 |
back over into my assets.
This way it becomes a prefab and I can see
| | 04:02 |
it here marked with a different icon.
I need to organize my assets a little bit,
| | 04:07 |
probably putting the FBXs in a folder of
their own and keeping my prefabs in a
| | 04:10 |
separate folder would be a good idea.
I'll make prefabs out of the pieces I
| | 04:16 |
need, such as my wall doorway object.
I can even delete this one here in the
| | 04:20 |
hierarchy and drag straight from the
assets into that hierarchy to clone new ones.
| | 04:25 |
These actually now share properties, it's
the same object back and forth.
| | 04:30 |
And this way, if I change one here in the
wall doorway, they'll all change.
| | 04:34 |
| | Collapse this transcript |
| Inserting unique areas| 00:00 |
I've added in a few more pieces, placing
around more modules, and extending out the
| | 00:04 |
start of the storefronts onto my map.
Following the layout of the map, given
| | 00:08 |
that the size of my modules and the scale
of my map are a little off, I'm okay with
| | 00:12 |
seeing the modules placed together in the
order of the map, because I like the order
| | 00:16 |
I defined, and in a test with my
first-person control, the size of my
| | 00:19 |
module as I built them feels okay.
I'll give it a quick play to show some
| | 00:25 |
things that I need to work on.
I'll press play, and I've changed the spawn.
| | 00:31 |
So I start out at the star.
I look up, and there's the dome.
| | 00:34 |
And obviously, the lighting is just there
to show a little bit of what's going on.
| | 00:39 |
As I spin around, I can see some areas are
capped.
| | 00:41 |
And some areas lead me down halls into
other shops.
| | 00:44 |
I'll navigate through, pressing W to move,
and watching out for blank sections,
| | 00:49 |
exploring as I go.
I see a glimmer of light up ahead, and the
| | 00:53 |
start of the outside world.
I'll poke my way through, noticing that
| | 00:57 |
I've got some extra passageways to go
explore later.
| | 01:00 |
And finally, I get out into one of the
main streets in the Medina.
| | 01:03 |
I got stores in and I can see definitely
that I need side walls on the store
| | 01:06 |
fronts, but the scale feels pretty good
and the field of view seems to work.
| | 01:12 |
But I can also see, even with these models
in here, I notice some repetition, even
| | 01:15 |
with the texture change there's a good
chance I'm going to need a unique area of
| | 01:19 |
some kind.
As I travel out here, and turn around to
| | 01:23 |
look back, I've got a pretty good field of
view going on in my game.
| | 01:27 |
So, it's working fairly nicely.
Now with my modules verified, at least so
| | 01:31 |
far, I can really start to look at unique
areas that add a different element to the
| | 01:35 |
game play.
At the moment, it's simply a modular
| | 01:39 |
construction, and quickly enough, we can
see we've got the same shop selling the
| | 01:43 |
same stuff.
Again.
| | 01:46 |
So we'll go back to the map and see where
we can inset something different and unique.
| | 01:49 |
Here in the map even in the top view by
pressing on the Y access, we can see we've
| | 01:53 |
got places where we might want to put in
something different.
| | 01:58 |
I'll tap the space bar to go full screen
here in unity.
| | 02:01 |
We can see where we've started out, as
given by this star in the (UNKNOWN) point
| | 02:04 |
and also the bits and pieces we can see in
our top view.
| | 02:08 |
A unique area then, is maybe a one off
design.
| | 02:10 |
There's a large structural column that
only shows up once, although its element
| | 02:15 |
might be modular, it's not repeated
throughout the city.
| | 02:19 |
This could be a large covered hall for
example or a central square with a unique fountain.
| | 02:24 |
I have an opportunity in several places to
put this in.
| | 02:27 |
I could replace this long shop at the top
here with more of an ornate passageway
| | 02:31 |
into my unique area at the edge of the
map.
| | 02:35 |
I also have a place here in this larger
public square I've created to put in a
| | 02:38 |
fountain, instead of just more kiosks.
What we want to think of is, given our
| | 02:43 |
design, what is a unique area look like.
And I'll go back and look at the reference
| | 02:47 |
photos to see if there's anything I can
draw from them.
| | 02:49 |
Here in my reference photos in the
exercise files, I've got one photo that
| | 02:53 |
has a bit of a clue as to something
unique, I'll preview this and see how this
| | 02:56 |
looks larger.
This is some kind of a covered walkway
| | 03:00 |
with a rug merchant showing his or her
wares out here, on the columns and up on
| | 03:03 |
the walls.
Plus there's an ornate tiled maybe
| | 03:07 |
fountain here off to the side or something
similar.
| | 03:10 |
We can see also in the bottom left that
there's a bit of grass there and some kind
| | 03:13 |
of walkway outside.
There's a good chance that this is some
| | 03:17 |
kind of courtyard we're looking into, or
on the edge of.
| | 03:20 |
We can tell by the architecture here that
it wraps around that corner.
| | 03:24 |
So, if I plan in some kind of larger
courtyard, which is common in these kind
| | 03:28 |
of architectures, that this might be a
good choice for my unique area.
| | 03:33 |
This is also another indicator of unique
area here.
| | 03:36 |
This is actually in a museum starring
through an archway, with tile work to
| | 03:40 |
fountains and maybe a large chandelier in
the center.
| | 03:44 |
It's a large indoor space filled with
light.
| | 03:47 |
This is another good choice for a unique
area where I can bound my unique area
| | 03:51 |
whether it's an inside space or a
courtyard outside, in my other modules.
| | 03:56 |
And it's more of a distinct space with
some distinct artifacts than a completely
| | 04:00 |
unique piece, I'll go back to illustrator
and see if I can lay this out quickly.
| | 04:06 |
Here in illustrator I'm on my layer one,
and I'm going to grab to start some of my
| | 04:10 |
collenade or lowgian modules.
There's one in here that I want to use in
| | 04:15 |
particular, a single module.
I'll hold alt, and make a clone of it off
| | 04:19 |
to the side and zoom in, pressing z to
zoom and clicking and dragging a region.
| | 04:23 |
What I'm going to do, is clone this out to
make a square, holding alt to clone and
| | 04:27 |
clicking and dragging.
Now with that in there, I'll hit enter and
| | 04:31 |
it wants to move the same distance.
I'll copy this a few times pressing enter
| | 04:37 |
and copying.
There's eight total and now I'm going to
| | 04:41 |
take these two picking one holding Shift
and picking the other.
| | 04:44 |
And copying them zero on the horizontal
and 200 on the vertical.
| | 04:49 |
Note, that I've got preview checked so I
can see where its going.
| | 04:52 |
I'll copy these down 1, 2, 3, 4 times.
This way I have a rectangular courtyard,
| | 05:00 |
so I'm already setting up some asymmetry.
And copy it down 200.
| | 05:06 |
And then hit enter and okay to move.
I don't mind a couple extra moves.
| | 05:11 |
Because it, spares me from having to
figure out how much.
| | 05:14 |
This will be a unique area.
That then I can bound, let's say, with
| | 05:17 |
other shops.
I'm still working within my modular design.
| | 05:20 |
But I'm having some fun and flexibility
with the elements I've got.
| | 05:24 |
I'll grab one of my single shops or
something that fits on here, snap it into
| | 05:28 |
place, and see if I need to scale it at
all.
| | 05:31 |
We can scale things a little bit in our
map, and simply make note that we need
| | 05:34 |
slightly smaller shops here when we
actually go and create them.
| | 05:39 |
Now, I'll take these pieces and slide them
over slightly.
| | 05:42 |
We can see that I want them to line up on
the center roughly.
| | 05:45 |
And I can always come back and fix the
doors.
| | 05:47 |
I don't mind having to do some fixing once
I build it in 3-D, it's really the overall
| | 05:51 |
spacing here that I've got, but it's a
great way to try and add to my existing scene.
| | 05:57 |
I'll do four there, and take these four
and I'll clone them up, rotate them while
| | 06:01 |
holding shift and snap them on the side.
I'm using the snap tools in illustrate,
| | 06:06 |
the Smart guides here, to just to be able
to snap peeves precisely on.
| | 06:10 |
Snapping where it says intersect, for
example.
| | 06:13 |
And the tool switch in there, because it
was kind of fast.
| | 06:16 |
V for selection, a for direct selection.
Which lets me snap to points instead of
| | 06:20 |
having the transform handles.
And then snapping right onto intersect or
| | 06:25 |
anchor on a point.
This is the start of a unique area.
| | 06:28 |
It's a piece that is, not necessarily,
again, different.
| | 06:32 |
But has a unique character as different
from the rest of the map.
| | 06:36 |
Now I'll take these top pieces.
I'll clone them up, flip them around, and
| | 06:40 |
slide them over.
There's this area.
| | 06:43 |
And now I'll take this whole courtyard
here, that I've really set out as a
| | 06:46 |
special space with a different character,
maybe this is the jewelry section for
| | 06:49 |
example, and it's rather closed off from
the rest of the regular world.
| | 06:54 |
And I'll replace this shop, taking it out,
and putting this piece in.
| | 06:58 |
I'll land it, snuggled up right to the
other shops with the idea that I'll have
| | 07:02 |
some kind of pass through or passageway in
here.
| | 07:06 |
And I can enter into a unique area, that
might require some custom modelling of
| | 07:09 |
this one piece.
But will lend a whole different character
| | 07:13 |
to the rest of my map.
Now I can form this either out of existing
| | 07:16 |
pre-fabs I have or make a note.
Yes, I need to make this in Maya
| | 07:20 |
eventually and bring it into my scene, so
I can add to the character of my market place.
| | 07:26 |
| | Collapse this transcript |
| Populating with props| 00:00 |
One of the most important things to see in
our market, are the goods that each vendor
| | 00:04 |
is selling.
So far, we started to at least handle the
| | 00:08 |
basic geometry of where the shops are, if
not the actual look.
| | 00:12 |
But as we can see in this reference image,
there's an enormous amount of stuff that
| | 00:15 |
needs to go with these.
Outside of this one particular shop for
| | 00:20 |
example, there are beans and grains and
spices in large, colorful sacks all
| | 00:23 |
arranged on benches.
And hanging overhead, we have dried gourds
| | 00:29 |
and ornamental pieces.
In the shops next door, we can see hanging
| | 00:33 |
bags and still more pieces laid out on
tables.
| | 00:36 |
And the shops go back fairly deeply with
the shelves stacked high with all manner
| | 00:40 |
of goods for sale.
What we want to think about then is how to
| | 00:44 |
avoid prop fatigue, as in not having
enough props to go around, while still
| | 00:48 |
managing our props reasonably.
We have a start for this in our texture sheet.
| | 00:54 |
I designated eight spaces just for props,
just raw spaces to do things like layout
| | 00:59 |
hats or layout spices for example.
This is good but we do need to make sure
| | 01:05 |
that we have enough to go around, even
with the (UNKNOWN) of texture space.
| | 01:09 |
I'll try a quick test in Unity, making
some boxes into props.
| | 01:12 |
And assigning some different materials to
see if i have truly enough to go around
| | 01:16 |
with my limited kit, or I need to rethink
the number of props I'm dealing with.
| | 01:21 |
Here in Unity, I'm going to create some
new pieces.
| | 01:24 |
In my scene, I'll make a new cube and
scale it which is going to be a bench or
| | 01:28 |
maybe a table.
I'll start out by choosing Game Object >
| | 01:32 |
Create Other > Cube.
And in my scene, there is a simple cube.
| | 01:37 |
I'll spin around, and notice that as I
change this here, as I click on the cube,
| | 01:42 |
I switch from iso over to a perspective.
We can see it better here in a wire frame.
| | 01:48 |
In this case here's ISO, whereby clicking
on ISO I have a perspective and I have
| | 01:52 |
either method to work in.
What I'll do then is scale this, knowing
| | 01:57 |
that the default is one by one by one
meters.
| | 02:00 |
I'll stretch this out to be two meters
long, half a meter wide and half a meter
| | 02:04 |
high, a long, low table suitable for
props.
| | 02:09 |
Onto this, I'll add on, maybe a sphere or
something similar.
| | 02:12 |
I'll take this sphere and size it down to
maybe 0.25 on a side /g.
| | 02:17 |
It doesn't have to be anything particular,
but really that I'm just showing I have stuff.
| | 02:22 |
I'll switch back over to textured and
assign some materials here temporarily.
| | 02:26 |
I'll right-click and choose Create >
Material.
| | 02:29 |
This new material, will be just a diffuse
shader in here because I don't need a
| | 02:33 |
shine and will be, pick a color.
How about blue so it's easily recognizable.
| | 02:39 |
I'll take this new material and drag it
onto my bench, making sure that I select
| | 02:42 |
the bench and pulling the material in.
Now, I can see how many incidences of my
| | 02:47 |
blue bench I have.
I'll also duplicate this sphere by
| | 02:51 |
pressing Ctrl+D, move it over and
duplicate it one more time.
| | 02:55 |
Then, I'll take these three spheres and
drag them onto my cube.
| | 03:00 |
That way, they're parented to it, so by
picking the cube, it actually picks all of
| | 03:03 |
my objects.
This is one table at a vendor, we'll say.
| | 03:07 |
And I'll pull it into my built section to
see how this is working.
| | 03:10 |
I'll press F to focus in and V for snap.
And I'll snap this down to the base of one
| | 03:15 |
of my walls.
For example, I'm going to take this and
| | 03:18 |
populate a bit of a store with it and see
what I need.
| | 03:23 |
I'll zip around inside this store looking,
roughly where this store is based on its walls.
| | 03:28 |
And try to populate it roughly so, it
feels like easily this store will swallow
| | 03:32 |
six tables.
And so, if I'm not careful, I can rapidly
| | 03:36 |
approach prop fatigue, where I end up with
three or four of the same thing in the
| | 03:41 |
same shop.
Right now, I have eight of these tables
| | 03:45 |
going to populate this one store and I can
see some repetitive geometry going on.
| | 03:50 |
What this tells me is in the design of my
props, I can actually have a texture sheet
| | 03:54 |
just for props an furniture.
An that's very workable to do, where we
| | 03:59 |
end up with a 2K square texture, or 2,048
on a side, that's just all manner of
| | 04:03 |
things to populate our market.
It's one texture, which'll probably show
| | 04:08 |
up in three or four materials.
But be loaded once and that way we can
| | 04:13 |
have fruits and spices and meats and
baskets and hats.
| | 04:17 |
And rugs all together and get the visual
richness we deserve in our props.
| | 04:22 |
These are currently not prefabs.
We can tell they're not prefabs, that
| | 04:26 |
they're just experiments here, because in
the hierarchy on the left the names are
| | 04:29 |
not blue like the storefronts.
These are white, meaning they're all duplicates.
| | 04:34 |
And so if I change one, they're all not
going to change.
| | 04:38 |
So, what I need to do, is make sure that I
model out some prop tables.
| | 04:42 |
Quite possibly we'll need five or six
tables.
| | 04:45 |
Five or six varieties of every vegetable
and five or six varieties of everything else.
| | 04:50 |
Modelling out a ton of props to fill out
our space.
| | 04:53 |
Along with it, we'll need to think of any
other display we need.
| | 04:57 |
Hooks, shelves, racks and so forth.
And so, we can have quite a long list of
| | 05:02 |
simply the props we need in here.
And we can see just by populating one
| | 05:05 |
store front, how many pieces we're going
to need in our level.
| | 05:09 |
It's important to think about, because we
can spend a lot of time making props to
| | 05:12 |
flesh things out.
Making the basic spaces is easy, but as we
| | 05:16 |
can see navigating around, it's rather
empty.
| | 05:19 |
And we want to have the visual richness in
our game, that we see in our reference photos.
| | 05:23 |
So, we need to make enough stuff, just to
fill up that scene without completely
| | 05:27 |
bogging down our engine.
| | 05:29 |
| | Collapse this transcript |
|
|
4. Adding Animation to Bring the World to LifeCreating animation in Unity| 00:00 |
In a game, along with the static
environment pieces, we need animated
| | 00:04 |
assets to bring the scene to life.
If we don't put life into a scene, it is
| | 00:08 |
exactly static and kind of dead.
So what we want to do is think in terms of
| | 00:13 |
two kinds of animation to really add some
sizzle to our game.
| | 00:18 |
There's character animation we'll see,
both the non-player characters and
| | 00:21 |
possibly a third-person-player character,
for example.
| | 00:24 |
Animating, running around the market in
this case.
| | 00:27 |
There's also ambient animation.
An ambient animation can include
| | 00:31 |
characters, but also includes things like,
spinning fans or flickering lights.
| | 00:36 |
It might include traffic in the distance,
or even an animated sky, showing clouds
| | 00:40 |
passing by.
The ambient animation is something that's
| | 00:43 |
always around us in the world.
It ranges from wind ruffling clothing, to
| | 00:48 |
ripples on the water.
We need to think about putting this in and
| | 00:51 |
where to put it in, to really add some
life to our scene.
| | 00:55 |
I've modeled a few extra pieces here.
We can see some more detailed objects,
| | 00:58 |
placed exactly over the white boxes for
the prototype.
| | 01:02 |
For example, I've taken a very basic
archway here and replaced it with a wall
| | 01:05 |
and a pointed arch.
I've also put a keyhole arch in and
| | 01:09 |
finally a bit thicker of a standard
rounded arch.
| | 01:12 |
There's some additional wall elements here
behind the dome.
| | 01:15 |
Again, the keyhole and pointed arches
ready to place around the scene to bound
| | 01:18 |
the scene in.
These are over the prototype white box
| | 01:22 |
elements, so that when I re-export the FBX
it will go exactly in that place and be a
| | 01:26 |
straight replacement once through any
prefabs in immunity.
| | 01:31 |
There's 2 extra buildings here in the
scene ,these are our long store
| | 01:34 |
fronts,each of them has an outside shell,
an inside wall,a floor,a threshold that is
| | 01:39 |
part of the outside shell.
So there is a difference in flooring and a
| | 01:44 |
back door, so we can duck at the back if
we need.
| | 01:47 |
Beyond these there's a fan inside, I'll
zoom in and take a look at it.
| | 01:52 |
There's a fan blade and housing assembly,
a mounting and a light at the bottom.
| | 01:58 |
This is the kind of thing that can really
add some life in the scene, just simply
| | 02:00 |
the fans in the room are on and turning
slowly.
| | 02:04 |
We can also have the lights on, or come on
when the player enters or even be on but
| | 02:07 |
flicker occasionally as if the power is
pretty good but occasionally dips.
| | 02:13 |
We want to think of objects and where and
how we're going to animate them when we're
| | 02:16 |
talking about ambient animation.
This way, we can decide whether to animate
| | 02:20 |
here in maya or in unity.
For materials, the things that transfer
| | 02:24 |
from Maya are really the placement,
diffuse colour and the name.
| | 02:28 |
Other material attributes are handled in
unity distinctly, so materials should be
| | 02:32 |
animated there.
For objects we can take animation over I
| | 02:35 |
could take this fan and animate in Maya
here and export it via FBX out.
| | 02:39 |
But this is the kind of thing I can
animate in unity quite easily and so I
| | 02:42 |
will do it there.
Characters may get animated here in Maya,
| | 02:46 |
and that animation will come across
separately, and then dealt with in the
| | 02:49 |
Mechinam animation system immunity for
blending between different animations, but
| | 02:53 |
that's beyond the scope of this course.
I've exported out the FBXs, and brought
| | 03:00 |
them into Unity, overwriting the originals
so that they update in the new scenes I'm
| | 03:03 |
going to use.
I'll go into Unity and see how this looks,
| | 03:08 |
and then bring the fan in to make it spin.
Here in Unity, I've opened up Scene
| | 03:12 |
04_01_ani_start from the 04_01 folder in
the Assets folder.
| | 03:17 |
I've also fixed my market map, downsizing
that image, so it comes in and displays at
| | 03:22 |
a max res of 2048.
I downsize this in Photoshop as well,
| | 03:27 |
reducing it from 4096 to 2048, to save
some space.
| | 03:31 |
I reapply that in a material called Market
Map, making sure I go in and select that
| | 03:35 |
texture correctly.
When you rename a texture, it'll break the
| | 03:40 |
link needing a manual relinking so it
displays correctly.
| | 03:44 |
Now I'll bring my storefront in.
I'll go into the Imported Meshes folder.
| | 03:48 |
What I've done is to create folders by
right-clicking and choosing, Create Folder.
| | 03:52 |
Naming them appropriately so I can
organize my scene.
| | 03:55 |
I've put all of my imported FBX objects in
the imported meshes folder and this way I
| | 03:59 |
can have a folder seperate for animations
for example, or materials or textures or
| | 04:03 |
even scripts.
And my assets folder gets a little bit
| | 04:08 |
more manageable.
In imported meshes I've got all of my new pieces.
| | 04:12 |
What we can see here is that by exporting
those fbx's and positioning the object in
| | 04:16 |
the same place as the white, box objects,
the new detailed objects such as archway A here.
| | 04:24 |
Is coming across correctly with it's
correct attributes here in the inspector.
| | 04:28 |
A scale of one colliders is on.
And if we look down in the preview here,
| | 04:31 |
there's that detailed archway ready to
place.
| | 04:34 |
If I've already placed it in the seam,
that archway will ripple through, changing
| | 04:37 |
every prefab it's used in.
I'll pick my storefront long A01.
| | 04:41 |
It's the long store with the back door.
And I'll put a fan into it.
| | 04:46 |
First, i'll drag it into my scene,i am
going to land this, and get its fan in,
| | 04:49 |
and then place it around.
I will press f to focus and zoom in on
| | 04:54 |
this object, its dark because the way the
sun is,the direction of light i am using.
| | 04:59 |
I can put a separate light in once i get
the fan in, or work in a wire frame ,i
| | 05:02 |
will pick my ceiling fan object, when we
export an fpx its got multiple objects in it.
| | 05:09 |
It shows up as one object here and we can
open it up in the imported meshes by
| | 05:12 |
clicking on the right arrow.
There's an avatar, and the five pieces
| | 05:17 |
along with the transform.
I'll take this ceiling fan and drag it
| | 05:20 |
into my building.
It's in here but it's a little off because
| | 05:24 |
I'm in a perspective.
I'll pull this back over and press F to
| | 05:27 |
focus in.
Making sure i take the fan and place it up
| | 05:31 |
against the ceiling.
One more way to do this, is go into a side
| | 05:34 |
or front view for example and change in
this case my left view to an isometric by
| | 05:38 |
clicking on the word, left then i will
switch over to a wire frame so i can see
| | 05:42 |
through the building and move it up.
I will move this up and zoom in,press v to
| | 05:48 |
snap ,perhaps taking an over near vertex
so i can zoom in more, I'll press V to
| | 05:52 |
snap, and snap this fan right up to the
ceiling, then zoom out and place it.
| | 05:58 |
It will be dark in this building, so what
I also need to do is to get a light in,
| | 06:01 |
which I'll do by choosing Game Object,
Create Other, Point Light.
| | 06:06 |
Now, I'll switch back to a perspective by
holding Alt, and clicking and dragging the
| | 06:10 |
left mouse, and then changing from ISO to
a perspective.
| | 06:13 |
I'll make sure my fan is in the scene.
It's a ceiling fan prefab.
| | 06:17 |
And I can tell by the blue writing here on
the side.
| | 06:19 |
I'll pull this over, and go in.
Changing over to maybe textured so I can
| | 06:24 |
see better.
And there, at least in gray is my fan lit
| | 06:26 |
with a temporary light.
Now, I'll get this object animated.
| | 06:30 |
To animate, we can choose window and
animation from the top menu.
| | 06:35 |
The animation menu is a lot like the graph
editor in Maya, or the curve editor, or
| | 06:39 |
mini curve editor in 3Ds MAX.
Using function curves to define animation
| | 06:44 |
between keys, and able to interpolate them
as needed.
| | 06:48 |
What I'll do, is open up that ceiling fan
prefab and select fan housing, which is
| | 06:52 |
the actual object I want to spin.
Here in the animation menu, first, I'll
| | 06:57 |
click on the animation button.
What this one's to do, is add a component
| | 07:00 |
onto the ceiling fan for animation.
I'll click Add Component.
| | 07:04 |
And the component I'm going to add is a
.anim file, which I'll place in the 04_01 folder.
| | 07:11 |
I'll call this 04_01, ceiling fan or
spinning fan.
| | 07:15 |
This way I have a unique callable object
of an animation that's separate from the object.
| | 07:20 |
With an FBX, those are embedded.
I'll click Save, and now I'm ready to
| | 07:24 |
animate that fan.
To make it spin, what I'll do is first
| | 07:27 |
pick what I'd like to animate.
In this case, it's the y axis I'll be
| | 07:31 |
spinning on.
I can press e for rotate, and add a key by
| | 07:34 |
clicking on the Add Keyframe button.
There's a key here at zero of a value of zero.
| | 07:40 |
There's no spin.
I'll go over two seconds here so that it
| | 07:44 |
goes around once every two seconds in a
slow loop.
| | 07:47 |
I'll click and drag on that fan and hold
control to snap it.
| | 07:51 |
In this case, I'm watching this animation
go, and we can see it cycling here as I
| | 07:55 |
scrub side to side.
Alternately what I can do, is click in
| | 07:59 |
here and enter a value.
There's a 360 degree animation, with
| | 08:02 |
tangents at linear.
As it's a fan, I'd like it to loop
| | 08:05 |
continuously, instead of starting and
stopping.
| | 08:08 |
It depends on the animation you'd like.
If it's something like a door, for
| | 08:12 |
example, you might want this to open over
95 or 97 degrees and ease to a start and stop.
| | 08:18 |
And you can do this by selecting the key,
right clicking, and changing the tangent types.
| | 08:23 |
We've got tangent types of auto, free
smooth, flat and broken, and also, in and
| | 08:27 |
out for left and right tangents.
I'm going to leave this alone at linear,
| | 08:32 |
as I want a constant smooth motion on
this.
| | 08:35 |
I'll close the animation menu, and now on
this fan object, I've got this animation.
| | 08:40 |
It's called 0401 spin fan, and we can see
it here attached to that prefab.
| | 08:45 |
What it also says is play automatically.
And under Animations if we'd like we can
| | 08:49 |
have more than one.
For example, on a character you may have
| | 08:52 |
more than one animation, which will load
depending on what you're doing.
| | 08:56 |
I'm going to change the Culling type from
Always animate, to Based on Clip Bounds.
| | 09:01 |
This way whatever I see in the camera will
animate but the fan won't be spinning if
| | 09:04 |
I'm not seeing it.
Finally, I'll click on the actual animation.
| | 09:09 |
Going back in my assets folder, and into
0401.
| | 09:12 |
And there's that, 0401 spin fan.
With every animation, we can determine a
| | 09:17 |
wrap mode.
What this means is, how does that
| | 09:19 |
animation work?
It's the equivalent and Maya of pre and
| | 09:22 |
post infinity.
Or in the out of range types in 3DS Max.
| | 09:26 |
I'll set the Wrap Mode for the fan to
Loop.
| | 09:29 |
That way it loops continuously, spinning
away.
| | 09:32 |
I'll press Play, and see how my game
looks.
| | 09:35 |
Starting at my spawn point, zooming in to
go look at the fan, and I should see it
| | 09:38 |
spinning in the room.
Once I enter into my store, I can see that
| | 09:43 |
fan has started, and there it is looping.
With the wrap mode set to loop and the
| | 09:47 |
keys at linear, it's going to sit there
and, well, turn slowly as fans do,
| | 09:50 |
hopefully keeping the shop a little
cooler.
| | 09:54 |
It's a great way to add, just life to the
scene.
| | 09:56 |
Somebody simply has the fans on, and we
can use different animations.
| | 10:00 |
If you'd like you can even script in some
randomness, so it starts at a random place
| | 10:04 |
so the fans aren't all, quite in sync.
| | 10:06 |
| | Collapse this transcript |
| Animating materials| 00:00 |
In our game beyond animating objects
sometimes we want to animate a material to
| | 00:04 |
bring a scene to life.
An example is this ceiling fan in the
| | 00:08 |
foreground of my scene.
I'm going to say that in this store most
| | 00:11 |
of the fans are on and worked as fine
except for this one.
| | 00:15 |
This particular fan is spinning but the
bulb is flickering and so I want to
| | 00:18 |
animate the material and possibly the
light as well.
| | 00:22 |
I have made a new object in here called
ceiling fan flicker in my clone of the FBX
| | 00:26 |
in my 042 folder, in my assets.
I have got scene 04 materials start open.
| | 00:33 |
And I have also copied that animation file
spin fan calling it 042 spin fan.
| | 00:39 |
What I am going to do is open up the
ceiling fan flicker (INAUDIBLE).
| | 00:43 |
And select fan housing.
Right now there's no animation on it.
| | 00:47 |
So, I'll take my 04-02 animation and drag
it across to add the component.
| | 00:52 |
It adds on that animation.
And I'll change my culling type down to
| | 00:55 |
Clip Bounds.
It's going to play automatically and
| | 00:58 |
opening up animations I can see there's
that animation in element 0.
| | 01:03 |
Again if we need, we could randomize this
with a script but I'm going to leave it
| | 01:06 |
alone for the moment.
With all of our animations if we select
| | 01:09 |
them we'll actually see where they are and
what they're related to in the elements.
| | 01:14 |
Now, get a material on.
What I'll do is right click in the 0402
| | 01:18 |
folder and choose Create and Material.
I'll name this new material flickering
| | 01:24 |
bulb, in the inspector I will change the
material type Diffuse over to Self-Illumine.
| | 01:29 |
A Self-Illumining material is one that can
look like it emits light.
| | 01:33 |
We've got a lot of standard material types
here Bumped Diffuse, Bumped sSpeculiar
| | 01:37 |
,Parallax and so far.
I'm going to make this a speculiar
| | 01:41 |
material so it got this a shine to it It
looks white to begin with because we
| | 01:44 |
haven't set in in an alpha channel the
self-illumination.
| | 01:49 |
What I'll do is first make the main color
a warmer yellow.
| | 01:52 |
Clicking on the color, and I like to work
in HSV or hue saturation value for my
| | 01:56 |
colors, which you can access by clicking
on the Slider Change button.
| | 02:01 |
Now, I'll drag the hue over, swinging into
the yellow range.
| | 02:05 |
And bringing up saturation so the color
has some warmth to it.
| | 02:08 |
Finally, I'll back off the value a touch
and I can just start to see a little
| | 02:11 |
yellow coming into that color.
I'll close this and I'm ready to get this
| | 02:15 |
animated once I get it on the fan.
I'll pick Fan Light 01 and then I'll drag
| | 02:20 |
this material onto it making sure I don't
accidentally hit the walls.
| | 02:24 |
With that material on, it looks like my
fan is lit when I deselect, so I can see clearly.
| | 02:29 |
I'm ready to get this animated.
And so, I'll select the fan light one
| | 02:32 |
object here.
And go up to my animation window by
| | 02:36 |
choosing Window and Animation.
Here, in the Animation window, I'm going
| | 02:40 |
to make a new.anim file for this.
First, I will click on the red button to
| | 02:44 |
make a new animation component, I will add
it in and I will call this one in the
| | 02:49 |
04_02 folder 04_02_light, may be light
flick.
| | 02:54 |
Now that that's in, I can choose what to
animate I've got my standard trends form
| | 02:58 |
and if I roll those up, I've also got the
material I'll open up Fan Light and
| | 03:02 |
there's the flickering bulb material.
And in that flickering bulb material, I've
| | 03:09 |
got my colors, my speculiar colors and my
illumine colors and offsets.
| | 03:14 |
Depending on how we'd like to play with
it, we can animate one or all of these components.
| | 03:19 |
What I'll do for this particular fan is
actually animate the color dimming down
| | 03:23 |
and this way although it's still bright,
it'll be a brighter Blacker, or darker color.
| | 03:29 |
Here's how I'll make this work.
I'm going to pick the color R, and create
| | 03:33 |
a key.
Then I'll go over on color G, and a key,
| | 03:35 |
and finally on B and create one.
I can also pick all of these here and
| | 03:39 |
create more keys.
I'll zip over maybe 20 frames or so.
| | 03:49 |
Make a new key and change those values,
starting with red here I can pull these
| | 03:52 |
keys down, the fan goes a little bluer as
I pull the red down and as I pull the
| | 03:56 |
green down here we'll see it go really
blue.
| | 04:01 |
And finally I will pull the blue down and
it will go dark.
| | 04:04 |
You want to be careful we are not going to
far, we can see as I drag these values
| | 04:07 |
down that very quickly my fan went black
as I scrub back and forth here on the
| | 04:11 |
timeline it goes from white to very dark
very quick.
| | 04:16 |
The reason for this is that in that color
value it goes between 0 and 1.
| | 04:21 |
And so, rather than going from .9 down to
negative 69, I should probably go down at
| | 04:26 |
this key to something much, much smaller.
I'll go to the key here and actually
| | 04:32 |
manually put in a value as it's too hard
to simply drag that.
| | 04:35 |
I'll put in the color R at 0.5.
Here's a color G at 0.4 so it's got a
| | 04:41 |
little warmth, and a color B at 0.35.
This way, although it looks like that
| | 04:47 |
curve is flat, it's got a tiny bit of
animation and the fan, which we can just
| | 04:50 |
see here.
Seems to wink a little bit over that one second.
| | 04:54 |
We can speed this up if we need or add in
another key.
| | 04:57 |
So, let's say at frame 40 we're going to
bring this back up by creating a new key
| | 05:01 |
and changing that color.
But we can also see an animation here is
| | 05:05 |
that up on top in my UI.
My play, pause, next button are
| | 05:09 |
highlighted in red.
So, if I pull up something and change a
| | 05:13 |
color, it will show.
For example, picking phantom light, and
| | 05:16 |
there's my flickering bulb animation, when
I click on that main color and here I show
| | 05:20 |
the color box at the new frame.
Frame 40 or so.
| | 05:25 |
Scrubbing that value over puts a key in,
and I can see that changing.
| | 05:29 |
What I may want to do then on these keys,
is let them loop or copy a key over or
| | 05:33 |
restore the value so I have a looping
animation.
| | 05:37 |
Alternately, I can go in and randomize
this a little further.
| | 05:40 |
Going in again at maybe a second plus.
Pulling the value down.
| | 05:44 |
And finally, over at, let's say, 130,
pulling it back up.
| | 05:49 |
Now, I've got a neat looping animation or
nearly so.
| | 05:51 |
It'll have a little skip here at the end,
which actually may work in my favor.
| | 05:55 |
Alternately, I could take these keys, and
slide them across or copy and paste the values.
| | 06:00 |
I'm going to leave it alone and see how
this behaves as it is.
| | 06:03 |
We can always fine tune it once we've got
it.
| | 06:05 |
I'll select my animation, called 0402
light flicker, and I'll set the Rap mode
| | 06:09 |
to maybe Ping Pong, so it's going to go
forward and reverse in the animation in
| | 06:13 |
there, and get me a unique pattern.
I'll play my scene and see how this looks
| | 06:18 |
if my fan is having trouble as it's
spinning.
| | 06:22 |
I'll run in the back door, and we can just
see in here that that fan is just changing
| | 06:26 |
a bit.
It's flickering off and on.
| | 06:29 |
We can see some of the color coming back
in.
| | 06:31 |
And so I could go back in the animation
editor and play with some of the other
| | 06:34 |
pieces, like the self-illumination.
Or darken this color so that its a self
| | 06:38 |
illuminated much darker brown or nearly
black.
| | 06:42 |
But that fan is definitely having
problems.
| | 06:44 |
If we scroll back we can see them
animating.
| | 06:47 |
We just saw a little goof here, and what
that goof is, is that my clip bounds
| | 06:50 |
didn't catch the first fan and so it only
turned on when I saw it.
| | 06:56 |
I can fix this by changing that animation
in the inspector.
| | 06:59 |
To go by render bounds or simply always
animate, and that way I won't accidentally
| | 07:03 |
stop a fan by being too close to it.
| | 07:06 |
| | Collapse this transcript |
| Animating lights| 00:00 |
In Unity we can animate a light, and it
brings up some possible issues when we're
| | 00:03 |
dealing with light baking.
We should first get the light animated,
| | 00:07 |
and then we'll need to judge how are we
handling our light baking and the
| | 00:10 |
intensity of the other light that is
animated.
| | 00:14 |
Baking means that the light is rendered
into the object, that is it becomes part
| | 00:18 |
of a texture laid over the color of the
object.
| | 00:22 |
You show it as if it was lit, although
it's not actually lit by the lights in the scene.
| | 00:27 |
So when we animate lights, we need to
consider if it's hitting anything.
| | 00:31 |
What I'll do is go take a look at that
ceiling fan.
| | 00:34 |
I'll spin around in my scene and zoom in
on the building, selecting this long store
| | 00:37 |
front, and going in to where my fans are.
Right now I've got some working lights in
| | 00:42 |
this scene and I've animated the light
housing, we'll call it, on this first fan
| | 00:46 |
to flicker off and on.
I'm going to use one of the point lights I
| | 00:50 |
created actually for the fan.
So I'll take this light and pull it back,
| | 00:54 |
maybe in a top view aligning with the fan
to get it closer.
| | 00:58 |
And then I'll start to animate both range
and intensity as if this light was
| | 01:01 |
flickering a bit.
I'll go into a top view by clicking on the
| | 01:05 |
Y and changing from maybe perspective,
over to an orthographic.
| | 01:10 |
I will also switch over from text to wire
frame and get my light align nicely.
| | 01:15 |
Next I will go into a side or front view
and make sure the light is up in the
| | 01:19 |
fixture correctly.
This light may not catch shadow so I am
| | 01:22 |
not terribly worried about embedding it in
the fixture.
| | 01:25 |
I am ready to animate this light.
What I'll do is first make a new anime
| | 01:29 |
clip and that way I can have this light
flicker.
| | 01:33 |
And if I need transferred over to
something else.
| | 01:37 |
I'll choose Window and Animation.
First, I'll make an anime clip for this
| | 01:41 |
light clicking on the Red button and going
into the 04-03 folder.
| | 01:45 |
I'll name this new animation 04_03_Flicker
and hit Save.
| | 01:50 |
Now, I've got the point light available,
and we can see, aside from the standard
| | 01:54 |
transforms that the light itself is
available for animation.
| | 01:58 |
Here's all of its different properties
such as color Even enabled and intensity.
| | 02:02 |
What I'm going to do is to key this
intensity to go up and down.
| | 02:06 |
As if this light is flickering slightly.
I'll pick Intensity and create a key here
| | 02:10 |
at zero.
Then I'll scroll over.
| | 02:13 |
It looked like the intensity of my
flickering bulb was a little bit slow.
| | 02:18 |
And so, when I animate this, I'm going to
speed it up.
| | 02:21 |
And make a mental note to go back at some
point and change the animation on the
| | 02:23 |
flickering material.
These are frames up here on the top and
| | 02:27 |
I'll go over maybe 10 frames, a fraction
of a second, and pull this intensity down.
| | 02:32 |
Putting in 0.5, then I'll go over another
increment, and put it up again.
| | 02:38 |
Here's an intensity of 1.1.
And finally at 20 something frames or
| | 02:43 |
close to I'll pull this back down to maybe
0.6 again.
| | 02:47 |
I'll do one more.
So over one second this bulb really
| | 02:50 |
drastically flickers.
Maybe it will come back to an intensity of
| | 02:53 |
1 here.
And so now when I zoom in on this curve, I
| | 02:56 |
can actually see a little bit of change.
We're ending up with very, very slight
| | 03:00 |
values, and we really have to get in close
to start to see those curves change.
| | 03:04 |
What we can also do is change the nature
of these keys.
| | 03:08 |
At the moment, these are linear.
What I'm going to do is to pick these
| | 03:11 |
keys, right-click on them and change their
tangent type.
| | 03:15 |
When I right-click directly on the key
instead of in the middle to add a key, we
| | 03:18 |
can see Auto, Free Smooth, Flat, and
Broken.
| | 03:22 |
I'll choose Flat, so it's a slow in and
slow out, but over very, very short
| | 03:25 |
increments of time.
Therefore, the light seems to fade in and
| | 03:29 |
out a little bit, as a light would.
With flat tangents on, I've got my
| | 03:33 |
animation, and I'm ready to see how this
looks.
| | 03:36 |
We can also key things like Range, the
reach of the light.
| | 03:40 |
And I'm going to leave it alone for the
moment.
| | 03:42 |
My thought on this light, is this is going
to be a dynamic light that will affect
| | 03:45 |
things in the scene.
And I'm not going to include it when I bake.
| | 03:49 |
This way, I'll have bake light on all my
objects.
| | 03:51 |
Plus, this extra light in here,
flickering.
| | 03:54 |
I'll test this out, and see if it feels
like the light is, perhaps not so good or
| | 03:57 |
the bulb needs a change in this store.
I'm playing my game using standard WASD
| | 04:03 |
controls, with space bar for jumping if we
need.
| | 04:06 |
I'm seeing here I have a little bit of
flicker, although it's not terribly
| | 04:09 |
visible because of the fairly low
intensity and also the intensity of the
| | 04:12 |
other light.
I've may need to accent this in the animation.
| | 04:17 |
We can tell that it's animating also,
because we can see the material flickering.
| | 04:21 |
And that's where this is really handy.
It's not necessarily that the room is
| | 04:25 |
drastically changing in intensity, but the
light on the fixture is strobing.
| | 04:30 |
I can definitely make it faster, as it
should be much more jittery, as well as
| | 04:33 |
being sharper in the off and on cycles.
I can adjust this easily in the animation
| | 04:39 |
section and test it out very quick.
This way, I can add some life into my
| | 04:43 |
scene, adding in some dynamic lighting as
well as dynamically changing materials an objects.
| | 04:49 |
In this case a shop who's got a fan with a
light-bulb that needs replacing.
| | 04:53 |
| | Collapse this transcript |
| Changing animation timing| 00:00 |
In our game, we're going to have doors
that open, and we can trigger them by
| | 00:03 |
passing into a collider we'll put around
the door.
| | 00:07 |
Before we get to the collider, we need to
get the door animated.
| | 00:10 |
I'm back here in Maya to make sure the
pivot is set correctly for the door so
| | 00:13 |
that when it comes in, it's in the right
place for me to animate it.
| | 00:18 |
I can animate the door either here in Maya
or in Unity.
| | 00:21 |
I'm going to choose to do it in Unity, so,
I can have one animation that I can use as
| | 00:24 |
I need on multiple doors if I'd like.
Right now, I'll select the door.
| | 00:29 |
And this is door AO2, part of the door
assembly WallDoorwayAO2.
| | 00:35 |
It's got a wall, a threshold, a door frame
and the actual door, which will probably
| | 00:38 |
end up with the texture of a wooden door
for example.
| | 00:42 |
I will press E for rotate, and see where
the pivot is.
| | 00:45 |
Right now, when I look in at top view by
pressing and holding the Spacebar for the
| | 00:49 |
hot box and choosing Maya top view and F
to focus, we can see that the pivot is in
| | 00:52 |
the middle.
Most stores don't pivot in the middle,
| | 00:57 |
they pivot on the side from the hinges.
So, what I will do here before I export
| | 01:01 |
this model out, is to set the pivot over
where the hinge should be.
| | 01:05 |
I'm going to say that this door opens from
left, swinging to the right.
| | 01:09 |
I'll press and hold V and D to move the
pivot, and click and drag on the red X
| | 01:12 |
axis to snap that pivot onto the door.
Then I'll do it again, and snap on the
| | 01:18 |
blue Z axis right up onto the frame.
I'm going to say right here is where the
| | 01:23 |
pivot of the hinge is even though I don't
actually see a hinge object.
| | 01:27 |
Later, I can model those and get those
textured.
| | 01:30 |
And when I re-import this FBX, it should
update.
| | 01:33 |
If I need to switch the pivot that's okay.
But I'm planning for the pivot to be here
| | 01:36 |
even when I get hing geometry in.
Now, I'll export this model.
| | 01:41 |
I'll select all the different pieces and
go into a prospective view, and scroll
| | 01:45 |
around just to make sure I don't have any
extra objects.
| | 01:49 |
If you got overlapping objects left from
previous or your white box animation, and
| | 01:53 |
you overlap them exactly, turning around
the view will show flickering objects
| | 01:57 |
because there are co-planar faces.
So, it's important to check before you export.
| | 02:03 |
It looks like I am clean, and I will
choose File and Export selection.
| | 02:07 |
I will export this out into my 0404
folder.
| | 02:10 |
I have done this already.
So, when we go into Unity, it will be
| | 02:13 |
there automatically.
But I wanted to show the things we need to
| | 02:16 |
bring across in the FBX.
Again under geometry, smoothing groups,
| | 02:21 |
and down under animation, there's no
actual animation on this.
| | 02:25 |
So, we don't need to bring the animation
across as we're going to do it in Unity.
| | 02:29 |
In units, I have automatic unchecked and
the file converted to meters, and I'll
| | 02:33 |
export this out.
I'll pull it up in Unity, and see how this
| | 02:37 |
looks, and get that door swinging open.
The FBX imports automatically in the 0404
| | 02:42 |
folder in assets.
I've opened 04_04_door_ani.start.
| | 02:47 |
I'm going to animate the door in this
scene.
| | 02:49 |
First, what I'll do is make sure the scale
is one and colliders are on.
| | 02:53 |
I'm going to take this wall doorway object
and drag it into my scene.
| | 02:57 |
I'll get it all setup and then make a
prefab, and put it where I need.
| | 03:01 |
I'll press F to focus in, slim down the
window if I can just a little bit, and
| | 03:05 |
zoom in on the door.
When I select the door, right now the
| | 03:08 |
pivot is in the middle.
And reason for that is up on the top of
| | 03:11 |
the UI, center is active.
I'll click on center and switch over to
| | 03:15 |
the pivot, and now the pivot of the door
is where I had placed it in Maya.
| | 03:20 |
It's important to note where those pivots
are before we animate.
| | 03:23 |
Although we can move them around, it's
easier to use in an application like Maya.
| | 03:27 |
And a plan for the animation to go in the
right place in the right pivot.
| | 03:31 |
Now, I'll animate this door.
What I may want to do in here is also
| | 03:34 |
switch the collider before I animate it.
And it's up to you depending on the nature
| | 03:39 |
of the door.
This door is a box, and so, a mesh
| | 03:42 |
collider is actually drawing all of the
triangles.
| | 03:45 |
What I may be interested in, in a door is
swapping out the mesh collider here for a
| | 03:48 |
box collider, which is one of the cheapest
colliders available.
| | 03:52 |
I still need a mesh collider on the wall.
And what we may also see on this is we use
| | 03:56 |
proxy objects as colliders.
Before I swap the box colliders in, I'll
| | 04:01 |
talk through the collider possibilities on
this object.
| | 04:05 |
It's important to notice this, because
before we animate, we want to consider how
| | 04:09 |
big the volume is we're animating.
We don't want the player to accidentally
| | 04:13 |
bump into an invisible collider as they
try to go through a doorway.
| | 04:17 |
This wall is governed with a mesh
collider, and it'is about as simple as the
| | 04:20 |
geometry can get.
What we may want to do though, is make an
| | 04:24 |
extra object which is the size of the wall
plus the door frame and bring that in separately.
| | 04:31 |
If you notice here in mesh collider, it
can look to whatever mesh we'd like.
| | 04:35 |
What it means is that if I make a proxy
collider, and we'll see this with stairs a
| | 04:38 |
lot of times, I can put it over both
objects.
| | 04:42 |
And that way, instead of two mesh
colliders, it's governed by one.
| | 04:45 |
A lot of the effort behind the scenes in
terms of our game engine work, is governed
| | 04:50 |
in how we handle the colliders.
For the door then, although this door is a
| | 04:55 |
box, more elaborate doors may have a
handle or extra bracing or other similar objects.
| | 05:00 |
And so, we should consider in the door, is
it a mesh collider or a box collider, or
| | 05:03 |
something similar.
I'm going to animate this door now, using
| | 05:07 |
the Animation Editor and keying it to Open
and Close.
| | 05:11 |
First, I'll make and new animation,
choosing Window > Animation and clicking
| | 05:15 |
on the red button.
I'd like to add a component in ,and I'll
| | 05:20 |
call this one in the 0404 directory, 0404
door swing.
| | 05:24 |
Now, with this animation in place, I'm
going to animate rotation on this object.
| | 05:29 |
I've got my door selected, and I'll start
at frame zero by placing a key.
| | 05:33 |
I'm going to say it takes a little over a
second, maybe a second and a half for this
| | 05:36 |
door to open.
So, at 1:30, I'll rotate this door,
| | 05:40 |
pressing E and clicking and dragging to
open that door up on the Y axis.
| | 05:46 |
In this case, I'm not holding control as I
don't want the door to snap to an evenly
| | 05:49 |
recognizable increment.
I've got that door opened up, it looks
| | 05:54 |
like rotation of 96 plus degrees.
Fantastic.
| | 05:57 |
A little bit more open than a straight 90,
which can feel constrained.
| | 06:02 |
Now, what I'll do is pause and scroll over
a bit opening up this timeline and
| | 06:05 |
stretching it out if I need.
We can add in more time if we'd like,
| | 06:10 |
scrolling over and putting in more keys.
I am going to say that this door actually
| | 06:16 |
stays open for almost a full 2 seconds
allowing the player to pass through.
| | 06:21 |
So, here at 3:20, I will place another key
which holds that value.
| | 06:25 |
I will scroll over further, and then I
will say by 5 seconds the door swings
| | 06:28 |
closed, giving the player chance to open
the door by triggering it, passing
| | 06:32 |
through, and then the door will close
behind them.
| | 06:37 |
If they are being pursued for example,
this is a good way to block an enemy and
| | 06:41 |
give the player a useful tool for evading
capture, let's say.
| | 06:45 |
Now, what I'll do is rotate this back.
Clicking and dragging on the Y axis after
| | 06:50 |
I create a new key, pull it back over
here, and I can always just type in zero
| | 06:54 |
in the rotation.
With the rotation of zero, I've got my
| | 06:59 |
door closed, and now I'll play with the
keys.
| | 07:02 |
So, it's a little bit better of a motion.
I am going to click on the rotation, why
| | 07:06 |
do I select that graph.
At the moment these are linear.
| | 07:10 |
So, I will select this key here at the
end, right click and choose Flat tangents.
| | 07:14 |
This way I get a bezier handle on that key
and the door eases to a close.
| | 07:19 |
I'll pick this second key, right click in
here, choose Right Tangent and set it to free.
| | 07:25 |
This way I can affect the right tangent
only.
| | 07:28 |
I'll take my left tangent then, right
clicking on that key and choosing Left
| | 07:32 |
Tangent Linear.
Alternately, I can choose constant,
| | 07:36 |
because I want it to hold that value and
not rubber band in the motion.
| | 07:40 |
I'll do the same on the next key over.
Here at 1:30 it's that same value.
| | 07:44 |
So, I'm going to right click on this key
and I'll set the right tangent to linear
| | 07:48 |
as well.
Then finally, I'll zoom back to frame
| | 07:52 |
zero, zooming out to see my whole
timeline.
| | 07:54 |
If you need to place in another key as it
looks like my door snapped open, you can
| | 07:58 |
do that fairly easily.
What I'll do is go back to frame zero,
| | 08:03 |
click to add a key and put in that value.
In this case I know it's zero.
| | 08:07 |
It starts out with flat tangent, and as I
zoom in we'll see this.
| | 08:12 |
I'll pick this key here 1:30, right click
and make sure right tangent is set to
| | 08:16 |
linear, and left tangent can be free or
flat.
| | 08:21 |
I'll choose for example, flat on the
tangent ,so, the door eases to a stop, and
| | 08:24 |
then again check the right tangent and set
it to linear if it's not already.
| | 08:30 |
Now, my door will open smoothly.
I'll check the key at zero just to make
| | 08:33 |
sure, and I can tell by the bezier handle
just visible under the line, that this
| | 08:37 |
door is going to start smooth, swing into
motion.
| | 08:41 |
Hold the position and swing closed.
I'll close the animation window, and I'll
| | 08:45 |
set this to temporarily loop, even though
it shouldn't swing open and closed
| | 08:49 |
repetitively, which would be rather silly.
It's a good way to see it as I test play
| | 08:54 |
this game.
Alternately, we can select the object and
| | 08:57 |
there's our preview.
Here in the animation section, we can go
| | 09:01 |
in and pick that animation.
It's actually available if we open up the
| | 09:05 |
door, or we can go select it here, door
swing and play with the wrap mode.
| | 09:11 |
I'll drop in wrap mode and set it to loop.
Now, I'll play this game and I should see
| | 09:15 |
a door opening and flapping.
Off in the distance, I can see the door
| | 09:18 |
waving to me.
It's rather silly looking, but it is a
| | 09:22 |
good test.
Here's the big test though, did this
| | 09:24 |
animation work?
The door opens, holds, and closes.
| | 09:29 |
Opens, hold, and closes.
My animation is ready.
| | 09:33 |
It's on this one object, and it's ready to
be triggered as part of my interactivity
| | 09:37 |
I'll put into my game.
| | 09:39 |
| | Collapse this transcript |
|
|
5. Implementing User Interaction ElementsOpening doors| 00:00 |
When we have animation ready in the scene,
we can start to add in interactivity, so
| | 00:03 |
that the player can interact with their
surrounding.
| | 00:07 |
What I've done here is to replace one of
my proxy buildings with one of my more
| | 00:10 |
complete storefronts.
And at the end of the street, moving the
| | 00:14 |
building over a little bit, I've bounded
the street with two of my pointed arch walls.
| | 00:19 |
Inside those pointed arches then, I've
landed my door modules that I had animated.
| | 00:24 |
The way I've constructed these is that the
door wall geometry simply passes into the arch.
| | 00:29 |
And this way I have the option of having
an arch that's open that I can see through
| | 00:33 |
into the next space or an arch with a door
in it where the arch becomes ornament on
| | 00:37 |
the wall.
This way I can use one prefab in two
| | 00:41 |
different ways.
Right now my doors are as I have left
| | 00:44 |
them, where the door itself loops
constantly in the animation.
| | 00:49 |
This is good for testing but looks rather
awkward when you play the game.
| | 00:52 |
I'll hit Play and show what I mean.
When I spawn in the game and start heading
| | 00:56 |
down the street I can see from a distance
there are two doors that are twinning.
| | 01:01 |
These doors are swinging open in unison
because they're driven with the same
| | 01:04 |
animation and it's a little on the awkward
side.
| | 01:07 |
First off seeing a door simply opening and
closing like this looks like the door is
| | 01:11 |
broken and secondly seeing them together
is unnatural.
| | 01:15 |
What I need to do then is to take the
animation off one of the doors or vary it.
| | 01:19 |
The way I'll handle it is actually I'm
going to bolt the right side door closed
| | 01:23 |
so that the right side door is fixed.
And it becomes, essentially, a wall.
| | 01:28 |
The left side door will be the operable
one and that's where I'll put the trigger
| | 01:31 |
for the controller.
What we need to think about, then, is,
| | 01:34 |
what is triggered, and what animations are
we using?
| | 01:38 |
It's very possible we'll have prefabs for
some of our objects, such as the doors.
| | 01:42 |
But, the animations we apply will be
unique for a particular circumstance.
| | 01:46 |
Alternatively, we may have cloned
animation files that are named differently.
| | 01:50 |
So, we can have two operable doors with
two different animation files followed by
| | 01:53 |
two different colliders.
I'll select this door, door A02 and remove
| | 01:57 |
the animation by right-clicking on the
animation and choosing Remove Component.
| | 02:03 |
Now I'll put a collider on the first door
here.
| | 02:06 |
What I'll do is select the door and press
F to focus in on it.
| | 02:10 |
I'll make sure I pick the actual door
geometry and now I'll make a cube by
| | 02:13 |
choosing Game Object > Create other and
Cube.
| | 02:17 |
I'll take this cube and scale it up.
I'll press R for scale and scale this out.
| | 02:23 |
Maybe making it a little bit longer than
it is wide.
| | 02:25 |
So we really have to hit this door
straight on.
| | 02:28 |
I'll stretch this cube up and watch the
scale here.
| | 02:30 |
Next I'll scale it out.
My thought is that this door opens one way.
| | 02:35 |
That it swings into this next space.
But there's a possibility I'm going to
| | 02:40 |
return back through this doorway.
And so I need to hit the collider before
| | 02:43 |
I'm in the swing of the door.
I'll take this collider and scale it out
| | 02:48 |
on the x a little bit.
And then move it so it's a little bit
| | 02:51 |
further back.
We have to get pretty close on the out
| | 02:54 |
swinging side to trigger the collider.
But from the in-swinging, we hit the
| | 02:58 |
collider from further away, and so we
don't get smacked by the door, which has a
| | 03:02 |
mesh collider on it.
Now I'm ready to get the interactivity
| | 03:07 |
going, I'll turn off the Mesh Renderer by
unchecking Mesh Renderer on this cube and
| | 03:11 |
also name the cubes I can find it easily.
I will call this Cube Door Trigger 01,
| | 03:17 |
this way Door Trigger 01 will be specific
to this particular door and now I'm going
| | 03:21 |
to make it a trigger.
In the box collider I'll check, Is Trigger
| | 03:27 |
and I'll make sure I turn the animation
from automatic or playing once the scene
| | 03:31 |
starts to trigger.
I'll select my door and down in my
| | 03:36 |
animation I'll turn the (UNKNOWN) type to
based on renders.
| | 03:40 |
So, I see the door and can animate it and
I'll uncheck Play Automatically.
| | 03:45 |
I'll also go into my animations and just
verify its only got one animation element,
| | 03:49 |
that door swing.
If we need, we can always change
| | 03:53 |
animations elements by clicking on the
circle next to the name of the animation
| | 03:56 |
and choosing another one.
We can see there's the standard idle,
| | 04:00 |
jump, run, and walk that come with the
third person controller, as well as the
| | 04:03 |
ones I've added in.
Now I'm ready to trigger this animation.
| | 04:08 |
What I'll do, is to select that box
controller.
| | 04:11 |
If you notice, it disappears because it no
longer has a mesh renderer.
| | 04:15 |
I called it Door Trigger 01, and with it
selected I need to go into my scripts to
| | 04:19 |
add on some interactivity.
In the assets, under Standard Assets, I've
| | 04:24 |
got scripts I had imported when I started
the project.
| | 04:28 |
If you don't have these in here, you can
right-click, and choose Import Package,
| | 04:31 |
and there in your Standard Packages are
Scripts.
| | 04:35 |
Here in Scripts, I'll go into the General
Scripts folder, and in there are a drag
| | 04:38 |
rigid body, and an activate trigger.
I'll take this activate trigger and make
| | 04:43 |
sure I put it onto my door trigger by
dragging it across to add the component.
| | 04:48 |
In the activate trigger, which is one of
the simplest triggers around, we need to
| | 04:52 |
know what is the trigger, and what are we
activating.
| | 04:55 |
What's the source and what is the target?
The action should be activate.
| | 04:59 |
I have options under here as to animate,
enable, deactivate, or trigger another trigger.
| | 05:06 |
The target is going to be that door
animation.
| | 05:08 |
I'll click on my target here and I'll
scroll down and find the actual door that
| | 05:12 |
this is on to.
I need to make sure I have the name right.
| | 05:16 |
And this is door AO2.
I'll verify it by clicking on it.
| | 05:20 |
This is in fact door AO2 that, that
trigger should go to.
| | 05:24 |
This is why naming an organization is such
a big deal up here.
| | 05:27 |
I'm looking to door AO2 and the source
should be the flare.
| | 05:30 |
When I click on Source I can see the
different pieces I have in this scene and
| | 05:33 |
there's my first person controller.
So when this controller collider bumps
| | 05:38 |
into this trigger it should open the door.
I'll check Repeat Trigger meaning I
| | 05:43 |
trigger it once but I can trigger it again
as long as I keep bumping into it.
| | 05:49 |
I'll try this out, and make sure I pick
the right door.
| | 05:52 |
This is where sometimes an extra name
becomes, difficult when we're picking
| | 05:55 |
things to trigger.
If you noticed, in door A02, there are
| | 05:59 |
two, door A02's, and so I'll make sure I
have the right one when I try this.
| | 06:05 |
I'll press Play and I'll see how this
looks.
| | 06:08 |
So far so good.
At least the door is not automatically opening.
| | 06:11 |
When I get close though I can run straight
into the door which means I didn't choose
| | 06:15 |
the right object when I set up the
trigger.
| | 06:19 |
I'll pick this again back here in the
activate trigger script.
| | 06:22 |
Instead of choosing the first door A02,
I'll pick the second one.
| | 06:25 |
Close it, and try it as activate and see
if this works.
| | 06:29 |
If activate isn't it, animate should do
it, and I should have this door opening
| | 06:32 |
when I run into that trigger.
It seems to be finding it, but it's not
| | 06:37 |
opening correctly, which means it needs to
turn on the animation, and that's the
| | 06:40 |
difference between activate and animate.
This is triggering an animation in here.
| | 06:46 |
Activate may be something else, turning or
a particle system or something similar,
| | 06:49 |
and so we need to make sure we have the
right words going when we're getting up
| | 06:53 |
our triggers.
With my Door Trigger selected, I'll change
| | 06:58 |
this over to animate, and I should see
that door animate, and there it is.
| | 07:05 |
It's a combination of the right name, and
the right pieces in the trigger.
| | 07:08 |
And now, I can go through my door, and
I'll see it close behind me.
| | 07:12 |
When I come up to the trigger again, it
triggers to open.
| | 07:15 |
I was close enough here, and as I pass in
and out of the trigger, I'm triggering that.
| | 07:21 |
This is where I may want to turn off the
Repeat Trigger.
| | 07:24 |
I've also got to set this door to Not Go
Automatically as it looks like I still
| | 07:28 |
left that trigger or the animation
automatic.
| | 07:32 |
I can turn off Repeat Triggers as a
possibility.
| | 07:34 |
So I can only trigger it once without
passing through both times.
| | 07:38 |
I'll make sure on the door itself, that
the animation is based on the renderer, or
| | 07:43 |
possibly based on Clip Bounds.
If neither of these work and the door
| | 07:48 |
keeps animating, I'll change it to Always
Animate, making sure Play Automatically is off.
| | 07:53 |
Lastly there's one other control here in
the trigger and we can see it happening.
| | 07:58 |
In the assets in the 0501 folder, here's
my door open and I had left the wrap mode
| | 08:02 |
for this animation for testing as loop.
This is where we need to, test, an
| | 08:08 |
possibly bring this object in again, or
make sure we catch all the different pieces.
| | 08:12 |
I've set the trigger correctly.
I'm triggering it once, and I'm going to
| | 08:17 |
make sure that the wrap mode is, default,
or once.
| | 08:21 |
So the animation occurs once only, when I
trigger that door.
| | 08:24 |
This should work perfectly now, and I
should be able to pass through the door
| | 08:27 |
and see it close behind me.
As I get up to the door I trigger it open.
| | 08:31 |
I walk through with a small bump in the
threshold and the door closes behind me.
| | 08:36 |
Now what I've done here is to turn off
Repeat Trigger and we have this option
| | 08:40 |
here in game play.
If the player finishes a section we can
| | 08:44 |
lock them out after they trigger a door
which is what I've accomplished.
| | 08:49 |
I've locked myself out because I've
triggered once.
| | 08:52 |
And that was it.
If I'd like to go back through, I need to
| | 08:55 |
remember to have Repeat Trigger on.
This is where the interactivity can really
| | 08:59 |
drive the game play.
That running around the scene here, and
| | 09:03 |
either letting the player keep going and
loop back and go where they've been.
| | 09:08 |
Or forcing them ahead by creating stop
points they cannot return beyond can
| | 09:12 |
really drive forward that player to the
goal that you want.
| | 09:17 |
For an open world or sandbox for example,
we may want this trigger to be multiple times.
| | 09:23 |
This way when I check Repeat Trigger I can
pass through as many times as I'd like in
| | 09:26 |
this door and go back and investigate
other shops again.
| | 09:31 |
My action's set to animate and I've got
the target correct.
| | 09:34 |
My first-person controller is what's
triggering this animation and I have the
| | 09:38 |
door opening, adding interactivity to my
game.
| | 09:41 |
| | Collapse this transcript |
| Making stairs walkable| 00:00 |
When we're crafting the interactivity in
our game, we use colliders to trigger animation.
| | 00:05 |
We also need to consider our colliders for
interactivity in terms of proximity to objects.
| | 00:11 |
What this means is that anywhere we can
economize on our colliders by choosing
| | 00:15 |
simpler colliders than the actual mesh is.
We can make our game play faster, we can
| | 00:21 |
also avoid a jittery motion.
For example, in this particular building,
| | 00:25 |
this long store front, the walls are
fairly smooth and if I collide with them I
| | 00:29 |
should slide smoothly along.
However, the walls here on my arch walls
| | 00:35 |
are all mesh colliders, and if I get close
enough without triggering the door there's
| | 00:39 |
a chance I can bump along the wall.
What we want to do most of the time if
| | 00:45 |
possible is optimize our colliders.
If it's reasonable to use proxy geometry
| | 00:50 |
or box colliders, the simplest, cheapest
collider in place of mesh colliders which
| | 00:54 |
have to look at every triangle, we should.
An alternative to this is actually to use
| | 01:00 |
a custom-made mesh collider of simpler
geometry.
| | 01:04 |
I'll show this as I've created a
passageway between two buildings.
| | 01:08 |
What I'd like to do here is put a stair in
with a platform.
| | 01:12 |
I've modeled one in Maya and I'm ready to
export it out.
| | 01:15 |
I'm going to put this stair in along one
side.
| | 01:18 |
So maybe at the platform, once we get to
it and if we know it's up there, there's
| | 01:21 |
an Easter egg or perhaps a secret hidden
ingredient at a tiny shop at the top of
| | 01:25 |
the stairs.
We have to make our way up.
| | 01:30 |
I'm going to use a custom collider on the
stairs because frankly, hopping up stairs
| | 01:33 |
in a game detracts from the game
experience.
| | 01:37 |
In real life, we don't hop up stairs, we
walk up them smoothly, and we should feel
| | 01:40 |
like we should be walking smoothly in game
too.
| | 01:44 |
I'll jump over to Maya, an see what these
stairs look like before I bring them in.
| | 01:47 |
We can see I've already brought them in,
in this scene 0502, down in the FBXs here
| | 01:51 |
in the 0502 folder.
I'll look at them in Maya in a little more
| | 01:56 |
detail, an exactly what's going to go on
with some custom colliders.
| | 02:00 |
Here in Maya in 05_02_stairs_start, I've
got stairs and we can see my collider
| | 02:05 |
geometry selected and lit over them.
What I've done is to model out some stairs
| | 02:11 |
and polygons.
These started out as a polycube then I
| | 02:14 |
beveled an edge for a nosing /g, sloped
them slightly and cloned it.
| | 02:19 |
And then extruded the back of the stairs
to make basically a cast concrete stair or
| | 02:22 |
something similar.
I've modeled a quick railing and it looks
| | 02:25 |
like I do need to attach one more piece
for export.
| | 02:29 |
My thought is I'd like to have a custom
collider and so I've modeled starting with
| | 02:33 |
a plane here, a ramp that goes up the
stairs.
| | 02:36 |
And has a thin, we'll call it, hanging
down the side.
| | 02:40 |
So that my character collider, the
capsule, has a clear collision, with the collider.
| | 02:44 |
Try saying that one several times fast.
What this means really, in all
| | 02:49 |
seriousness, is that I've created far less
geometry for the capsule to think about
| | 02:53 |
colliding with.
Then every step of the actual stairs.
| | 02:57 |
It'll also let me play with slope limit on
the character so I can smoothly walk up
| | 03:01 |
the stairs instead of having to hop up
which detracts from the overall player experience.
| | 03:08 |
I've exported these out into Unity and
I'll position them in the scene and set up
| | 03:11 |
a custom mesh collider.
Here in unity my stair FPX's have been
| | 03:15 |
imported in automatically because I
dropped them in the 0502 folder.
| | 03:21 |
I've opened up 0502 Stairs >Start> Unity.
This is the scene for the stairs.
| | 03:26 |
And I'm out here in the distance.
What I'll do is start out by picking my
| | 03:30 |
stair and stair ramp objects, selecting
them and making sure that the scale is set
| | 03:34 |
to one as I export it.
Now I'll take these and drop them into the hierarchy.
| | 03:40 |
Note that on both objects, I have not
checked generate colliders.
| | 03:44 |
In this way, I'm going to put a custom
mesh collider on each.
| | 03:47 |
I'll take stairs, and drag it into the
hierarchy noting that it makes a line with
| | 03:51 |
a dot at the end to denote it's going to
land between these objects.
| | 03:56 |
Instead of a capsule around one, which
establishes a parent - child relationship.
| | 04:01 |
I'll land it between point light and
storefront.
| | 04:03 |
And then I'll do the same with my stair
ramp.
| | 04:06 |
Rubbing it, and landing it between these
objects being careful not to parent automatically.
| | 04:11 |
When both pieces come in, and they're not
parented, we get this scale correct.
| | 04:16 |
And the objects lay over each other
exactly as I had positioned them in Maya.
| | 04:20 |
Now what I'll do is take stair ramp, and
add a component.
| | 04:24 |
By clicking on Add Component, and choosing
Physics, and Mesh Collider.
| | 04:28 |
This puts a mesh collider on that stair
ramp.
| | 04:32 |
And I can actually take off the mesh
renderer when I'm ready.
| | 04:35 |
We can make a difference in here in our
objects between colliding with something
| | 04:39 |
and seeing it.
And we don't always have to do both.
| | 04:43 |
With this mesh renderer off, the stair
collider will simply be a collider with
| | 04:47 |
the fewest number of tries possible.
What I'll do to test is turn off mesh
| | 04:53 |
renderer and play it.
I may have to either move this closer or
| | 04:57 |
run over in my scene to see this object.
I'll take the first option.
| | 05:01 |
Before I, play this, I'll put them
together, and move them into my scene.
| | 05:05 |
I'll pick stair ramp, and drag it onto
stairs, to parent it to the stairs object
| | 05:09 |
so both move together.
What I'll also do in here, is possibly
| | 05:14 |
make an extra collider for this object at
some point.
| | 05:18 |
Putting a box collider on the railing.
Right now, these are, simply, two objects.
| | 05:24 |
Depending on what came across in the FBX,
which I can see when I open up stairs here.
| | 05:28 |
I may have more pieces to deal with.
These are all collapsed at the moment, as
| | 05:33 |
we can see a stairs platform object and an
avatar.
| | 05:35 |
What that means is I may have trouble
putting a box collider on, and so I should
| | 05:39 |
consider this when I bring it over.
For now though, I'll pick my stairs.
| | 05:44 |
Rolling them up, and moving them into
place.
| | 05:47 |
I'll slide them over onto my building, and
snap them into that passageway between,
| | 05:50 |
those buildings.
I'll pull my stairs in, and snap them onto
| | 05:55 |
one of the walls.
I'll spin them around by pressing E to
| | 05:58 |
rotate, an holding Ctrl, to snap evenly.
Now the rotation even.
| | 06:03 |
I can zoom in and put the stairs in right
place.
| | 06:07 |
I'll make sure to pull them out of the
building and press V for snap, snapping
| | 06:10 |
the bottom of stairs on to a corner of the
building.
| | 06:14 |
And then pulling them forward of the blue
z axis.
| | 06:17 |
Its important to make sure you have the
correct axis when sliding things around.
| | 06:21 |
I'm going to put this platform, midway up,
or maybe snapped right against that arc.
| | 06:26 |
This way I can, look through.
It's an example of maybe construction that
| | 06:30 |
was built, long after the original, and is
a temporary solution to, getting up here.
| | 06:36 |
It may not look the best but we'll add
some character to this space.
| | 06:39 |
I'll see if this collider worked by
pressing play and playing my game.
| | 06:43 |
When I get into my scene and I approach
the passage way I can see the stairs
| | 06:46 |
clearly rendering the back.
What's happening is that the collider
| | 06:50 |
stair ramp is not rendering as a mesh.
I can't even see it.
| | 06:54 |
I have to select it by name in the
hierarchy.
| | 06:57 |
Now for the test.
When I get close and I run up the stairs,
| | 07:01 |
I go smoothly up and on to this small
platform.
| | 07:05 |
We can see, as I jump off the platform
that I still need work on a collider for
| | 07:08 |
the railing but I have created a slope or
a ramp here.
| | 07:12 |
We can also see that I need a collider on
my building as I just fell through the wall.
| | 07:17 |
And it's another example of how thoroughly
we need to think about the collider is not seen.
| | 07:22 |
I'll try this one more time, running up
the stairs by pressing W.
| | 07:26 |
Looking up the stairs and animating,
smoothly up.
| | 07:29 |
In this way, I've got the feel of running
up stairs, an the view is correct, but I
| | 07:33 |
haven't thrown off the game-play by having
to, hop up stairs.
| | 07:38 |
By using a collider as a slope the way
that we control slopes is in the first
| | 07:41 |
person controller.
If we select the first person controller
| | 07:45 |
we can see in the character controller
that there is a slope limit and right now
| | 07:49 |
it is set to 45 degrees, 45 are actually
very, very steep stairs.
| | 07:55 |
Typical stairs are closer to a 1 up to 2
over a rise to run of 1 to 2.
| | 08:01 |
More public stairs maybe even more shallow
so, 45 should do nicely.
| | 08:05 |
What we can do also is play with either a
step offset if we need to be able to move
| | 08:09 |
upstairs that are taller or increase the
slope limit.
| | 08:13 |
For example if we're dealing in tall
narrow fire escapes or ships ladders.
| | 08:18 |
We can walk up nearly anything, even a
vertical wall if we'd like.
| | 08:22 |
I'll leave this alone, but I know it's
there in case I need to access it in the future.
| | 08:26 |
In the meantime, I can populate my scene
with stairs that I can smoothly run up as
| | 08:30 |
part of the animation, searching out
exotic ingredients for today's meal.
| | 08:35 |
| | Collapse this transcript |
| Adding physics to objects| 00:00 |
Particles in unity are a great way to add
in both animation and interaction.
| | 00:05 |
To get particles in your project, right
click in the assets and choose import
| | 00:09 |
package and particles.
I've already brought them into this
| | 00:13 |
project, and so we just need to create
them.
| | 00:16 |
I'll click on assets, and there's the
particles folder in standard assets.
| | 00:21 |
Unity uses the Shuriken particle system.
A very advanced way of handling sprite
| | 00:25 |
based particles.
I'll double click on the particles folder.
| | 00:28 |
And I've got presets in here for a lot of
common particles.
| | 00:32 |
Such as dust, fire, water, and sparkles.
I'll click on dust, and there's a dust
| | 00:36 |
storm to start.
Ultimately, you can make your own particles.
| | 00:40 |
Starting out by choosing game object,
create other, and particle system.
| | 00:45 |
I'll begin with dust, putting some dust
down the city street here.
| | 00:48 |
In particles, I'll click and dust.
And drag a dust storm particle into my scene.
| | 00:53 |
When you put particles into the scene,
they start out emitting as long as they're selected.
| | 00:58 |
In this case, this dust is showing a
series of large cards or sprites that are
| | 01:02 |
camera facing.
They will always rotate to face the camera.
| | 01:07 |
Each particle here uses a range of color
to animate and thereby change the look.
| | 01:13 |
Particles can cast shadows if needed and
they can use one or more textures.
| | 01:17 |
They have their own class of material,
particle materials that define different
| | 01:20 |
ways of blending the alpha, depending on
what you need.
| | 01:24 |
In particles one of the first things to
think about is how it looks.
| | 01:28 |
This particle is using one dust puff as
shown here in the particle texture in the
| | 01:31 |
dust material.
Alternately, you can bring in a texture
| | 01:35 |
sheet for particles with as many particles
as you'd like spaced out in rows and columns.
| | 01:40 |
And then choose how often they cycle
between.
| | 01:43 |
The key with particles is to think of not
only what does it look like, but how does
| | 01:47 |
it behave.
When we're making particles in a scene,
| | 01:50 |
the more there are of something, the less
we care about what each one looks like and
| | 01:54 |
the more we care about their behavior.
We can't see a raindrop necessarily but we
| | 01:59 |
can get the idea it's raining from the
vertical blur in the scene from the wetness.
| | 02:05 |
I'll create a particle system from scratch
to illustrate this.
| | 02:08 |
Choosing game object > Create Other >
Particle System.
| | 02:11 |
The default particles are bubbles and they
simply emit straight up in soft white puffs.
| | 02:17 |
I'll press F to focus in.
And we can see that they're going to
| | 02:20 |
simply rise up in the scene until they
stop, dependent on their lifetime.
| | 02:24 |
These are simple camera facing articles.
What I'll do, is take up the duration on
| | 02:28 |
this system, clicking and dragging on
duration so they last longer.
| | 02:32 |
I'll also take down the start speed.
Putting in 1, to slow them down, and take
| | 02:37 |
down the lifetime.
With all of our particles, we have options
| | 02:41 |
as to how to randomize and that's the most
important one with particles.
| | 02:46 |
What we should think of when we're dealing
with our particles is these are randomized
| | 02:50 |
pieces that work within a given range.
They are generally similar but have some
| | 02:56 |
slight variations so they are not perfect.
In all of our particle attributes then we
| | 03:01 |
can randomize between two curves,
randomize between two constants or
| | 03:04 |
randomize between two curves.
For example a random between two constants
| | 03:09 |
on the start lifetime makes them go
between zero and five randomly.
| | 03:14 |
A randomization in the start speed for
example between zero and one leaves some
| | 03:17 |
of them barely drifting out while others
zoom out at a speed of one.
| | 03:23 |
I'll bump this up to six so we can really
see it go.
| | 03:26 |
Some of the particles are much slower and
some are obviously faster.
| | 03:29 |
I'll bring up the start size.
So, I have large particles in the scene
| | 03:33 |
and then I'll back off the start speed.
We can even go negatively in the speed, so
| | 03:37 |
that they go down first.
I'm going to make the start speed zero,
| | 03:42 |
and range between zero and one.
So I have a bunch of slow particles in my scene.
| | 03:48 |
These will gently immulate dust in the
scene, once I get them tuned.
| | 03:51 |
In your particles, you have a tremendous
amount of control over each aspect of the particles.
| | 03:56 |
We can also deal in things that change
over time such as color by speed or size
| | 04:00 |
by speed.
Things can grow and fade depending on how
| | 04:03 |
fast they're going.
What I'll do is I'll look in the shape.
| | 04:07 |
The emitter for a cone is defined by the
shape as a cone here meaning they come out
| | 04:10 |
generally in a gloom.
We can also change this to a box, or even
| | 04:15 |
have them emit from a mesh.
I'm going to put this at a hemisphere, so
| | 04:18 |
they start out on the street without
submerging.
| | 04:21 |
Pull this up we can see a definite bottom
to the particles, and I'll use this to add
| | 04:25 |
dust along my street.
I'll scroll down, and look at color over lifetime.
| | 04:30 |
For color, it starts out as white, and
what I'm going to do is randomize between
| | 04:34 |
two gradients in color, clicking on the
gradient to pull up a bigger gradient editor.
| | 04:40 |
In gradient editors, the bottom is the
color, and the top is the alpha.
| | 04:44 |
So for the particles, I will eye dropper
my beige sand, and then pick a different color.
| | 04:49 |
Eye droppering the sand and then making it
maybe darker.
| | 04:53 |
So I get, sand that starts light and goes
dark as it blows around in my street.
| | 04:58 |
What I'll also do is change the alpha.
I'll back of the alpha of the darker ones
| | 05:02 |
so the particles go more transparent as
they get darker, and we can see this
| | 05:05 |
happening in this scene.
I'll change over to texture.
| | 05:09 |
So, I'm just seeing my particle system and
now I have a brewing dust storm in the street.
| | 05:14 |
What we'll see with particles typically is
we really need to back off how dense they are.
| | 05:19 |
We can make them nearly clear on their own
and only when we see them together do they
| | 05:22 |
really have some density.
I'll pick the second color here in my
| | 05:27 |
gradient and back off the opacity.
So, they start out white in the second
| | 05:31 |
color to nearly clear.
I'll also grab this first color and borrow
| | 05:35 |
that sand again.
And again, back of the alpha.
| | 05:39 |
So I've got nearly clear particles.
What's also happening here is in the material.
| | 05:44 |
Particles have their own material.
And if we scroll down we can see exactly
| | 05:47 |
what they're doing.
I'll make sure I select my particle
| | 05:50 |
system, and I can add a material on.
At the moment these are just clouds with
| | 05:55 |
their opacity defined by the alpha and the
color.
| | 05:57 |
I am going to pick a new material by
creating it and then adding it in onto my particles.
| | 06:03 |
In Assets in the 05_03 folder, I will
right click and create a new material.
| | 06:07 |
For this material I will drop down in the
shader and choose Particles.
| | 06:12 |
In your Particle materials, you have
multiple choices here.
| | 06:15 |
What particles deal with a lot is alpha
blending.
| | 06:19 |
We may see five, six, even 10 or 12
particles sequences together in alpha in dep.
| | 06:26 |
And so what we need to do is think about
how do they blend.
| | 06:29 |
I'll take additive soft to soften these
particles.
| | 06:32 |
I'll drag this new material onto this
particle system.
| | 06:35 |
And now they'll show up as soft cards.
What I can do with this material once I've
| | 06:41 |
defined it, is now I can put a texture in.
If we have a cloud or something similar,
| | 06:45 |
we can add it into the particles.
I'll click select and choose a default texture.
| | 06:51 |
For example, I have some very faint dust
and smoke puffs down here at the bottom.
| | 06:55 |
I'll take.
Smoke four, and dim this back, and now
| | 06:58 |
I've got a dust storm brewing in the
street.
| | 07:01 |
When I play this in the game, I'll have
dust that I can actually pass through, and
| | 07:05 |
if needed I can trigger a particle system,
such as sparks from collision, by having
| | 07:10 |
the collider set to activate, which will
activate a particle system.
| | 07:16 |
I'll play this and see how it looks.
We can see in the particle system it's
| | 07:20 |
added some life to the scene.
Although it's a little too dense and my
| | 07:24 |
particles aren't rotating yet, it's nice
to have that haze in that street.
| | 07:29 |
It simulates the idea of a dusty street
deep in one of the soukes.
| | 07:34 |
When I get close they don't get Terribly
much more dense, and I can pass right
| | 07:38 |
through them and emerge clear into the
doors.
| | 07:41 |
The next step is to look at the particle
behavior and randomize the rotation, so
| | 07:45 |
that one image for this cloud is not
obviously recognizable.
| | 07:50 |
I'll probably also scale back the emission
rate, so I just have a few puffs here and there.
| | 07:55 |
And darken the color even further so it's
not nearly as bright when I see a bunch of
| | 07:59 |
them together.
In my Particle I'll look at Rotation Over
| | 08:03 |
Lifetime, turning it on to rotate the
particles to add a swirl.
| | 08:07 |
I'll back off the angular velocity so the
rotation is not as severe clicking and
| | 08:11 |
dragging right on the word and pulling
that back until it looks right.
| | 08:16 |
Alternately, I can look at rotation by
speed.
| | 08:18 |
Turning it on and again backing off the
angular velocity and putting in a speed
| | 08:23 |
range where I have control by
randomization as I see with most of my
| | 08:26 |
other particle pieces, between constants,
curves, or on a curve.
| | 08:32 |
Because these particles are sprites, we're
limited in our collision.
| | 08:35 |
When we turn on collision, we have planes
that can be defined either by objects or
| | 08:39 |
by their own transforms to collide with.
It's difficult to get particles to collide
| | 08:45 |
exactly with a mesh, so keep this in mind
that you're working basically in large
| | 08:48 |
planes first.
Most of the time the particles can simply
| | 08:52 |
penetrate through, as most of the things
we want to do with particles really don't
| | 08:56 |
show a collision as much as disappear on
contact.
| | 09:01 |
I'll back off the color even more, and see
how this looks.
| | 09:04 |
What I'll also do in addition to tempering
the color by darkening it.
| | 09:08 |
Is changing the alpha blending in that
material.
| | 09:11 |
I'll take you to these color keys in my
gradient, and dim them down so I'm not
| | 09:14 |
showing nearly as much white in that
color.
| | 09:18 |
I'll scroll down to the material, and
instead of particle additive soft, I'll
| | 09:23 |
try particles and alpha blended.
This gets much, much darker here.
| | 09:28 |
Almost too dark with the tint color.
And so somewhere in here is a balance
| | 09:31 |
between the shader and what the particles
are doing.
| | 09:35 |
Here's a particle alpha blended
pre-multiply, and it's a little better,
| | 09:38 |
although I am getting some popping and
flashing.
| | 09:41 |
We want to think of is, what is the best
and most subtle particle we can stand.
| | 09:45 |
We don't want these particles to be giant
black clouds in the street.
| | 09:49 |
And so I'm going to switch back here to
particles and additive soft, and let them
| | 09:53 |
be light.
But I'll damp down the color in the
| | 09:56 |
gradients and pull back that opacity so
it's barely visible.
| | 10:00 |
And when I hit play again, I've got dust
in the middle of the street.
| | 10:05 |
It's a great way to add some life to this
scene, that there's some swirling dust
| | 10:08 |
which we can even have emitted from
players, kicking up dust from our
| | 10:10 |
footsteps in the third person controller
for example.
| | 10:14 |
Or dust from a horse as it gallops by.
Use particles to put life into the scene.
| | 10:19 |
It's a great way to add some animation
both ambient and triggered.
| | 10:23 |
And really bring a scene to life with
atmospherics such as rain and dust.
| | 10:27 |
And triggered animations such as fire,
smoke, firework or just dust puffs off a
| | 10:31 |
character's feet.
| | 10:33 |
| | Collapse this transcript |
|
|
ConclusionNext steps| 00:00 |
Thanks for watching my course, Level
Design Basics in Unity, and I hope you had
| | 00:03 |
as much fun watching this course as I did
making it.
| | 00:07 |
If you'd like to take your skills further,
I'd recomend Texturing for Games in Maya,
| | 00:11 |
Mudbox and Photoshop, and Game Prop
Creation in Maya.
| | 00:15 |
If you'd like to take your Unity skills
further and enhance your knowledge in that
| | 00:19 |
package, try the Unity 3D 3.5 Essential
Training with Sue Blackman.
| | 00:24 |
So, get in there and start crafting some
game levels.
| | 00:27 |
Making sure you think through why the
level should flow like it does, and play
| | 00:30 |
like it does.
And then how it should look, and what's
| | 00:34 |
it's like for the user to run around in
your immersive experience.
| | 00:38 |
| | Collapse this transcript |
|
|
