Subscribe to GameFromScratch on YouTube Support GameFromScratch on Patreon
1. June 2015


For my most recent tutorial, I am using a feature that is currently under active development.  This means I have to use a developer preview release and I figured I would share a quick post on how to install preview releases.  Of course the standard disclaimer applies…  you should never use preview releases for production work!



Installing a Preview Release

To install a Unreal Engine preview release, launch the Epic Games Launcher.



Select Library



Click Add Versions



A new empty version will be added:



Click the arrow to the top right and select the version you wish to install.  You will note the preview release isn’t available as an option for me ( nor is 4.7.6 ), as they are already installed on my machine.



The preview release should now download and install.  Now the next time you launch Epic Games Launcher, you will have an option over which game engine to launch:



It is safe to install multiple versions side by side, although it will take 5-6GB+ of disk space per install.  However project versions may not be compatible between different engine versions.  When you go to open an existing project, the engine version of each project will be noted, like so:



29. May 2015


Up until this point we’ve covered a ton of the items that go into making a game, but nothing resembling a game… the pieces simply didn’t fit together.  In this tutorial we are going to change that and start bringing everything we learned together.  We are going to be covering a lot today, so if I lose you let me know.  This might be one of those tutorials where the video version comes in very handy.


Once again, I am simply going to assume you’ve gone through all the prior tutorials, so instead of telling you how to make a flipbook, I simply say “Make a flipbook”.  So if you haven’t already, you may want to go back and read or watch the earlier tutorials.  Ok, let’s jump right in.


There is an HD video version of this tutorial available here, or available embedded below.



Actors, Pawns, Characters and Controllers


In the world of Unreal Engine, things that exist in the game world are Actors.  Quite simply an Actor is an object that can be placed into a level.  It contains details like position, rotation and scale.  Most importantly, Actors are containers for Components, or even a hierarchy of components.  Components can be thought of as attributes or properties of an actor…  these are the things the actor is and does, and the Actor->Component relationship is a big part of Unreal’s modular design.


There are a few very important classes derived from Actor that are very important.  The first of which is the Pawn.  Basically a Pawn is an Actor that can be controlled by either the player or the games AI. Each Pawn has a Controller and each Controller has a pawn.


The Controller can control a pawn.  This takes two forms, AI controllers and character controllers.  The AI controller is responsible for the artificial intelligence that controls a pawns movements.  The Player Controller on the other hand is responsible for handling input from the player(s) and applying the results to the character’s pawn.


Finally you have Characters. A Character brings a number of objects together to represent that character.  In the 3D world, the Character class extends Pawn to include a skeletal mesh, a mesh for collision detection and of course whatever components you add.  In the Paper2D world there instead is PaperCharacter, which instead of a mesh instead has a Flipbook.


These key classes all work together to provide the building blocks of your game.  Don’t worry, we are about to see it all in action in a few minutes.


Getting Ready


We are now going to create the skeleton of a game, but this is going to require you to do a few things.  First of course create a new project, I am using these settings:



After loading I want a completely clean slate so I select an delete everything the project included:



Next, we need to import some sprites, both as a background and to create a flipbook for our main character.


I am using a simple three frame animation using this frame, this frame and this frame.   For my world background I am using this image.  Any likeness or similarity to an existing game is purely coincidental…   Obviously you don’t have to use these images, but if you want to follow along exactly you can.


Load all four images in as textures, then make a sprite from each.  Create a new Sprite Flipbook out of our 3 frames of animation and set the frame rate at 2fps. Then drag the fourth sprite in as our scenes background.  Be sure to set the backgrounds Y value to a negative so our game sprite will draw in front of it! 


Ultimately you should have something like this:



With a Flipbook like this:



Creating a Main Character


Now that we have a world and an animation, it’s time to add a character to the game.


To do so, select Add New, then Blueprint Class:



It is going to present a dialog with a number of the options we talked about earlier.  The one we are going to use in this example isn’t actually on the list so select All Classes:



In the filter type “Pap”, then locate PaperCharacter, click it and press Select.



