In Unity 2021 LTS, UI Toolkit offers a collection of features, resources, and tools to help you build and debug adaptive runtime UIs on a wide range of game applications and Editor extensions. Its intuitive workflow enables Unity creators in different roles – artists, programmers, and designers alike – to get started with UI development as quickly as possible.
See our earlier blog post for an explanation of UI Toolkit’s main benefits, such as enhanced scalability and performance, already being leveraged by studios like Mechanistry for their game, Timberborn.
While Unity UI remains the go-to solution for positioning and lighting UI in a 3D world, UI Toolkit for runtime UI is recommended as of Unity 2021 LTS. It’s particularly effective for Screen Space – Overlay UI, and scales well on a variety of screen resolutions.
That’s why we’re excited to announce two new learning resources to better support UI development with UI Toolkit:
Read on to learn about some key features part of the UI Toolkit sample project.
The UI Toolkit sample demonstrates how you can leverage UI Toolkit for your own applications. This demo involves a full-featured interface over a slice of the 2D project Dragon Crashers, a mini RPG, using the Unity 2021 LTS UI Toolkit workflow at runtime.
Some of the actions illustrated in the sample project show you how to:
To try out the project after adding it to your assets, enter Play mode. Please note that UI Toolkit interfaces do not appear in the Scene view. Instead, you can view them in the Game view or UI Builder.
The menu on the left helps you navigate the modal main menu screens. This vertical column of buttons provides access to the five modal screens that comprise the main menu (they stay active while switching between screens).
While some interactivity is possible, such as healing the characters by dragging available potions in the scene, gameplay has been kept to a minimum to ensure continued focus on the UI examples.
Let’s take a closer look at the UIs in the menu bar:
UI Toolkit enables you to build stable and consistent UIs for your entire project. At the same time, it provides flexible tools for adding your own design flourishes and details to further flesh out the game’s theme and style.
Let’s go over some of the features used to refine the UI designs in the sample:
We made sure that efficient workflows were used to fortify the UI. Here are a few recommendations for keeping the project well-organized:
Remember that with UI Toolkit, UI layouts and styles are decoupled from code. This means that rewriting the backend data can occur independently from the UI design. If your development team replaces those systems, the interface should continue to work.
Additional tools used in the demo include particle systems created with the Built-in Particle System for special effects, and the 2D toolset, among others. Feel free to review the project via the Inspector to see how these different elements come into play.
You can find reference art made by the UI artists under UI/Reference, as replicated in UI Builder. The whole process, from mockups to wireframes, is also documented in the e-book. Finally, all of the content in the sample can be added to your own Unity project.
You can download the UI Toolkit sample – Dragon Crashers from the Asset Store. Once you’ve explored its different UI designs, please provide your feedback on the forum.
Then be sure to check out our e-book, User interface design and implementation in Unity, available this fall. Preregister here to have the guide emailed to you once it’s live.