Unity3D: Ease of building UI elements

Unity has made it easy to build UI elements for games and applications.

Dead Space has one of the best immersive UI in a video game.

//How easy is it to build a UI?

You can create a new UI element by clicking the add button in the hierarchy panel and highlighting the UI section. You will see many UI elements you can choose from the list. Once you have made your selection, a Canvas and an Event System game object are created.

Once you have selected a UI element, we can position it within the screen view and anchor it. Anchoring will allow us to specify a position we would like the element to scale properly with the game’s dimension. It is very intuitive and user-friendly.

Moving and position UI elements in the Scene view. We can then have them anchored so that they can scale with the dimension of the game.

Anchors- part of the Rect Transform.

To keep our UI elements properly scaled, we need to make sure we have our Canvas Scaler “UI Scale Mode” to “Scale With Screen Size.”

UI Scale Mode can be seen in the inspector by selecting the “Canvas” game object in the Hierarchy panel.

To reiterate, this will keep our UI elements proportionate to the screen size of the game.

Here is an example of the UI Scale Mode- Constant Pixel Size:

Canvas Scaler — Constant Pixel Size

Here is an example of the UI Scale mode- Scale With Screen Size:

Canvas Scaler — Scale With Screen Size

Which one would you prefer? Yep, of course.

As you can see, Scale With Screen Size will ensure all UI elements to be proportioned to whatever the screen size. Thanks to the help of the anchors, the elements stay where they have been positioned through scaling.

//Conclusion

With Unity’s UI Toolkit in our arsenal, we can create beautiful and immersive UI for our game. And remember:

Always use Scale With Screen Size when creating canvases!

Always!

That is all for today! Thank you for reading. :)