This will create a new Blueprint for you, I immediately renamed mine MyPlayer.



I suppose I should point out, you don’t have to use PaperCharacter, any Pawn derived class is fine, although the process will be slightly different.


In the Content Browser, double click MyPlayer to bring up the Blueprint editor, it should look something like this:



Now we need to set the Flipbook for our Player.  You will notice on the left hand side, several components are already defined:



Select Sprite.


Now with sprite selected, it’s details should appear on the right hand side.  No locate Sprite and select the Flipbook you created earlier:



In the Viewport tab, your Player should now look like:



Now we want to shrink the capsule down to match our sprite.  The capsule container is used for doing collision tests and should be as near an approximation as possible.  Simply select the capsule in the viewport, then in details locate Shape and set the two values until it just fits around your sprite.  I used:



And the end results looks like:




Adding a Camera


Let’s look at the process of adding a component to an actor, in this case a Camera.  This will create a camera centered on the Actor.  To do so, in the Components panel select Add Component, then Camera:



In the viewport you will now see your new Camera component:



Right click select it, hit E to rotate and rotate it 90 degrees.  Then hit W to move it, and move it back along the X axis.  Something like this:



The angle and distance between the camera and the sprite are important, but once you’ve got things configured correctly ( in a few minutes ), you will be able to hit the Play icon and preview the effect of the camera on your player.  If we needed more fine tune control of the relationship between the camera and the sprite, we could add a Swing Arm component and attach the camera to it.  We don’t need this in this particular example though.


Configuring your game


Now that we have our player class, we need to let the game know that it is our player.  This is done by creating a GameMode blueprint.  To do so drop down the Blueprints icon, select GameMode->Create->GameMode, like so:



In the resulting dialog, name it then select OK.  I’m going with the default NewGameMode.



This will create a new Blueprint but the part you are most interested in are the properties.  It is here that you configure a number of important top level classes for your game.  Locate “Default Pawn Class” in the Classes section and select your Player class.



Now when the game starts, and instance of your Player class will automatically be created.


Now we just need to tell the game WHERE the player should be created, and this is done using a Player Start object.  In the Modes dialog, locate or search for Player Start and drag one onto the scene where you want the player pawn to be created.



And position it like so:



Now press play and we see…



Hmmm… that’s not good.


The problem is, our game world has gravity enabled by default and we don’t want this.  The easiest fix is to turn gravity off.


To turn off gravity, in the World Outliner, double click your map to bring World Settings dialog up.  Now locate the Physics section, check Override World Gravity and make sure gravity is set to 0.



Now when we press play we should see:



Much better, we are now one step closer.  We have a world (sorta…  I’ll admit, we are faking that part pretty heavily here), we have a main character… now we just need to add some controls.


Simple Keyboard Controls


Now we are going to jump into some Blueprint programming to add some keyboard controls to our player.  Double click your MyPlayer blueprint to bring it up in the editor, then select the Event Graph task.  Personally I am deleting all of the premades that they provide to keep things a bit cleaner.


Now we are going to add an input handler for when the user presses the Right arrow key.  Simply right click the canvas, type Right and select Key Events –> Right like so:



We create this simple blueprint.



Now when the user releases the right arrow, we move the Character Movement component of our player by 20 along the X axis.


Now through the power of Cut and Paste, we quickly create the following simple control scheme:



All that changes is for each key pressed we move in a different direction, either +/- x for left and right, or +/- z for up and down.


In case you didn’t know, you can rectangle select a region of blueprint and replicate it use the traditional cut/copy/paste hot keys.  Now we we run our game, we have primitive control over our player:



This is a very very very trivial example, and as you can see, it’s missing some logic for left and right as “definitely not PacMan” doesn’t turn to face the direction we are facing.  If you watch the video version of this tutorial I will show a simple way to handle that situation, we are already running pretty long here.


More on Input


The above example was super simple, we simply respond directly to a certain key being pressed.  In your game you probably wont end up using this logic.  Let’s take a quick look at some more advanced control options before moving on.


First, there was additional options for the key handling events that I never showed.  With a Key event selected in the Details panel you will see additional options:



