Best practices for designing for mobile users?

Help and Feedback Art Design Support
#1

From scripting to building to graphics, what are the best practices for making games more efficient on mobile?

3 Likes
#2

In terms of graphics, be sure to use both Scale and Offset appropriately. Some people think it is okay to use just Scale thinking that makes the UI responsive across all screens when that isn’t always the case. Resize your Studio game window or use the emulator to get better views on how the GUIs will look on smaller screen sizes. Be sure to also use the UISizeConstraint as well. I have an incredibly high-resolution monitor (5K) and using a 0.5 on the X-axis may work on other screens but at higher resolutions, 0.5 is humongous.

TL;DR: Use the emulator to make sure your UI doesn’t look weird on other screen sizes.

1 Like
#3

Mobile is a great device to design for as about half the players on Roblox play from a mobile so it is important to optimise your game so they get the best experience. Mobiles are less powerful than most pc and xbox ect so you need to make sure when players play your game they don’t experience a lot of lag.

  • Fist of all you need to scale your UI correctly as stated in the post above. This will make your game look more professional and more tidy on mobile.

  • The biggest thing is fighting lag. Try to optimise your builds as best as you can so that they have the best performance. This could be as simple as making a building a mech instead of a union or it could be putting filtering enabled on. Here is a tutorial about optimising your builds: Building Optimisation | Tips and tricks!

  • With scripting you need to try and optimise your code as best you can so that players don’t lag as much. There is so many ways you could optimise your code so I wont say them all. First off, lets say you want to move an object you may think lets use a for i loop or a while loop. When really these cause a lot more lag than if you tweened the object. In short only use loops when you need to use them. When you use Instance.new try and be careful when you parent the object as that should be the last thing you do. This is a thread explaining this issue far better than I can: PSA: Don't use Instance.new() with parent argument. This tutorial may help you a little bit with optimisations when scripting as well: https://devforum.roblox.com/t/the-art-of-micro-optimizing/226753.

7 Likes
How Would I Go About Reducing Lag For Mobile Players?
#4

Know your screen real estate! Tailor your UI to best work with mobile users. Generally little-no text in UI buttons is preferred as long as your icons can convey your meaning properly.

Screen real estate is ONE OF THE MOST IMPORTANT things when looking at mobile. There isn’t much of it so you have to make every pixel count.

1 Like
#5

Scale everything appropriately, like Qxest stated. Try not putting UIs on the top of the screen for mobile, as there are issues with that. Try loading in less parts for mobile users too. It comes down to preference as well. Overall, try making everything mobile-compatible and try reducing the part count to reduce lag.

  • If you cannot scale mobile UIs properly, make your UIs away from different buttons
  • If you cannot scale mobile UIs properly, make your UIs smaller so it fits
  • Lag is a big issue, try reducing it as much as possible

The two posts above me are more helpful, be sure to read them too.

#6

Make sure to always consult the emulator for each type of mobile device. There are a lot of edge cases like the iPhone X cutting off a portion of screen with its notch and some tablets being more tall than wide.

#7

Thank you for the well written reply I understand much better now :slight_smile:

1 Like