Tutorial: Using Bitmap-To-Material in FPSControl (Unity) Video Lecture | How to make Video Games: Game Editor Tutorial - Game Development

other than modeling texturing is
probably the most time-consuming task a
game artist has to wrestle through
fortunately algorithmic has opened up
their texturing pipeline tool called
substance to anyone that has joined this
challenge now in this video our good
friend Wes will explain how to use it
and how to quickly get more texturing
productivity out of your day than you
ever expected in this video we're gonna
take an in-depth look at using bitmap 2
material as a texture creation tool
using only bitmap 2 material or v2m as
I'll refer to it and the free substance
player application you can create
high-end texture assets as you'll see
b2m does all the heavy lifting and
provides a complete texturing solution
by generating all surface attribute maps
from a single source image before we
dive in let's talk about what bitmap 2
material is at its core b2m is a
substance however it's a very powerful
substance in that it's like having a
mini image editing application that can
use not only in substance player but any
substance enabled application such as
maya 3dsmax modo unity or UDK bitmap 2
material when coupled with substance
player provides you with a complete
standalone tool for creating textures
and exporting bitmaps for use in any
application simply put you feed b2m a
single diffuse image and it will
generate all the maps you need from that
single source such as normal specular
bump and height Maps b2m gives you full
control over how each map is generated
allowing you to tweak and change
parameters to create fully realize
textures in an intuitive and visual
manner it's quick and it's easy as I
mentioned bitmap 2 material is a
substance so it's much more than just a
math generator or a plug-in using v2 M
you can generate maps at runtime so it's
extremely light in terms of asset size
and is very friendly on bandwidth for
downloadable content also b2n parameters
can be changed during run time to make
textures truly dynamic and it works on
mobile platforms as well so here we are
in substance player substance players a
free application that you can download
from the algorithmic website substance
player allows you to open precompiled
substances and tweak their settings and
then X
bitmaps or you can even export substance
presets to substance enabled
applications in this video we're going
to be talking about using the bitmap -
material so let's go ahead and open this
substance so I'm going to click the Open
button
and I've already navigated to the b2m
folder and you can see that we have
three substances here we've got no
grounds real-time mobile and then just
the bitmap - material - this is the one
that we're gonna use this to the full
bitmaps and material so we'll go ahead
and click open on this and now you can
see here in substance player that we
have a 3d viewport here we can actually
rotate using the left mouse button we
can use the right mouse button to zoom
in and the middle mouse button to pan
here at the top we have a 2d view that's
actually going to allow us to look at
all the different maps that substance
bitmap - material here is going to
generate force we have diffuse normal
specular bump and so on and then over
here on the right is where we're going
to have our substance parameter so this
is where we're actually going to do a
lot of our editing before we get started
I'm gonna change the viewport just a
little bit so that it looks a little bit
better and more clear for this video so
I'm just going to grab my 3d view just
go left click drag and drop and tear
this and just go ahead and drag and drop
this here at the top so we have the 3d
viewport and our parameters here below
and then we have our 2d view and I'm
gonna go ahead and split this vertically
so let's go ahead and click this drop
down and unless it's a split vertical
and then I'm going to click this and do
split vertical one more time and now I
have the ability to go ahead and just
fit these maps right to this viewport
here so we'll be looking at three at a
time and then I'll go ahead and just
drag this over so we can minimize this
and help to maximize our 3d view now
this is where the magic is going to
happen so what we're gonna do is we're
going to need to drop a bitmap so let me
just go out here to my desktop and I
have an image here so this is just a
rock image and I download this from CG
textures comm so all I need to do is
just let's take this file let's just
drag and drop this here right onto just
one of my 2d view and I'm just going to
let go of the left Mouse and you can see
that I have a couple options here and
what you're going to want to do for your
first image is load in the bitmap
diffuse tweak so I'm just going to
left-click on this option and right off
the bat
bitmap - material has done a lot for us
it's actually generated several maps so
here we have in our 2d views we have the
diffuse if we come over to this output
we can here select our normal here's our
specular and you can see that we've
already started to generate several
types of maps here
we can also look and we can see that we
have a bomb and we also have a height
map as well as we have ambient occlusion
and here in our 3d view can see that the
effects that these maps are starting to
have so here let's just kind of maximize
our 3d view
let's zoom in here a little bit and as I
start to kind of orbit around into 3d
view you can see the effect that these
maps are having I can also hold down the
shift key and move my left mouse button
here as I drag or press my left mouse
button as I drag the mouse and you can
see that I can actually change the
lighting a bit here so to get a little
bit better look on how these maps are
affecting the geometry so now we'll just
zoom back out and something else that I
want to bring your attention to is we
start to look at our b2m parameters so
at the start here we have an output size
and you can see that I can actually
click this drop down here and I've got
several different types of outputs that
I can work so 512 is what working with
default but we can go up to here to 2048
as well as be able to enter in our own
random seed or just click this randomize
button which will randomize all of the
bitmap to material parameters so the
first thing I'd like to really show here
is tiling so typically when you are
creating a project or you're working
with some textures and you're going to
create a general-purpose texture you're
gonna want these things to be tileable
so what I'm gonna do is here let's just
maximize our 3d viewport a little bit
I'm gonna come over here to my shader
tab and you can see that my shader list
here I'm working actually with the
displacement shader and what I'm going
to do is just go ahead and click the
edit button and now we have a host of
parameters here that we can use to
control the way our shader is working on
our geometry so what I'm going to do to
start is I'm gonna come all the way down
here to the bottom to the tiling method
and I'm actually going to just start to
tile this this image here and as you can
see here I'll start to well go ahead and
just bring this in it may be here let's
just go ahead and do miracle put in
let's do two tiles and we'll zoom in
here into our viewport and you can see
that right off the bat we have some ugly
seams here so this image that I'm using
or the image that I originally fed to
bitmaps and material is not tae label
now bitmap to material makes it very
easy to solve this problem so I'm going
to come over here and I'm going to click
on to my global tab and I'm going to
take a look at some of the tiling
options that I have so I have a lot of
control over this so under the make a
tile method I actually have the ability
to choose offset or splat so if I choose
splat you can see that
automatically bit metamaterial has
created this into a tileable texture so
we'll go ahead and just zoom in on this
and you can see that the seams have been
removed we can also change our splat
angle random setting here so again we'll
kind of zoom out just a little bit and
now I'll change the splat angle setting
as I start to change this slider you can
see that I can further randomize how I'm
going to be removing these seams and as
I do this I want you to take notice of
the 2d views so as I start to adjust any
of these substance or excuse me these
bitmap to material parameters you can
see that not only is the diffuse texture
being affected but it's propagating
throughout all of the generated textures
so in this case I think I'll just go
ahead and keep this splat angle at zero
and something else I can do is again I
can go back over here to my random seed
and just clicking the random button here
will automatically randomize different
tiling textures or different tiling
solutions for this texture so with just
the click of a button I can generate
several different types of tiled
textures that are different variations
from this one single source when it
comes to tiling the natural lighting
information that is embedded in the
image which is the soft gradient tonal
ranges from dark to light it can cause
noticeable repeating patterns so let's
go ahead and just kind of maximize our
3d view and I'm going to go ahead and
just adjust the tiling so let's go ahead
and just move this up to four tiles and
here I'll zoom in just a little bit and
now I'm going to highlight some of these
areas that I'm talking about so here you
can see these dark ranges in the natural
lighting of the image have become
noticeable patterns in order to make
this a better tiling image what we'll do
is well we'll just come down here to our
lighting tab and we'll go ahead and
adjust our lighting equaliser so as I
take this lighting equalizer value and I
start to increase this you can see that
I'll be able to diminish those dark
areas now I've removed those dark tones
and now we have a much better tile image
now the light equalizer is advanced in
bitmap to material because it can remove
the tonal ranges but it's not going to
diminish any of the color in the diffuse
texture you also have the ability to
cancel highlights in the image as well
as shadows and then you also have the
ability to mess with the diffuse albedo
so if you wanted to remove all lighting
information from the image you can do
that as well now let's take a look at
the controls that we have
or affecting the normal map so what
we're gonna do is we're going to go
ahead and take a look at here let's go
ahead and maximize our parameters here
for us for just a moment and let's go
over to our relief tab something else
that I'll do it close up some of these
other tabs here and for this example
let's go ahead and just take our tiling
all the way back down here to zero so
now we have a little bit more of a
better look at how the no amount is
going to be affecting this and here in
our relief tab is where we can actually
start to tweak the way that the normal
map is going to be generated and we have
a lot of control so in this case we'll
go ahead and we'll just kind of zoom in
here on our normal map and we'll adjust
the syste bit so you can see this a bit
better
so here's our normal map in our 2d view
we have options to change our known
format so between directx and opengl we
also have the ability to include a
secondary relief type such as adding
another height or nola map to further
augment the overall normal map effect we
also have the ability to control the
blending choosing interpolate replaces
the original and choosing add will
combine the two maps to create a new
normal map containing information from
the original and the secondary map
combining Maps gives you greater
flexibility and allows you to create
normalize with more complex surface
attributes we also have the ability to
go through and adjust our strength so we
can increase our normal strength and you
can see that that starts to update here
in our NOLA map and then we can actually
break down into the different different
sizes of the details so we have fine
details so we can increase how the fine
details are going to be affecting the
normal map here we can also work with
medium details so these are going to be
you know medium medium size shapes here
into our image and then we also have the
very large shape so you can see that we
can start to change this as well and
affect the image we can also go through
and we can sharpen the normal map we can
soften and we can also again adjust that
height map balint zero means that all
the data is in the displacement map and
thirty-two means that all the data is in
the normal and the bump maps and there
is no displacement mapping one of the
more powerful aspects of b2m normal map
generation is in having the ability to
adjust the shape recognition so here
we'll navigate to the shape recognition
will close the relief tab and here we
have this shape recognition category
so we'll go ahead and drop this down and
now we'll have several controls that
allow us to affect the shape recognition
in the normal map so the inherent light
and dark values of the natural lighting
in the image can cause the highs and
lows in the normal map to be incorrect
or off the shape recognition allows us
to re-establish the correct shapes in
our map so we do have some recognition
intensity value here of 0.5 so let's go
ahead and turn off our shape recognition
I'm gonna go ahead and take this slider
all the way down to zero and you can see
how this is going to affect our image so
let's go into our 3d view and just start
to kind of rotate this guy around and
you know to help illustrate this I'm
actually going to add some height or
displacement to this so I'm going to go
over to the shader tab and adjust the
height parameters to increase the height
effect now b2m has generated a height
map for us and it will drive the
displacement now let's rotate the view
and zoom in a bit and you can see that
we now have some displacement on the
surface of the mesh and this will make
it easier to see the shape recognition
effect so what we want to look for is
how the lighting is actually going to be
affecting this image so let's go ahead
and just kind of zoom in here a bit on
our let's see if we take this back to
100 in our diffuse image so if we kind
of look at this image we can see that
we've got some lighting is basically
coming from the top or this is lit from
the top down you can see that we've got
these hard edges here of these rocks and
you can see where the shadows are kind
of falling underneath these kind of hard
cracked edges here and what's going on
is these edges here that are causing
these hard shadows these edges are
protruding further than than the rock
area above them so we're going we should
be getting kind of like a slope here so
as say in this area here this is maybe
not protruding as much and then as we
come down to this hard edge that edge is
kind of sticking out more in the rock so
if we kind of zoom in and rotate around
on our normal map here or you know
what's happening here
it was come over to this glance and you
can see that basically we don't really
get that that true-to-life
shape of this rock what we get is
everything is just basically on an even
plane so as we start to look at some of
these edges here everything is just
really flat and this doesn't make for a
very good normal map so what we want to
do is we want to energy introduce some
shape recognition because we want to
actually adjust the way this is working
so and again we're really going to be
taking a look at
these edges so here's what we'll do I'll
go ahead and just kind of put this here
in this angle and I'll start to
introduce my recognition here and here
let's find a really good area to kind of
track this here we go this this is a
good edge right here so let's do this
let's take this back to 0 and let's
again focus on this edge here and so if
we kind of zoom in on this the spot
right here you can see this is the edge
we're looking at as you can see it's a
very flat plane so this edge is not
protruding above where this any of the
other rocks so what we should really
have is this edge should be sticking up
and there should be a slope backwards
and that's what's actually causing this
shadow here so we're not getting that in
our image so what we can do is we can
just adjust our recognition here and as
we start to do that you can see that
we're really starting to affect the way
this is working so now when we kind of
zoom back out this edge here in this
edge here if we start to kind of go into
that glancing again you can see that we
have now re-establish the way these
shapes are working and these edges are
actually the highest I guess we'll say
the peak points here in our normal map
and so that gives us some much more
true-to-life shape and it starts to look
even more like a rock surface again we
can even over crank this a bit more and
you hear by doing that you can see that
again now we really have this this
peaked edge here which is which
according to what our diffuse for what
the actual rock surface looks like this
edge here should be the highest point
and now due to our shape recognition it
is higher points and now we actually get
this correct slope we can even go
through and if we wanted to we can
actually start to adjust the the
recognition angle if we want to further
tweak that we also have the ability to
change how much of the normal height and
the ambient occlusion shape recognition
is being taken into consideration or how
much it's being adjusted and by default
this is all set to 1 and that's probably
what you want to do for most of the time
your two options that you're really
going to mess with is probably the
recognition intensity and the
recognition angle so again as we start
to kind of pull this image back here and
we get ourselves at a nice kind of
glancing angle this normal map as well
as the height map looks much more
dynamic and more true-to-life so again
at the
glancing angle let's say if we were to
take our shape recognition all the way
down this is what we're getting so again
everything is just right across on this
flat plane and it's not very dynamic and
it's not very true to real-world or true
to life so again as we start to increase
here our shape angle you can see that we
can get a much more dynamic and much
more rich normal height and displacement
from this shape recognition setting so
now we'll move forward and just continue
on checking out some of these parameters
here let's go ahead and just kind of fit
these 2d view back so we can kind of see
what we're doing here
so we also have the ability to adjust
our specular we have controls for
changing our specular diffuse influence
so we can increase or decrease that here
we'll go ahead and switch our specular
map on so we can see here and we'll fit
this guy to view a little bit better we
can also change our specular saturation
so if we want this to be more grayscale
or we can actually introduce a little
bit of color into this so here we'll
just go ahead and desaturate this a bit
we can sharpen and then we also have the
ability to work with our levels control
so this works pretty much like the
levels control and say Photoshop where
you have a your level you have your
in-and-out and then you also have your
able to adjust your low mid and high
points and your low and high points of
your levels out control so next we'll
check out our ambient occlusion and
we'll take a look at the ambient
occlusion map and what we can do and
this is a pretty nice feature is we can
actually add a media clusion over top of
this diffuse so here we have AO multiply
if I start to adjust this slider I can
start to introduce ambient occlusion
into this and that provides us with a
lot more depth especially in all the
nooks and crannies of the of the image
here we have the ability to adjust our
spread our strength or light strength
and our distance we also have the
ability to adjust their light angle and
then as the same with the specular we do
have the ability to adjust the the
levels here so we've got some more image
editing controls of this as well so if
we want to adjust say our level min and
Max if we want to kind of increase the
contrast of that map you can do so and
you can see that the the 2d view is
updating so it's very nice that we
actually just go ahead and multiply that
diffuse right over top or excuse me that
ambient occlusion right over top of our
diffuse texture one of my favorite
features inside of b2m is the ability to
add grunge order
detail over top of your textures so what
we'll do now is we'll take a look at our
grunge tab and for this I'm going to go
ahead and just focus in here on our
diffuse so let's go ahead and just bring
this guy up to about a hundred percent
and let's take a look at these different
grunge map inputs we have so what we can
do is we can add some dirt or a grunge
map we can actually multiply or blend
that over top of our diffuse texture and
we have this grunge input setting so we
have several different map types so
we'll go ahead and take this grunge
diffuse blend mode and we'll set this to
normal and then we're going to go ahead
and take our grunge diffuse opacity and
we're gonna bring this all the way up
and so what that's going to do and again
if we take a look let's go ahead and
just make sure that we kind of maximize
this diffuse you can see that this is
the actual grunge map that we're taking
a look at but it's also being multiplied
over top of of the texture itself here
and so well at least be specular and the
height information is being multiplied
over top we're actually overriding the
diffuse by setting the blending mode to
normal and so we've got by default or
what comes with b2m is we actually have
about let's see here we have fifteen of
these free built textures and we also
have the ability for a user image so if
you would like if you have a grunge
library or something that you want to
use you can actually set this to user
image and then you can come down to this
area here where it says bitmap grunge
optional and you can actually place your
own image into that and that will be
used instead of the defaults but if we
kind of go through these guys and take a
look at what we have here so we've got
several different types here so as we
kind of just take a look at what we have
as we kind of just zip through these
guys you can see there's a lot of just
built in textures I really like number
seven and eight I use those guys a lot
but it's really nice that we can
actually have these built in and so what
we'll do in this case is we'll go ahead
and take our grunge diffuse blend mode
and we'll set this back to multiply and
by doing that you can see that well
we're multiplying some diffuse dirt
right over top of our entire material
and we'll change our grunge diffuse
opacity let's go ahead and just drop
this back so we don't have such an
tense effect but with just a few a few
options here that we've tweaked you can
see that we've gone through and we've
taken our texture here from looking like
this so we've got this nice clean
version here but then what we've done is
we've actually gone through and we can
go ahead and introduce some dirt and
some wear and some weathering basically
overtop of this image and this actually
which is actually really nice as this is
also working through tiling too so again
as we start to tile this you can see
that the grunge map is tiling as well
overtop of this image so it's a really
nice way to kind of get that that fresh
CG look off of your textures and add in
some dirt and we're on to that so here
we'll bring this tiling back now we have
several settings here we've got the
ability to have a blend mode for the
grunge diffuse we also have a grunge
specular opacity so if we start to
increase this the grunge will also start
to appear into our specular map and then
we also let's take a look at that here
let's go ahead and bring up our specular
map here so you can see here's our
specular map and as we come into right
now our grunge specular blend mode is
set to multiply if we start to increase
this value here you can see that the the
grunge setting is actually going to or
the dirt that's over top is going to
start to affect our specular as it would
so it's very nice that we actually have
this control to propagate through to our
different map types then as we scroll
down we can do the same thing with the
height map and then something else that
we have that's very interesting is in
the way that we can affect the grunge
adaptive shape and its shadows in the
diffuse and its shadows light distance
so let's take a look at the adaptive
shape so let's just go ahead and kind of
maximize here our diffuse again and
let's just so we can get a better idea
of what's going on here let's take this
grunge diffuse blend mode and let's go
ahead and set this to normal so now
we're looking at that grunge map here
and we might want to go ahead and change
this to a different map so we can really
see what we're doing here let's go
through and maybe pick something here
that that has here we'll go we'll put
these cracks in here whoops a change
that there and let's go ahead and just
get ourselves back to those cracks
there we go that'll be a good map there
and so what we're going to do is we're
going to be able to adjust the scrunch
adaptive shape so we're going to be able
to take the grunge map instead of just
having it to where it's just going to
multiply or just a you know just a flat
blend mode right over top of the diffuse
we can actually have it take take on the
shape of what this texture is so again
if we start to go through and adjust the
setting here you can see that here and
we'll zoom in on an area here we can
really see this take place let's go back
up to maybe 200% and we'll take a look
at kind of this rock area here so as we
start to kind of pull this out you can
see that the these the the cracks here
that are part of this grunge map will
start to kind of shape themselves around
those rock areas and so it's a really
nice effect and it helps to you know
helps to take away that kind of stamped
look or that you know hey I just took
this grunge back and just multiplied it
right over top of something else I'm
actually it's actually conforming to the
shape to the underlying shape of the
image so we'll just go ahead and set
this back here to let's see we'll put
this on multiply and we'll go ahead and
change our grunge map let's go ahead and
just put this back to eight it's kind of
a favorite of mine and we'll go ahead
and just go for the sky to view and now
we have a really nice set of textures
that we can export and use in any of our
applications as you can see using only
bitmap two material in substance player
we have a complete texturing solution we
can now export these textures so I can
come over here to the export as bitmap
and I have the ability to batch export
all of these Maps I could even export
any animated parameters that we have
here into an image sequence however with
bitmap 2 material that's only half the
story
you can actually use bitmap to material
in any substance enabled application so
in this case let's taking a look at an
example in unity so here we are in unity
and I have this very small level scene
and this level here if we come over to
the textures I started with a texture
sheet now this was created just in in
another application such as Photoshop
and this was basically an original asset
buff so it's something that I already
had
made and what I want to show is how I
can take this original asset or things
that you may have already have done in
your other projects and how you can
enhance them further with bitmap to
material so I have this texture Atlas
the ground here and you can see the wood
these are these are repeatable textures
so these textures are being mapped onto
individual little grids here that make
up this floor and then you can see here
that we got this this fence here is
repeatable horizontally across and so
what I did was I took this single
diffuse texture and then I fed that
right into bitmap 2 material so let's go
ahead and take a look at that material
here in unity if we come over here and
take a look
we've got here's the material bitmap 2
material I did some enhancements here on
the diffuse so I've got an enhanced
diffuse texture I've got a normal map at
a height map that was generated for me
what's really nice about this is that I
didn't have to create these maps in
another application or anything like
that I can do it all within unity all
using bitmap 2 material also the only
bit of weight to this project is the
fact that I have this diffuse texture so
bitmap 2 material will create the normal
map and the height map for me at runtime
the only weight that I have from this
asset is the original diffuse texture
that I fed it so this this decreases the
size of my binary so something else we
can do is if we go ahead and take a look
at this material you can see that again
it's using here's where it's using the
diffuse normal and the height we're
using the parallax effect excuse me the
parallax specular shader we have all of
the same material settings here or
texture settings that we have been
talking about through substance player
and you can see that all of those same
things are still available to us right
here inside of unity and so one of the
things that I want to do is I want to be
able to add some grunge onto this guy so
like I said before one of the things
that's really interesting about this is
that these the four here was all tiling
so each one of these pieces of floor
here now if I go ahead and select this
you could probably see from the
wireframe here but if you look we've got
here you can see these two triangles
here so each one of these grid pieces in
the 3d app when these were these were
just basically snapped together so if we
started to put ourselves a repeating
kind of like runge texture over top of
that you'd see the same exact pattern
over all of these all of these grids
that make up the floor but however by
using bit man's material I can get
around that
so let's go ahead and select the bitmap
into material let's come over and let's
go ahead and just add ourselves some
grunge maps as we just saw with in
substance player so I've got my grunge
input I'm gonna go ahead and use number
eight so again this is built-in I didn't
have to if I wanted to I could supply an
image but I'm going to go ahead and keep
working with the number eight and we'll
start by go ahead and increasing let's
see here let's change our grunge diffuse
blend mode let's go ahead and switch
this to multiply and then we'll go ahead
and just adjust our grunge diffuse
opacity
from there we'll come up and we'll
probably take a look here at our drench
mat balance as well as our grunge map
contrast
then I'll probably go ahead and just
back down that opacity here for our
diffuse again with those adjustments we
now have a nice grunge map showing up
over top of our scene and it really kind
of breaks up that surface and again like
I told you before we had that repeating
texture going across our floor and
bitmap is material takes care of that
very well and so we don't actually see
any seams or anything like that we've
got some nice dirt just placed right in
over top of this scene bitmap - material
is a powerful solution it's artistic and
technical merits are second to none
it has use from quick texture generation
workflows and armed with substance
player you have a full texturing tool
set all the way to full integration in
your runtime environment no matter what
your project requires bitmap - material
has you covered
for more information on substance
products be sure to check algorithmic
Calm
you