In addition to changing the key handled you can enabled/disable modifier keys like Ctrl and Shift.  You can also control if the keyboard event is handled or will be propagated to the rest of the application by setting Consume Input.


More commonly however, you are going to want to handle Input more generically.  Responding to a single key event is all well and good, but what happens when you want the same code to work on a device without a keyboard?  Or you want a joystick to do the same thing?  Or you want the user to be able to remap their own keys?  Well, good news, there is an answer for that.


First, select Edit->Project Settings:



On the left, under Engine select Input then locate the Bindings section:



This area allows us to create input bindings between controls and either an action, or the axis of a controller ( virtual or otherwise ).  Let’s look at an example of mapping a “Left” axis.


Start by clicking the + next to Axis Mapping, expand the new value and rename it left, then add a key like so:



Now I am going to repeat the task, but also mapping for the left D-pad on a controller and the A key.  The end result looks like:



Now instead of handling each controller/key separately they will all emit the same “LEFT” event.  When you are creating your input handling blueprint, you can now respond to an Input->Axis Events->LEFT event:



You will notice the Event for an axis has one additional parameter:



Axis value is the “amount” along the axis it is.  All of our examples are on/off inputs, but if you had an analog stick, the Axis Value would indicate how far to the left the stick was pressed.  Coincidentally, that is the use of the “Scale” property in the Axis mapping process.  If for example you wanted the Left arrow key to be equivalent of pushing the Left analog stick 50%, you would set the scale value to 0.5.





29. April 2015


In the previous part we looked at we look in a bit more detail at working with Sprites, now we are going to get a bit more… animated.  In this tutorial we are going to look at using Spritesheets, named Flipbooks in Unreal Engine, to create sprite animations.


A bit of a warning before we jump in, as of writing this process is a bit buggy and needing improvement.  Hopefully by the time you read this, the Unreal team have ironed out some of the kinks.  If you want more details on creating the spritesheets and a bit more exposure to some of the Unreal Engine faults, be sure to check out the video version, it goes into much greater detail.


This tutorial is available in an HD video here.


Importing a Spritesheet


A Spritesheet is simply a texture with multiple sprites on it.  This is the one I am using for this example:



It is a power of 2 resolution PNG file containing 25 frames of a walk cycle animation.  A bit of a warning however, I HAVE HAD NO SUCCESS WITH PNGs in Unreal.  To get this to work I had to convert to tga format before importing.  Regardless to how the PNG is made, the results are almost always mangled once imported to UE4.


To get started, simply drag the texture in as normal.  The critical part of this equation is that your file must have an alpha channel, as the alpha channel is used to calculate each sprites location in the next portion.


Now that we’ve added our spritesheet to our textures, simply right click and select Extract Sprites:



Using the alpha channel, it will automatically create a sprite for each image in the spritesheet, like so:



With all of the generated sprites selected, I now moved them into their own folder in the Sprites folder.  This step is of course strictly optional.


Now a bit of a bug/problem with Unreal Engine…  Each of the generated sprites is automatically named, but the names themselves make no sense.  First off, they are named FILENAME_Sprite###.  However, the Content Browser doesn’t sort properly for alpha numeric, meaning that Sprite11 and Sprite12 come before Sprite2 and Sprite3, which makes things particularly painful to work with.


Even worse, the order they are created in makes absolutely no sense right now… so the process of creating a flipbook is needlessly complicated.  You’ll see what I mean in a moment.


First lets look at a generated sprite and suddenly Edit Source Region will make a ton more sense.  Simply double click a sprite to bring it up in the Sprite Editor.  Here is the very first sprite in the sequence opened in the editor. 



Now click Edit Source Region and you will see how multiple sprites can be stored in a single texture:



As you can see, our sprite is actually just a very small portion of the over all texture.  We would expect the next sprite to be Sprite2, 3, 4, etc…  but sadly, they aren’t.  I honestly cant make rhyme or reason of the naming convention Unreal used for automatically parsed sprites.  Sadly you will need to figure them out in order to deal with the next part of the process.  Hopefully this all gets fixed soon, as it’s extremely irritating.   For now select each sprite and figure out where it is in the order…  mine basically went


