Placeholder Image

字幕表 動画を再生する

  • [MUSIC PLAYING]

  • COLTON OGDEN: All right.

  • Welcome to GD50.

  • This is lecture 10.

  • Today we'll be talking about "Portal."

  • So "Portal" is a very iconic game, I think most of us

  • have probably seen it before.

  • The gist is you have a portal gun, a gun that shoots these elliptical portals.

  • If you look through one, you can effectively

  • see what is coming out the other one, which is pretty cool, and vise versa.

  • And then, if you walk in between the portals,

  • you'll actually be teleported to the other side.

  • And so, they achieve a lot of really interesting effects

  • with some pretty cool tricks and stuff.

  • And actually Valve themselves will be coming

  • to give a talk on a lot of the technology

  • that they used on the second.

  • So we can get a glimpse into their version of "Portal."

  • My version of "Portal" is a bit simpler, but we'll

  • look at a lot of the same sort of principles

  • and see how I accomplished a lot of the same things.

  • So this is also the last lecture of the semester,

  • and we've covered a lot of ground.

  • I have a few screenshots here to show some of the games

  • that we've talked about.

  • The very first game was "Pong," and we've come sort of a long way.

  • We have gone through very simple arcadey Atari-like games like this,

  • and have gone and created worlds effectively.

  • And now we're in 3D, we're doing all kinds of awesome stuff.

  • But this was where we started the course.

  • And it's kind of fun to look back and see where we've come.

  • So here, we talked about scoring and just effectively drawing shapes

  • onto the screen, then we transition to "Flappy Bird" or "50 Bird,"

  • and we had sprites and characters.

  • And we talked about scrolling and infinite level procedural generation

  • type algorithms, and that was fun.

  • We took things a step higher than that with "Breakout"

  • where we had the same sort of procedural ideas

  • in the context of a very famous arcade game.

  • We talked about particle systems and some arcade style

  • physics and high scores.

  • Then we went into puzzle games.

  • We talked about Match Three" and how to actually calculate

  • what goes on to determine whether we have gotten a match

  • and how to clear blocks and how to tween things,

  • do operations over time, sort of this A synchronicity.

  • Then we went into probably what is my favorite lecture, which

  • was "Super Mario Brothers," and we talked

  • about how to create procedural worlds that all look very different

  • with some very simple algorithms.

  • And then we had triggers and events sort of happening.

  • Then "Legend of Zelda" came, and we had this infinite dungeon algorithm.

  • And we had enemies walking around that we

  • could use a sword on, so it felt more like an actual action game, action RPG.

  • Then took a brief look at physics in the context of Box 2D with "Angry Birds,"

  • and I still remember the ball pit example was probably

  • my favorite part of that.

  • And then probably the most complicated example of the semester

  • was "Pokemon," where we actually had a semi full turn based

  • parallel system, and random encounters, and like a little world where there's

  • actually two main stages to our world where there was the field

  • and the battle scene, which is a very common thing to have in RPGs.

  • Following "Pokemon," which was the most complicated codebase,

  • we went into Unity, which was our first foray into 3D.

  • And even though we were just exploring 2.5D,

  • we still got a chance to look at how does the Unity engine work and how do

  • we get actual 3D models onto the screen?

  • And we put together a very simple "Flappy Bird" esque game so

  • that we could sort of recycle prior ideas.

  • Last week, we looked at "Dread 50," which was sort of a Dreadhall's horror

  • inspired game where we got to look at lighting

  • and how to actually transition between scenes and use some basic UI in Unity.

  • And today, we'll be talking about how to create a game similar to this,

  • although much simpler.

  • Today is mostly just a tech demo more than anything else.

  • But this is a screenshot of the actual game "Portal."

  • And as you can see, they do a lot of really cool fancy things.

  • They have a portal on sort of a slope, they

  • have another portal coming out of the front wall over back there.

  • There are different colors so you can differentiate between left and right,

  • orange and blue.

  • They have sort of this object here on the side,

  • and I believe that's to shoot cubes out, which this here

  • is a cube which you can then grab with your gun

  • and then shoot it through portals and see it come in and out of portals,

  • which is pretty cool.

  • And we'll talk today about how to create a simple version of this, primarily

  • just the aspect of how do I create a portal that looks out of another scene

  • and see it updating in real time?

  • And how do I teleport and get back and forth between the portals

  • and carry a weapon and then shoot a ray that will actually place a portal where

  • I want to in the game world?

  • So today, some of the topics we'll talk about.

  • So one, holding a weapon.

  • So we've used a first person controller, and this

  • is a very easy and simple thing to do.

  • But it helps illustrate what parenting is.

  • And so we'll talk about that.

  • Ray casting is the actual shooting out of a ray from your object

  • to Z direction forward.

  • So you have an X and a Y, which are sort of the angle at which you're

  • moving around.

  • But then you have Z, which if you're using the forward vector

  • from your character, it's going to be forward in the z-axis

  • wherever you're looking effectively.

  • And so that allows us to cast a ray, in that sense, which just means shoot

  • a straight line, an invisible straight line from that point,

  • and wherever that point intersects with an object,

  • we can get some information about that and then do

  • whatever work we need to do.

  • In this case, take a portal prefab and just affix it to the wall, basically.

  • Rotate it from its default position, and then just

  • put it flat up against the wall.

  • Texture masking is how we're going to achieve this portal effect, right?

  • Because when we create what's called a render texture in Unity, which here's

  • the third bullet, a render texture just means a texture

  • that we're rendering to with a camera.

  • So rather than have a texture be an asset in your game, in your hierarchy

  • with something that you made in Photoshop,

  • you can actually dynamically create it at runtime

  • with what the camera is seeing.

  • And Unity gives this to you for free very easily

  • with what's called a render texture, which is just another asset type.

  • And then texture masking is effectively the same thing

  • as stenciling where we can choose certain pixels of an object to delete.

  • In this case, we create a texture that's white in the center and then black

  • around the edges in an elliptical shape.

  • And what that allows us to do is tell it with a simple shader,

  • don't render these pixels when you actually render the render texture,

  • just render the ones in the middle.

  • And so, that's how we achieve an ellipse, just by effectively

  • discarding the pixels in the outer rim.

  • Decals is an idea in 3D games where a decal is just something

  • that you affix a texture or some object that you affixed to a surface.

  • In this case, we'll be using decals to act as our portal.

  • So our portals are actually just going to be decals.

  • They're just meshes with a render texture affixed to them.

  • And then all we need to do is just slap them onto a wall whenever we shoot it,

  • and we get a ray that intersects with the wall.

  • And that will have the effect of actually making

  • it look like we're putting a portal on a wall, when in reality, we're

  • just taking a mesh and we're kind of just like slapping it onto a wall.

  • Some other examples of decals that you've probably seen in other games

  • are, for example, bullet holes, which use the same principle.

  • Teleporting is very easy, although the FPS controller sort

  • of complicates things a little bit.

  • So we'll talk about how and about sort of solving the problem of teleporting

  • in a way that makes sense.

  • It's usually just as simple as setting something's transforms position

  • to another transforms position, setting the rotation

  • to the transforms rotation.

  • But the FPS controller cashes its rotation data,

  • so in order to that teleport cleanly you sort of

  • have to override some default behavior.

  • And lastly, we'll take a look at some new tools

  • that Unity has introduced with 2018 0.1 Pro Builder and Pro

  • Grids, which allow you to actually model geometry in the scene.

  • And this is what the assignment is going to be focused on.

  • Because going forward, I foresee it being a major part of modern unity

  • development and or prototyping.

  • The ability to model your scene in Unity without needing a third party program

  • heavily optimizes the actual creation process

  • and allows you to do easy, what's called,

  • "gray boxing," meaning create a level in your game engine and then prototype it,

  • test it, make sure that it's actually game playable right off the bat.

  • That's called "gray boxing."

  • But first, let's get a demo.

  • So does anybody want to come up here and play my implementation of "Portal?"

  • So James is landlocked.

  • All right James, you're not landlocked.

  • Let's go.

  • All right, so I'm going to go ahead and set that up.

  • And so disclaimer, there's actually a bug in this

  • as well, so I'm curious to see if you can spot what the bug is.

  • Go ahead and hit play as soon as you're ready.

  • And then the mouse on the right will be your angle your portal.

  • So we see here I have a character with a portal gun created.

  • So James, if you shoot a wall with the left mouse, that will create a portal.

  • And then if use the right mouse--

  • so that's one other bug.

  • So let's go ahead and restart the program, actually.

  • So that's one bug.

  • And so, if we avoid stepping into a portal that's there--

  • and this this could be fixed in a couple of ways.

  • So now you have two portals basically created.

  • Do you see what's wrong with the portal as it is here, both of these portals

  • actually?

  • Oh actually, no, I'm sorry, these portals are actually completely right.

  • But walk through them.

  • And I will show you--

  • OK, so you can see it works pretty well, right?

  • You can not only see your character rendering completely or moving

  • in real time when the other texture, but you can jump through them

  • or walk through them.

  • You can jump with spacebar if you want, and that'll

  • teleport you throughout the other end so you

  • see from the perspective of the other portal.

  • But if we try shooting one of the other walls

  • for instance, like one of these white walls,

  • you can see something weird happens with this particular wall.

  • Anything strike you as odd about that portal?

  • Anybody?

  • It's upside down.

  • And so if you walk through it though, it works perfectly fine.

  • Now the reason that it's upside down, I spent probably like 10, 15 hours

  • trying to figure out why this is, it's in a state

  • of what's called "gimbal lock."

  • So this prefab right here, there's three axis of rotation in 3D space.

  • And if you perform a rotation in some odd way,

  • there are these things called oiler angles,

  • which are your angles of rotation about the x,y and z-axis.

  • And you can sort of think of them as sort

  • of being able to rotate interdependently.

  • But there is a situation in which you can--

  • for some reason, Unity's internal representation of a rotation

  • can get messed up by manipulating these angles.

  • And so, you can actually lock two axes together such

  • that rotating-- like for example, in this case, it's Z and Y,

  • they both rotate each other.

  • And so you're unable to get, in this particular case, the portal to rotate

  • about the axis that lets it look like its right side up based

  • on the wall's surface normal.

  • And so, had I maybe another week, I probably could have debugged it,

  • but I had to leave it in.

  • Unfortunately, I ran out of time.

  • But the interesting thing is if you do shoot that same wall--

  • so try and shoot that wall, the other wall with--

  • like put both portal on the buggy wall, so the right wall.

  • It's only that wall, by the way, for some reason.

  • So notice that now its right side up.

  • So if you shoot both portals on the same wall, that buggie wall,

  • they do get right side up.

  • And I for the life of me couldn't ascertain exactly as to why.

  • I know it's gimbal lock.

  • Unfortunately, I was unable to debug it quite in time.

  • But every other wall, including the ceiling and the floor,

  • will work if you shoot a portal up on them.

  • So you can create one up there, and then you can jump through it.

  • See how it's looking down, and then it'll put you at the top.

  • And altogether, minus the weird single wall that gimbal locks the portal,

  • we have a pretty functional implementation

  • of a very basic portal game, right?

  • We have this model here is parenting to the camera.

  • So it's always going to look in the exact same direction as the camera.