Device specific UI

Hello developer fourms!

I want to make a device specific UI, as we most likely already know, some games just dont bother to make sure there games work with mobile. This can be because of the buttons being too small or buttons clipping off-screen or into the roblox buttons clickboxes. And other games struggle with controller support, like forcing them to use the little circle mouse thing with their controller or the selecting thing which is horrible in my opinion. The obvious solution is to make device specific user interfaces

The idea: Create a different user interface for mobile, PC, and controller.

This idea would fix most problems. But the question is how would they look?

Im asking for ideas. For people that play mobile alot, where would most of you like to have the buttons? (Example: Left side of the screen with a bigger play button with a smaller inventory and extras button)

And for controller players, where do you prefer these buttons and with what buttons? All menus will be navigated with controller specific buttons like most video games, instead of using roblox’s selection thing. (Example: The play button should be placed on the bottom left of the screen with the X should be used to trigger it)

im trying to make all users on no matter what platform an amazing experience with my game. So I am open with to all concepts! Let me know if you have any suggestions or ideas!

Buttons that I meed to have:

Menu: Play, Inventory, Extras, Settings (picture of a gear)

Inventory: Shop, Items

Items: a column of 4 category’s, Main, Sidearm, Melee, and Skins

All other menus will have a design that works on all platforms and dosnt need a device specific design.

3 Likes

Yeah that would be great idea!

1 Like

You should only create UI for different devices when it is absolutely necessary (such as adding a mobile reload button for a gun that otherwise relies on the user pressing R). I would strongly advise against recreating any UI that needs to exist on both PC and mobile (such as shop menus, inventory systems, etc.), as it can become increasingly more difficult to maintain these systems in the future. Instead, you should focus on scaling your UI so that it is appropriately sized automatically for all devices using UI constraints and a combination of scale and offset.

2 Likes

Some feedback on this; When I make my UI, I try to design for as many platforms as possible with the least amount of differing UI. A good example of this is how websites scale certain UI elements to fit within the window/screen size. This helps scaling down on the amount of coding you might have todo.

For controller/console UI, I would recommend looking at console (XBox and Playstation) UI designs and getting a rough idea on what you might want to incorporate into your designs!

I’d also highly recommend looking into UI Frameworks such as React-Lua and Fusion.

Goodluck and happy designing! :hidere:

(You should probably change your post to #help-and-feedback art design support)
1 Like