Row1: sprite, 2,3,4,5,6,7

Row2: 12,13,14,11,10,8,9

Row3: 15,16,17,18,19,20

Row4: 24,25,23,22



… if you see the logic there, good on you!  Ultimately once you figure the order out, the names really don’t matter, but you can rename them to make sense if you want.  Or you could change the UV values of each so the existing names actually make sense.  Me, I’ll just wait for Unreal to fix this mess.


Creating a Flipbook Animation


Anyways, once you’ve figured out your sprite frame orders, it’s time to create a new Flipbook.  Simply select New->Animation->Sprite Flipbook, like so:



A new flipbook will be created, feel free to rename it.  Then double click it to bring up the Flipbook Editor:



Now what you want to do is drag each Sprite over to the bottom of the page, in the order of the animation frames ( that’s the list I made above.  Basically if your spritesheet is like mine you want the top row, left to right, then the next, and the next, etc ).  The order they are dragged is the order they are played in the sequence:



You will see a real-time preview of your animation as you drag sprites in:



You can change the over all speed of your animation here:



That is the number of frames that will be shown each second.  So a 26 frame animation would take 2 seconds to complete.  You can also set the duration of each frame, here:


Frame Run is how many frames this animation frame will be shown for.  For example, if you had Frames Per Second set to 10 and Frame 1 set to a Frame Run of 5, that particular frame would be shown for 1/2 a second.


Now your animated sprite can be added to the scene just as easily as a normal sprite, simply drag the flipbook in to your scene:



Truth is however, you will rarely use a Flipbook this way, instead they will generally be owned by an Actor, which we will cover in the next portion.


The Video



24. April 2015


As you may have guessed from the title, it today’s tutorial we are going to look at working with Sprites using Unreal Engine.  We already looked briefly at creating a sprite in the previous tutorial, but today we are going to get much more in-depth.


Before you can create a sprite, you need to have a texture to work with.  Unreal Engine supports textures in the following formats:

  • .bmp
  • .float
  • .pcx
  • .png
  • .psd
  • .tga
  • .jpg
  • .dds and .hdr ( cubemaps only, not applicable to 2D )


That said, not all textures are created equal.  Some formats such as bmp, jpg and pcx do not support an alpha channel.  This means if you texture requires any transparency at all, you cannot use these formats.  Other formats, such as PSD ( Photoshop’s native format ) are absolutely huge.  Others such as BMP have very poor compression rates and should generally be avoid.  At the end of the day, this generally means that your 2D textures should probably be in png or tga formats.  Unreal also wants your textures to be in Power of Two resolutions.  Meaning that width/height should be 2,4,8,16,32 … 512, 1024, 2048, etc…  pixels in size.  It will work with other sized textures, but MIP maps will not be generated (not a big deal in 2D) and performance could suffer(a big deal).  Keep in mind, your sprite doesn’t need to use all of the texture, as you will see shortly.  So it’s better to have empty wasted space then a non Power of Two size.


* Personally I’ve experienced all kinds of problems using PNG, such as distorted backgrounds, while TGA has always worked flawlessly. 


Adding a Texture to your game


Adding a Texture is simple as selecting a destination folder on the left, then dragging and dropping the appropriate file type (from the list above) from Finder/Exporter to the Content Browser window, shown below:



Alternately, you can click New –> Import



Then navigate to the file you wish to use and select it. 


You texture should now appear in the Content Browser.


Texture Editor


Now that you have a texture loaded, you can bring it up in the Texture Editor by either double clicking or right clicking and selecting Edit.  Here is the texture editor in action.  It is a modeless window that can be left open indepently of the primary Unreal Engine window.




The Texture Editor enables you to make changes to your image, such as altering it’s brightness, saturation, etc…  you can also change compression amounts here.  However, for our 2D game, we have one very critical task…  turning off MIP maps.

What's a MIP Map?

History lesson time! MIP stands for multum in parvo, Latin for "much in little". Doesn't exactly answer the question does it? Ok, lets try again. Essentially a MIP map is an optimiziation trick. As things in the 3D scene get further and further from the camera, they need less and less detail. So while right up close to an object you may see enough detail to justify a 2048x2048 resolution texture. However, as the rendered object gets farther away in the scene, the texture resolution doesn't need to be nearly as high. Therefore game engines often use MIPMaps, multiple resolution versions of the same texture. So, as the required detail gets lower and lower, it can use a smaller texture and thus less resources.
You know when you are playing a game and as you move rapidly, often textures in the background "pop" in or out? This is the mipmapping system screwing up! Instead of seamlessly transitioning between versions, you as the user are watching the transition occur.

Support for MIP maps is pretty much automatic in Unreal Engine.  However in the case of a 2D game, you don’t want mipmaps!  The depth never changes, there should never be different resolution versions of each texture.  Therefore, we want to turn them off, and the Texture Editor is the place to do it.  Simply select Mip Gen Setting and select NoMipmaps.



Before you close the Texture Editor, be sure to hit the Save button.



Creating A Sprite


Now that we have a Texture, we can create a sprite.  This is important, as you can’t otherwise position or display a Texture on it’s own.  So, then, what is a Sprite?  Well the nutshell version is, it’s a graphic that can be positioned and transformed.  The name goes back to the olden days of computer hardware, where there was dedicated hardware for drawing images that could move.  Think back to PacMan…  Sprites would be things like PacMan himself and the Ghosts in the scene.


In practical Unreal Engine terms, a Sprite has a texture ( or a portion of a texture, as we will see shortly ) and positional information.  You can have multiple sprites using the same texture, you can have multiple sprites within a texture, and the sprites source within a texture can also change.  Don’t worry, this will make sense shortly. In the meantime, you can think of it this way… if you draw it in 2D in Unreal Engine… it’s probably a Sprite!


Once you have a Texture in your project, you can easily create a sprite using the entire texture by right clicking the Texture and selecting Create Sprite, like so:



You can also create a new sprite using New->Miscellaneous->Sprite



This will then open up the Sprite Editor.  If you created the Sprite using an existing texture, the texture will already be assigned.  Otherwise you have to do it manually.  Simply click the Texture in the Content Browser.  Then click the arrow icon in the Details panel of the Sprite Editor on the field named Source Texture:



Your texture should now appear like so:



You can pan and zoom the texture in the view window using the right mouse button and the scroll wheel.


Now remember earlier when I said “all or part of the texture”?  Well a Sprite can easily use a portion of a texture, and that’s set using the Edit Source Region mode:



This changes the view panel so you can now select a sub rectangle of the image to use as your sprite source.  For example, if you only wanted to use Megatrons head, you could change it like:



Then when you flip back to View, your texture will be:



When dealing with sprite sheets, this becomes a great deal more useful, as you will see shortly. 


There are a couple other critical functions in the Sprite Editor that we will cover later.  Most importantly, you can define collision polygons and control the physics type used.  We will look at these functions later on when we discuss physics. 


Two very important settings available here are:



Pixels Per Unit and Pivot Mode.


Pixels per unit is exactly what it says… a mapping from pixels to Unreal units, which default as mm.  So right now, each pixel is 2.56mm in size.  Pivot Mode on the other hand determines where a sprite is transformed relative to.  So when you say rotate 90 degrees, you are rotating 90 degrees around the sprites center by default.  Sometimes top left or bottom left can be easier to work with, this is where you would change it.


The final important point here is the Default Material, seen here:



This part is about to look a lot scarier than it is!  Just know up front, if you prefer, you can ignore this part of Unreal Engine completely!




Every mesh in Unreal Engine has a material attached, and when you peel back all of the layers, a Sprite is still ultimately a mesh… granted, a very simple one.  There are two default options available to you included in the engine, although depending on how you created your project, you may have to change your view settings to access them:



Then you will find the two provided materials for sprites:



