Unreal Engine: Creating Widgets for UI

Name: Unreal Engine: Creating Widgets for UI
Rating: 4.1 (223 reviews)

Learn how to create UI menu systems for games like Fortnite, Horizon Forbidden West, Final Fantasy, and Call of Duty!

Created byJosh Triplett, Robot Brain

Last updated 8/2023

English

What you'll learn

What are Widgets and why are they important?
How to create, display, and remove a widget from the viewport
How to create, customize, and utilize the most frequently used UI elements
How to add events and program your widgets using the Graph Editor
Tips & Tricks for using Unreal Widgets
How to create a simple Survival Game with pickups and damage
How to make a Game Instance to transfer variables between levels
How to create a Save Game to save and load your settings

Course content

7 sections • 37 lectures • 3h 31m total length

Project Primer1:42
A quick primer for the course. Please make sure to download the project files attached to this lesson in order to follow along.
Making The Most Out Of This Course1:12
How to make the most out of this course.

Widget Designer Mode: Designer Mode Window4:21
Learn about the different windows in the Widget Designer Mode section of a Widget Blueprint. This includes the viewport, the top menu, the palette panel, the hierarchy panel, the animations panel, and the details panel.
Widget Designer Mode: Widget Types - Common11:07
Learn about the common widget types available in the Widget Blueprint Designer Mode. This includes borders, buttons, check boxes, images, progress bars, radial sliders, rich text blocks, sliders, and text blocks.
Widget Designer Mode: Widget Types - Input3:52
Learn about the input widget types available in the Widget Blueprint Designer Mode. This includes combo boxes, editable texts, spin boxes, and text boxes.
Widget Designer Mode: Widget Types - Misc0:43
Learn about the miscellaneous widget type available in the Widget Blueprint Designer Mode. This includes the expandable area widget.
Widget Designer Mode: Widget Types - Primitive1:55
Learn about the primitive widget types available in the Widget Blueprint Designer Mode. This includes circular throbbers, spacers, and throbbers.
Widget Designer Mode: Widget Types - Special Effects0:27
Learn about the special effects widget type available in the Widget Blueprint Designer Mode. This includes the background blur widget.
Widget Designer Mode: Widget Types - Panel8:37
Learn about the panel widget types available in the Widget Blueprint Designer Mode. This includes the canvas panel, grid panel, horizontal box, scale box, scroll box, and vertical box.
Widget Designer Mode: Widget Types - Additional Functionality2:57
Learn about some of the additional functionality available within the various widget types, including tooltip text, visibility, and render transform.
Widget Designer Mode: Widget Types - User Created4:27
Learn the importance of user created widgets and how to create and utilize them.
Widget Designer Mode: Animations3:34
Learn how to create widget animations, set up keyframes, and animate the various parameters of a widget.
Widget Designer Mode: Conclusion0:27
The conclusion of the Widget Designer Mode section.

Widget Graph Editor Mode: Graph Editor Window2:40
Learn about the various windows in the Widget Graph Editor Mode section of a Widget Blueprint. This includes the event graph, the blueprint panel, the details panel, and the compiler results panel.
Widget Graph Editor Mode: Blueprint Panel8:22
Learn about the various elements of the Blueprint Panel, such as how to create and utilize functions, macros, and variables, how to bind variables, and how to create events.
Widget Graph Editor Mode: Debugging5:59
Learn how to debug your widget blueprints, utilizing the Widget Reflector, Compiler Results Panel, Print String, and references.

Tips & Tricks8:47
Learn some tips and tricks that will help you out on your journey to learning Unreal Widgets. Learn how to use the Wrap With and Replace With tools, how to collapse and expand all in the hierarchy, which panel type to use, how to put multiple children into single child widgets, and how to change the anchor and position of a widget at the same time. Also learn why it is important to rename your widgets, utilize user created widgets, and have a plan.

