Categories
Uncategorised

Developer Journal : Widgets and Transitions

Developer Journal

As of the 26th of April, I’ve made more progress on my game by adding elements to the User Interface known as Widgets as well as some Level Transitions.

For my game, I’ve considered adding multiple levels as well as a simple UI to help transition the players to the next level by giving them a button to press once the current level had been beaten.

As seen in Figure 1 of the video below, this shows the results of my implementation of these features working within the game.

Figure 1

The Widget used at the end of each level simply accomplishes the player once they’ve beaten the current level and are given an option to continue onto the next.

In the designer section of the widget, I kept the UI relatively minimal looking with a short message and a working button.

Figure 2

Not only does Unreal allow us to design just a UI with the widget system, but we can also assign something to happen if the UI is interacted with. Using the button, we can make it so that once clicked the Player’s input can trigger a certain function within the game.

“The Widget Blueprint uses Blueprint Visual Scripting to design the layout as well as script functionality for UI elements such as what happens when a button is clicked or if a value changes.”

unrealengine.com, 2021

When the button is clicked on our widget, we want to activate a function that easily transitions the player to the next level or restarts the level if they’ve failed.

Figure 3 shows the blueprint for when the button on the UI is clicked, it also uses a branch to determine a different result whether the player is dead or not.

The game simply uses Names to help give it the level name it wants to open. If the player has failed then it’ll get the current level’s name and reopen it, or if they’ve succeeded then they will fetch a Name variable from the exit which contains the next level’s name.

Figure 3

The exits within the game have their own editable instance which allows me to set their value to the name of a level they’d transition the player to once touched, Figure 4 shows the function of the exit giving their name value to the widget to use later on.

Figure 4

I feel as if I’ve gotten a good idea of how inserting widgets into Unreal works as this task remained to be successful, however the current UI I’ve made for the project seems to look very rough and may need some better looking visuals – this won’t be a top priority however as I need to get a playable build of the game out first.

Bibliography

Docs.unrealengine.com. 2021. Creating and Displaying UI. [online] Available at: https://docs.unrealengine.com/en-US/InteractiveExperiences/UMG/HowTo/CreatingWidgets/index.html [Accessed 4 May 2021].

Leave a Reply

Your email address will not be published. Required fields are marked *