The name kind of gives away the difference… DefaultLitSpriteMaterial takes into account lighting used in the scene.  DefaultSpriteMaterial ignores lighting completely.  Unless you are using dynamic lighting, generally you will most likely want the DefaultSpriteMaterial.  You can edit the Material by double clicking:



This is the Material Editor and it is used to create node based materials.  Basically it’s a visual shader programming language, behind the scenes it ultimately is generating a GLSL or HLSL shader in the end.  Truth is the process is way beyond the scope of what I can cover here and in most cases you will be fine with the default shader.  If you do want to get in to advanced graphic effects, you will have to dive deeper into the Material Editor.


Creating a Sprite


Now that we have our texture and made a Sprite from it, it’s time to instance a Sprite.  That is, add one to our scene.  This is about as simple as it gets, simply drag a Sprite from the Content Browser to the Scene, like so:




Now that you’ve created a Sprite, you will notice that there area  number of details you can set in the Details panel:



All sprites by default share the same source sprite and material, but you can override it on an instance by instance basis.  For example, if you wanted a single sprite to be lit and all the others to be unlit, you can change the Material Override on that single sprite.  Obviously using Details you can also set the sprites positioning information and some other settings we probably wont need for now.



Next up, we will look at sprite animation using a flipbook.


12. April 2015


A video only version of this tutorial is available here.Untitled 7


In this part of the Unreal vs Unity Tutorial Series, we are going to take an introductory look at Unreal Engine.  A bit of a guide tour of the interface as you will need to understand it to make 2D games.  I assume at this point you’ve downloaded and installed Unreal Engine already.  If not, go do so!  It is now completely free, but you will have to register before downloading.


Once you’ve finished the install, you will have one icon to deal with, Epic Game Launcher.



Click this.


The Launcher


This will load up the Launcher, like so:



There are currently three tabs across the top, one for Unreal Engine, then one each for the in development games Unreal Tournament and Fortnite.  Generally what you want is the Unreal Engine Tab and simply click the Launch button.  However it is also a good idea to look through the Learn tab to see the wealth of learning materials available for Unreal.  ( this tab is selected in the image above ).  The Marketplace is another great place to browse, full of free and paid assets you can drop into your game, including models, animations, blueprints, sample levels and tutorials.


For now though, click Launch.  Don’t be surprised if you have to download an update, there are frequent updates.


Once you click Launch, the following dialog should appear:



If you want Unreal to auto reload the project you are currently working on, instead of this dialog, be sure to tick the “Always load last project on startup” dialog.


In our case though, we are going to create a simple project today, although the details are probably going to be in a second post to keep things from getting too long.  Click the “New Project” tab.  Then fill it in like follows:


If you want to change the location, you need to click the drop down arrow icon at the bottom right to get additional options.


In this dialog you can start from a number of different templates, using either Blueprints or C++.  Templates include starter projects such as FPS, Flying game, Racing Game, etc.  In our case though, we want to start from scratch, so we chose Blank.  Additionally there is a bunch of content to get you started.  We however do not want it right now.  You can easily import it after the fact if you prefer.


Once you click “Create Project” the Unreal editor itself should finally load.


Unreal Editor


Welcome to Unreal Engine!  This is where you are going to spend a great deal of your game development life going forward, so let’s take a quick tour.


First, lets start with a shot of the entire editor, then we will break it down into sections.



Unreal is one of those applications that absolutely eats screen space.  It also supports multiple Windows and you will often have several editors open at once.  This is one of those applications that justifies your extremely expensive, ultra-wide monitor setup!  If you haven’t discovered the joy of multiple monitor development, you really need to!


Let’s break the screen down into easy to digest pieces.


Modes Panel



For a 2D game, this is a panel you are rarely going to use.  The tabs across the top are Place, Paint, Landscape, Foliage and Geometry Editing.


The last four are almost all entirely used for 3D games and we will be ignoring them.  Place however is used for placing game assets in your game, and we will be using it.  You can quickly add new objects using the Search Classes dialog, like so:



Once the item you want to place is selected, you can simply drag it into your scene.


The Content Browser panel