Creating A Survival Game: Introduction and Set Up3:01
In this video, I will introduce the Survival Game that we will be creating. We will spend some time going over what we will be doing, and setting up the project.
Creating A Survival Game: Setting Up The Pawn4:16
In this video, we will set up the Pawn for our Survival Game.
Creating A Survival Game: Setting Up The Start Level5:51
In this video, we will set up the entry level, which will open when the game starts.
Creating A Survival Game: Start Level Menu9:11
In this video, we will be working on the start level widget.
Creating A Survival Game: Settings Menu Part I10:38
In this video, we will start setting up the settings menu in the entry level.
Creating A Survival Game: Save Game and Game Instance4:53
In this video, we will be discussing and setting up the save game and game instance.
Creating A Survival Game: Settings Menu Part II24:57
In this video, we will finish up the settings menu.
Creating A Survival Game: Animating the Menus11:12
In this video, we will be animating the start menu to the settings menu.
Creating A Survival Game: Setting Up the HUD15:06
In this video, we will be setting up the HUD for our Survival Game.
Creating A Survival Game: Creating the Score HUD4:49
In this video, we will be creating the score menu, which will display while the player is playing the game.
Creating A Survival Game: Setting Up the End Game Widget16:21
In this video, we will be setting up the end game widget, which will display when the game is over.
Creating A Survival Game: Applying Settings to the Main Level8:15
In this video, we will be applying all of the settings that a player has selected to the main level.
Creating A Survival Game: Setting Up the Pick Ups8:24
In this video, we will be setting up our various pickups for the game.
Creating A Survival Game: Creating Electricity4:51
In this video, we will be setting up our electricity blueprint, which will injure our player.
Creating A Survival Game: Unreal 5 Streaming Issue0:57
In this video, we will be discussing a potential problem that you may be running into if using Unreal 5.
Creating A Survival Game: One More Thing...0:48
In this video, we will be wrapping up our Survival Game.

Conclusion0:48
Conclusion of the course. Attached is the final project file which you can feel free to download to check your work.
BONUS LESSON: Advanced Widgets for UI Project Primer1:47
Enjoy this course? Take a look inside of the next course in the series - Unreal Engine: Advanced Widgets for UI. Available now on Udemy!
https://www.udemy.com/course/unreal-engine-advanced-widgets-for-ui/?referralCode=2E73E18279C7EDD0B987

Requirements

Recommended: Basic computer knowledge
Recommended: An understanding of basic navigation for the Unreal Engine
Recommended: Unreal Engine 5.1 or higher installed
Recommended: Desktop PC with Windows 7 (or later) 64-bit - OR - a Mac with Mac OS X 10.9.2 or later
Recommended: DirectX 11 compatible video card
Recommended: Quad-core Intel or AMD processor
Recommended: 8 GB RAM
NO programming experience needed!

Description

In this course, you will learn how to use the Unreal Widget Blueprint system to create UI (User Interface) for your games and applications. These are the same user interfaces that you see in popular games such as Fortnite, Madden NFL, Grand Theft Auto, and Final Fantasy! These menus also mimic the menus that I use to create visualization applications at a Fortune 500 company, and are proven techniques! It is vitally important for any Unreal developer to understand the concepts of widget blueprints. By the end of this course, you will have the knowledge and expertise to be able to create menus, on screen HUD's, and many other kinds of menus that you can use in your own games and applications! You will also have developed a fully functional Survival Game!

This course is a great starting point for users who are unfamiliar with the Unreal Widget Blueprint system. It is targeted at Unreal Engine users who have a basic understanding of Unreal 5. We will not be going over how to download and install the Engine or general navigation of the Editor. However, you will master how to design, program and debug widgets within the Widget Blueprint Editor! NO PROGRAMMING KNOWLEDGE REQUIRED!

Who this course is for:

Students who want to learn how to create UI for games and applications
Students interested in learning how the various widgets work in Unreal Engine
Students interested in creating a simple Survival Game

Unreal Engine: Creating Widgets for UI

What you'll learn

Explore related topics

Course content

Introduction2 lectures • 3min

Creating Widgets2 lectures • 4min

Widget Designer Mode11 lectures • 42min

Widget Graph Editor Mode3 lectures • 17min

Tips & Tricks1 lecture • 9min

Creating A Survival Game16 lectures • 2hr 14min

Conclusion2 lectures • 3min

Requirements

Description

Who this course is for: