Best Practices for UI on Multiple Devices

Help & Support
1

Hello!

New to PlayCanvas here but I’ve been tasked to look at best practices of UI development for an app I’ll be working on. One thing I know is that I’ll be developing for multiple devices (Desktop / Mobile (also VR with cardboard possibly) / Tablets)

The user will be able to interact with UI buttons to answer questions and such, I won’t go into detail here as I’m mostly just looking for general best practices when it comes to developing for multiple devices.

I read through some older threads (2016-2017) regarding this and most said that just going with HTML / CSS is how they prefer to do it. Is this only applicable to UIs that will be primarily 2D?

If I wanted it to be a 3D UI any point, would my best option be to use play canvas screen/element components? It seems like it has nice support with anchor/pivots that may make fitting multiple devices easier (I’m quite familiar with anchors and positioning in Unity so it was quite easy to get going with the PlayCanvas editor)

Apologies if I missed another thread that may have what I’m looking for, please direct me if possible, thanks much.

2

Hi @adkaros and welcome,

Definitely both options are great and come with their set of benefits / drawbacks.

Playcanvas UI elements have evolved so much that I’d say it’s a very robust solution and most likely your first option when it comes to building a game UI. Also if you are planning to do 3D UI or VR interfaces then it’s the only way, since HTML/CSS can’t be rendered there.

Here is a helpful post with some thoughts on how the Playcanvas UI elements scale between different devices/displays:

3 Likes