I'm developing my first game for mobile devices in Unity3D. My game uses a 720p-resolution. Currently the UI uses the same one. So far so good.

I heard that professional game-developers create their games in a way where the UI uses a much higher resolution than the game itself in order to deliver high-definition graphics for the UI-system.

So in my case does that mean I have to create a much higher resolution for the UI so it looks crisp and sharp even on large mobile-displays (e.g. tablets like the iPad Pro, etc.)? Is 1080p a good resolution for the UI I'm creating? Or shall I stick with 720p? If I use e.g. 1080p for the UI do I need to scale down the UI in Unity3D?

  • 1
    \$\begingroup\$ "Does that mean I have to...?" No. It's your game, you get to choose what you do. If you think your UI looks good / looks the way you want it to at 720p, then you can keep it that way if you choose. Just note that displaying 720p on a 1080p screen can introduce artifacts, so have a plan for how you want to deal with that. \$\endgroup\$ – DMGregory Feb 21 '20 at 21:17
  • \$\begingroup\$ Thanks! I'm considering making a UI for 1080p and scale it down to 720p.:) \$\endgroup\$ – drpelz Feb 24 '20 at 14:16
  • 1
    \$\begingroup\$ I would not recommend that. UI looks best when displayed at 1:1 scale. If you intend to display it at 720p like the rest of your game, make it at 720p. Scaling down to 67%, from 1080 to 720, will tend to make your UI look needlessly blurry on devices where the rest of your 720p game looks crisp. \$\endgroup\$ – DMGregory Feb 24 '20 at 14:25
  • 1
    \$\begingroup\$ Yes, they either create different assets for different resolutions (possibly working from a higher-res or vector source file so they don't have to manually repaint everything), or hold some UI elements at a fixed size even as the resolution changes — changing the spacing around/between UI elements instead of growing/shrinking the display elements themselves. \$\endgroup\$ – DMGregory Feb 25 '20 at 13:26
  • 1
    \$\begingroup\$ That's a different question. If your research into the available options leaves you with questions unanswered, consider posting a new Question here, including screenshots of your UI, how you've configured it, and a clear explanation or diagram of how you want it to adjust its layout for different resolutions. \$\endgroup\$ – DMGregory Feb 25 '20 at 13:37

tl;dr - Unity user interfaces use a Canvas Scaler to help deal with these issues. You can use high resolution assets and Unity will scale them appropriately, including drawing higher resolution things on those screens.

Interestingly, "pixel perfect" is actually more work.

A lot of the complexity comes from deciding what resolutions and kind of scaling you want to support. For example, if you are just targeting televisions, you might have a 1920x1080 (aka 1080p) target. If the title runs on a 4k TV, the resolution might increase but the layout won't. For this you might use the Canvas Scaler in Scale With Screen Size mode.

Compare that to a typical iOS app, where the user expects the DPI to stay the same (i.e. 144ppi or whatever) but the screen space changes. In that model you might want to use Constant Physical Size.

You can import high resolution sprites and let Unity scale them. That's on the UI/sprite import settings.

  • \$\begingroup\$ Thank you for your answer! I think I will have to play around with the settings until I get the desired result!:D \$\endgroup\$ – drpelz Feb 25 '20 at 15:39
  • 1
    \$\begingroup\$ Yeah, it's a stupidly complicated topic once you start getting into it. There are a lot of subtle interactions between layout components - for example, the bias of the scaler for horizontal/vertical can dramatically affect how a child scroll box works. That one was a pain to figure out. There is a new Unity Mobile Device simulator (2019.3+), and of course an entirely new Unity UI system coming as well. \$\endgroup\$ – Will Iverson Feb 25 '20 at 18:19
  • \$\begingroup\$ That would be awesome if a Mobile Device simulator gets published (can't wait for it)! Thanks for the hint!:D \$\endgroup\$ – drpelz Feb 26 '20 at 17:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.