The Content Browser is critically important.  This is how you get assets into your game.  All the various files that go into making your game, such as models, textures, etc… can be drag/dropped into the right side of the Window.




The left hand folder hierarchy can be organized however you like.  Collections are a way of keeping similar things together.  You can also easily create new content by clicking New or Right clicking:



Now, remember earlier when we unchecked Include Starter Content?  Well, let’s say you want something that included with the engine itself?  Well fortunately that’s quite simple.


Selecct View Options, then check Show Engine Content. 

Now you will see an additional folder in the Content Browser:



You can then copy this content into your engine and turn it back off again if you wish.


The final, and perhaps most important feature of the Content Browser, are the right click context menu when you click game assets, such as the image we dragged in earlier:



These menus are context sensitive to the type of file you’ve clicked.  As you can see from this being an image file, the top half of the menu is populated with the Texture Actions menu.  Choosing Edit for example, brings up the Texture Editor window:



Basically the Content Browser is where you add, manage and edit game related assets.


The Toolbar



Across the top of your screen you have the convenient toolbar.  Most of the buttons are self explanatory, but a couple deserve further mention.  Buttons with drop down arrows have additional options, like you can see with the expanded Play button above.  Play runs your game, either in the current viewport, in a new window, as a stand alone game or in the mobile simulator.  Launch on the other hand is used for running your game on an actual device, such as an iPad.  Blueprints and World Settings are very handy, but we will cover both in more depth shortly, so stay tuned.


Scene Outliner




This is your scene graph.  This is where you create actual instances of your game assets to put together a level.  Think about it this way…  imagine playing with a set of Lego to build a world.  The individual different lego pieces… the big flat green thing, the 4 post bricks, the 2 post bricks, etc…  this are you building blocks and would be the analog of stuff that appears in the Content Browser.  The actual individual pieces, those that you use to build your house or whatever… those are what would appear in the Outliner.  The minute you drag an item from the Content Browser into the scene, it will appear in this list (technically tree).


As you can see from the screenshot above, there are a number of options for selecting each instance, editing it’s code, modifying it’s visibility, etc.  You can of course remove items from the level using this interface as well.


The Details Panel




Going hand in hand with the Outliner, the Details panel enables you to edit the individual properties of each object instance in your game world.  It is completely context sensitive, as you can see in the screenshot above, these are the details with the Lightsource selected in the outliner.  All of the editable attributes of each component that makes up the selected object can be edited here.


The Viewport


And finally… the biggest one for last, the Viewport.



This is the 3D representation of your scene.  You can drag objects from the Content Browser to the viewport to add them to the scene ( they will also appear in the Outliner ).  You can select, move, rotate and scale objects.  Speaking of moving, rotating and scaling, those can also be controlled using these buttons:



You can also use the W, E and R keys respectively.  ESC to unselect.  Use the left mouse button to select an object.


Here are translation, rotation and scaling in effect.  As you can see, each axis is represented and colour coded in the widget:



A quick note on scene camera controls.  In Perspective mode you can freely move the camera around.  The controls are as follows:


Zoom in/out : Scroll wheel or ALT + RMB

Orbit Camera: Hold RMB + move

Pan Camera: MMB + Move



There are a number of very important menus for the viewport controls.  The first is the one that lets you switch between the different predefined views, or the free form perspective mode:



Clicking the drop down arrow at the top left corner contains a series of very important configuration menus, including the ability to change the layout:



If you prefer the traditional quad view like 3D Studio MAX, you can click the icon in the top right corner to toggle between a quad and single view mode, like so:



Finally, you will often want to switch visibility modes.  Sometimes you want your scene textured and lit.  Often in 2D you want it textured and unlit.  In a large scene, or working behind something else, wireframe is often handy.  They can all be toggled with this menu:


As you can see, the majority of those settings also have a quick Alt + # hotkey available as well.




So, that is a basic guided tour of the Unreal Engine tools.  In the next text tutorial, we are going to create a simple Hello World scene with a sprite, camera and even a blueprint controlling it all.


AppGameKit Studio

See More Tutorials on!

Month List