Use this tool to select, move and resize objects (shapes, lines and text boxes).
Select multiple objects by holding Shift while selecting. Copy an object by dragging while holding Alt/Opt.
Click and drag to draw a rectangle. Hold Shift to create a square.
Click and drag to draw an ellipse. Hold the Shift key to create a perfectly round circle.
Click and drag to draw a triangle. Hold the Shift key to create a equilateral triangle. Use the Up and Down keys while dragging to change the number of sides, creating other shapes like diamonds, pentagons, and hexagons.
Draws straight lines. Hold Shift to draw perfectly straight lines at 90 and 45 degree angles.
Creates a text box.
Alignment Panel
Use these tools to align multiple objects. You can select multiple objects by holding shift while using the select tool.
You can find this panel in the top right corner of the window.
Align Up/Down/Left/Right
Aligns all selected objects to the desired side. See align bottom example below
Align Center
Aligns the centers of the selected objects on the chosen axis. See example bellow.
Distribute
Evenly spaces objects along the chosen axis. See example below
From the Content Draw, search for “BP_ThirdPersonGameMode” and double click to enter the Blueprint.
Right-click a blank area of the Event Graph and add a Custom event. Name this Event “Respawn Player”
Drag and release from the whie arrow of the new node> Type and select “Spawn Actor From Class”.
Select the Respawn Player node. In the Details menu create a new input and name this “Player”. Change the variable type from Boolean to a Character Object Reference.
Drag and release from the “Player” output of the Respawn Player event. Type and search “Get Class” and connect this to the Class input of the Spawn Actor Node. Right-click on “Spawn Transform” and Promote to variable and rename this “Respawn Transform”.
Now we need to return control to the player. In a blank area of the event graph, right click to type and select “Get Player Controller”.
Drag from the Return value of this new node to type and select “Possess”. Connect this to the white input to the white output of the Spawn Actor node and the In Pawn input to the Return Value output of the Spawn Actor node.
Your event graph should look like this. Compile and go to the BP_Third PersonCharacter” blueprint.
We now need to call the respawn function when the character dies. In the functions tab on the left, select Override > Destroyed.
From the new node, drag and release to select “Cast to BP_ThirdPersonGameMode”. From the Object input drag and release to select “Get Game Mode”
From the As BP Third Person Game Mode output drag and release to select “Respawn Player”. drag and release from the player input of the new node to select “Get a reference to self”.
Your Event graph should look like this. Compile and test by jumping off the platform. Your character should respawn again in the air and fall to their doom over and over. We now need to set our respawn point.
In a blank area of the Event Graph right click and select “Event Begin Play”. Cast to “BP_ThirdPersonGameMode” and drag and release the object input to select “Get Game Mode”
From “As BP Third Person Game Mode” of the new node drag and release to select “Set Respawn Transform”.
Connect Cast to BP_ThirdpersonGameMode to the new set node as shown. Drag and release From the Respawn Transform input to select “Get Actor Transform” this sets the respawn point as the players position when the game starts.
Your Event Graph should look like this. Compile and test by jumping of the edge of the platform.
Press Command + Spacebar, type “OneDrive” and select the top result or press Enter.
Follow the on screen prompts using your school email login details.
Be sure to allow access to “Documents” and “Desktop” when asked.
If you denied access to documents
If you accidentally denied OneDrive access to your Desktop and Documents folders, you can restore this by clicking the OneDrive icon in the top-right corner of the screen.
Click the Settings icon in the top-right corner of the window and click Preferences.
In the Account Tab, click “Choose Folders“
In the Choose Folders menu, ensure that “Desktop” and “Documents” are checked and press OK.
Install Adobe XD on your personal MacBook:
Press Command + Spacebar on your MacBook, type “Self Service”, and press Enter.
In the Self Service application, search for “Creative Cloud” and proceed with the download.
Once Creative Cloud is installed, open it by pressing Command + Spacebar, typing “Creative Cloud”, and pressing Enter.
Scroll down to find Adobe XD under the heading “More apps from Adobe” to install.
To activate AdobeXD use your school login information.
Now that we have created our collectables and door, we are going to combine these two elements to create a unlockable door that can be opened when the player has gathered all collectables.
While we could manually set the amount of collectables needed to open the door, we are going to have Unreal Engine count the amount off collectables in the level at game launch instead.
In the Content Drawer search for “BP_ThirdPersonGameMode”. Double-click to enter and open the Event Graph.
As you can see, we are already using Event BeginPlay. So that we can execute multiple functions we need to add a sequence.
Drag and release from Event BeginPlay. Type and select “Sequence”.
As we want to count the amount of collectables in the scene before loading the HUD, connect the previous node chain to “Then 1”. We can now start our new node chain.
Drag and release from “Then 0”. Type and select “Get All Actors Of Class”. Set the actor class of this node to BP_[Item]Collectable (or whatever you named your collectable blueprint).
From the new node, drag and release from “Out Actions”. Type and select “Length”. This allows us to make the number of keys in the scene into a number we can reference later.
From the new Length node, drag and release. Select “Promote to Variable”. Name this variable “[Items]Total” in the Details Panel on the right. Connect the Get All Actors Of Class node to the [Items]Total node as shown.
We can test if we are successfully counting the amount of collectables by dragging and releasing from the top-right arrow of the Set node.
Type and select “Print String” and connect the mint green and magenta open connections. The Event Graph should look like this.
Compile and test. If successful the number of collectables in the scene will appear in light blue will appear in the top left corner immediately after you pressing play.
Now we need to visualize the total number of keys in the scene. From the Content Drawer, search for “WBP_HUD” and double click to enter it.
In the Widget Designer select the existing textbox and press CMD + C to copy it. Paste it back twice using CMD +V.
Change the middle text box to a slash in the the Details Panel on the right under Content > Text.
Select the rightmost checkbox and rename it to [Collectables]Total. Click the chain link next to Content > Text and click Create Binding.
This will create a second event graph for that text box named “Get_[Item]Total_Text” which we will return to later. For now let’s head to the main Widget Event Graph.
We now need to add a sequence node to the Event Graph, as we did before. Drag and release from Event Construct. Type and select “Sequence”.
As we want to load the number of collectables in the scene before loading the HUD, connect the previous node chain to “Then 1”. Drag and release from “Then 0”. Type and select “Cast to BP_ThirPersonGameMode”.
Drag and release from the object parameter of the new node. Type and select “Get Game Mode”.
Right-click the As BP Third Person Game Mode parameter of the Cast to BP_ThirPersonGameMode node and promote to variable. Name this variable “GameModeReference” and connect as shown above.
Hit compile. Your Event Graph should look like this.
Let’s return to the bound “Get_[Item]Total_Text” Event Graph. From the Variables menu on the left, drag GameModeReference into the Event Graph. Drag and release from the new node to type and select “Get [Items] Total”.
Connect the new node to the Return Value of the Return node. Compile and test, your HUD should now display the total amount of Collectables in the scene at the start of play.
Now to create our unlockable door.
We are going to use the regular door blueprint we created in the last tutorial as a base for our unlockable door. In the Content Drawer, right click the “BP_Door” and select Duplicate. Rename the duplicated door to “BP_LockedDoor” and Double-click to enter the Event Graph.
Right-click the pressed output of the “E” Input node and select “Break This Link”. Drag the separated chain to the side, we will need it later.
We need to get information about the items Collected and items Total from different blueprints. Drag from the “Pressed” output and release. Cast to “BP_ThirdPersonGameMode” and then “ThirdPersonCharacter”. In the Objects input of each node, Get “Game Mode” and “Player Pawn” respectively. The Event Graph should look like the image above.
From the bottom-right blue arrow of each new node, drag and release. Type and select “Get [Items] Total” and “Get [Items] Collected” for each respective node.
Drag and release from either new node. Type and select “Equal (==)” and connect the other node. This will activate the chain when the total items and item collected are the same.
Create a branch node by holding “b” and left-clicking a blank area of the Event Graph. Connect to the Equals and Cast to BP_ThirdPersonGameMode nodes as shown above. We can now reconnect our door opening chain to the “True” output of the new node.
Your Event Graph should look like this. Compile and test. Your locked door should only open when all keys are collected.
The first step to creating a lockable door is to create a regular unlocked door. In this lesson, we will make a door that we can open and close with a key press.
First, we need to prepare our door. Search the Content Drawer for “SM_Door” (we can change the door’s static mesh later) and double click to open the the Static Mesh editor.
Click Collision > Add Box Simplified Collision. This creates a simple cube around the door preventing the player character from walking through.
Return to the Content Drawer, create a new blueprint called “BP_Door” and set it to Actor. In the components menu on the left add a Static Mesh and Box Collision. Set the static mesh to SM_Door and scale the box collision to surround the space in front and behind it. Open up the Graph Editor.
In the Components panel on the left, right click your Box Collision and add two events – OnComponentBeginOverLap and OnComponentEndOverlap.
For both of these new event nodes drag and release from the top-right white arrow, type and select “Cast to BP_ThirdPersonCharacter”
Now we need to enable player control of the door when they are inside the collision box.
On the OnComponentBeginOverlap node Drag and release from the top right white arrow of the Cast to BP_ThirdPersonCharacter node. Type and select “Enable Input”.
Do the same for OnComponentEndOverlap, except this time, type and select “Disable Input”.
From the Player Controller arrow of the Enable Input node, drag and release. Type and select “Get Player Controller”.
Click compile. Your Event Graph should look like this.
Now that we have enabled player controller input, we now need to tell the door what to do when it receives a command.
Right-click a new blank area of the BP_Door Event Graph, Type and select “Keyboard Events E”.
Drag and release from the “Pressed” arrow of the new node. Type and select “Flip Flop”.
A Flip Flop node allows us to switch between two different states. Drag and release from the “A” arrow. Type and select “Add Timeline”. Connect the “B” arrow of the Flip Flop node to “reverse” in the timeline node. This makes B do the opposite of what A does.
We now need to set the timing for our door to swing open. Double-click the Timeline Node to enter it. Click “+ Track” and add a new Float Track.
Right click the new track and select “Add key to Curve Float” twice.
Select each key to change their Time and Value. Set the first key to a Time and Value to “0”. Set the second key’s Time and Value to “1”. Return to the Event Graph.
From the Timeline node, drag and release. Type and select “Lerp (Rotator)”.
The Lerp Rotator node allows us to set the two rotation states our timeline will switch between. For now, let’s set the “B” state Z value to 110. We can fine-tune how much our door opens later.
Now we need to tell the door what to rotate. Drag and release the return value, type and select “Set Relative Rotation (StaticMesh)”.
Finally, connect the Update arrow of the Timeline node to the top left arrow of the Set Relative Rotation node.
Your completed Event Graph should look like this.
Compile and test your door by walking up to it and pressing “E”.
Now that we are able to track our number of collectables picked up we need to visually notify the player how many they have collected in a Heads Up Display (HUD).
In the Content Drawer, Go to Add > User Interface > Widget Blueprint. Name it “WBP_HUD” and double click to enter the Widget Blueprint.
In the Widget Designer, type “Horizontal Box” in the palette panel on the left and drag into the design window.
Press the “x” to the left of the search field. Drag an image and text block from the Palette menu into the newly created Horizontal Box
Select your Image Block. On the right side in the Details panel use the appearance menu to set the Image Block’s display image under “Brush”. You will need to upload your image to your project first (Content Drawer > Add > Import to /Game). You can also set the image’s size here by changing it’s X and Y.
Once you are happy with your image, set the padding and alignment of your collectable items in the Slot menu above to space your image away from the edge of the screen and textbox.
Feel free to use my presets displayed above.
Now, select your Text Block. In the Details panel rename the Text Block to “[Item]Text” and tick “Is Variable”. In the content menu, change your default text to “0”.
Scroll down to the Appearance menu to change the size and font of your text to your preference. When you are happy with your section, set the Text Block’s padding and alignment as you did with your image.
We now need to create an Event Dispatcher to communicate with the Widget. In the Content Drawer search “BP_ThirdPersonCharacter”. Double click it to open the Graph Editor.
In the components Panel on the left, add an Event Dispatcher. Name it “[Item]Amount”.
With our new dispatcher selected, go to the right Details panel and add a new parameter. Change the name to “NumberOf[Items]” and change it into an interger.
Select and delete the Print String nodes we created last lesson.
From the event Dispatchers panel on the left, drag the [Item]Amount dispatcher into the graph editor and select “Call”
Connect Call Key Amount to the Incremental Int node as shown (note the dull lines). Click compile.
Let’s return to our Widget Blueprint and head to the Graph tab.
Right Click a Blank area of the Graph Editor. Type and select “Get Player Character”.
Drag the Return Value to a blank area of the Graph Editor. Type and select “Cast to BP_ThirdPersonCharacter”.
Connect Cast to BP_ThirdPersonCharacter to the Event Construct.
From Cast to BP_ThirdPersonCharacter drag and release As BP Third Person Character. Type and select “Bind Event to [Item] Amount”
From Bind Event to [Item] Amount drag and release Event. Type and Select “Add Custom Event”. Name this event “Update[Item]Counter”.
From the Variables Panel on the left drag out “[Item]Text” and select “Get Keys Text”
Drag and release from the [Item] Text node. Type and select “SetText (Text)”.
Connect the SetText node to the Undate[Item]Counter as shown (note the dull grey line).
When completed, the WBP_HUD event graph should look like this. Click Compile.
Finally, we need to connect our HUD to the viewport. In the Content Drawer, search for “BP_ThirdPersonGameMode” and double click to open. Click “Open full Blueprint Editor”.
Right click a blank area of the Graph Editor. Type and select “Event BeginPlay”. Drag and release from this node, type and select “Create Widget”.
Change the nodes class to “WBP_HUD”. Drag and release the return value and select “Promote to Variable”. From the bottom right blue arrow of the new node, drag and release. Type and select “add to Viewport”
The Event Graph should look like this when you are done. Compile and test, you should now be able to see an active counter in your top left corner that increases by one every time you pick up a collectable.
Last lesson we created our first collectable â we could walk up to it and pick it up, but other than disappearing it didnât do anything. In this lesson, we will begin counting the collectables we pick-up.
When creating our collectable we created a blueprint. This time we are going to alter an existing blueprint â our player character blueprint. In the Content Drawer search and select âBP_ThirdPersonCharacterâ
In the player character blueprint we can see all the different instructions attached to our character. Be careful not to remove anything here â you character might become unable to move, jump or adjust the camera.
On the left side, add a variable and name it â[items]collectedâ. I called mine KeysCollected. Change this variable from a Boolean to an Integer. This means the variable will track whole numbers.
Right-click a blank space in the Event Graph. Type and select âAdd Custom Eventâ. Name this event â[Item]PickUpâ. Remember this name as you will need to use it later.
From the Variables menu on the left drag your Interger into the event graph and select âGet [Items]Collectedâ. Drag from the right arrow of the “[Items] Collected” variable and release. Type and select âIncremental Intâ. This will increase our collectable count by one when activated.
From the node we just created, drag the top arrow into a blank space in the event editor. Type and select âPrint Stringâ.
Connect the mint green arrow from the Incremental Int node to the magenta arrow of the Print String node.
Connect the top left arrow of the Incremental Int node to the white arrow of the “[Item]PickUp event”. When completed, our Event Graph should look like this.
Press compile in the top left corner. We are now done with this blueprint. Letâs return to our collectable object blueprint.
In our collectable object blueprint, drag out from âAs BP Third Person Characterâ and release. Type and select â[Item] Pick Upâ, this is the function you named earlier.
Connect the left white arrow of the newly created node to the right white arrow of the Destroy Actor node. Click compile and test. When you pick up your collectable you should see a â1â in the top left corner. If you place multiple collectables in the scene this number will increase further.
Ensure your collectable item is combined into one object, by selecting the objects (Q) and using Mesh > Booleans > Union or Mesh > Combine.
I also recommend moving your object to the center of the grid plane, this will make moving the object easier.
Export your collectable from Maya by selecting your object (Q) and clicking File > Export Selection.
While exporting be sure to change File of Type to FBX export.
If you are using a textured model be sure to tick âinclude texture infoâ.
Name your FBX file something easy identifiable and save it to your Maya assets folder.
To import your collectable into Unreal Engine open the Content Draw in the lower left corner, press Add > Import to/GameâŚ
After selecting your object in files a popup menu will come up, while these settings are often important, today we will use the defaults, press import.
To create a blueprint your open Content Draw, select Add > Blueprint and choose Actor from the pop-up menu.
Name it something that makes sense and identifies it as a blueprint; as my collectable is a key, I am naming it BP_KeyCollectible.
Double-click your newly created Blueprint to open it.
We are now going to add our Maya object into the Blueprint. You may need to change the view to âViewportâ
Using the Components menu in the top left click Add. Type âStatic Meshâ in the search window and select it when it appears in the menu.
On the right side select your object as the static mesh. At this point you may want to scale or reposition your object in the right menu.
While we are here, letâs turn off collisions so that our characterâs wonât bump into the collectable as they pick them up.
Letâs make our collectable easier to see by making it rotate on the spot.
Back in the Components menu on the left, click Add and type âRotating Movementâ, select this when it appears below. For now, we will use the default rotation rate.
You can return to the main window and click play to test the rotation effect. Be sure to drag the blueprint from the Content Drawer, not the static mesh.
Next, letâs add collision so that our character can pick up the collectable. In the Components menu click Add, type âSphere Collisionâ and select this option when it appears. Move and scale this sphere so it surrounds the Maya object.
Now we need to tell our Collision Sphere how to operate. Select âSphereâ in the Components menu and click the Event Graph tab above the viewport. This screen allows us to program how our collectable operates.
To add a new event, we need to right click a blank area of the Event Graph. Through the menu select Add Event for Sphere > Collision > Add on Component Begin Overlap.
Drag from the arrow next to âOther Actorâ and release into a blank space to create a new action. After releasing type and select âCast To BP_ThirdPersonCharacterâ from the list. This sets the conditions for activating the collectable.
Finally, letâs make the collectable disappear when we collect it. From the top right arrow of Cast To BP_ThirdPersonCharacter drag and release to a blank space in the Event Graph. Type âDestroy Actorâ and select this from the menu.
When completed, our Event Graph should look like this.
Return to the main window and click play to test. Donât forget to drag the blueprint (not the object) out of the Content draw and into the scene first.
