Finger positions for Device Emulator

User Interface Feature

While watching the Roblox Developer Conference 2018’s live stream I was listening carefully, regarding User Interface, especially for Mobile devices, I noticed the slide showing off finger positions was actually very informative to myself and I wouldn’t have thought about this at all if it wasn’t for this slide. Currently in Roblox you’re able to view a range of different popular devices that are compatible with Roblox and I’d like to see the ability to view the average finger position (area) of each device so I’m easily able to configure my User Interface to fit within these areas and allow for the best user experience.

The slide I’m referring to:
image
image

If this feature was added and was able to be toggled on/off to allow me to view it would not only benefit myself but I believe a significant portion of the current users creating UI, it allows us to understand where the majority of our UI should be and where to avoid when designing and creating our UI within Roblox Studio.

This feature should be able to be toggled when viewing the Device Emulator and should allow players. By default, the feature would be untoggled to allow you to view the UI like normal. Additionally to this you should be able to select either left, right or both fingers to be shown.

11 Likes

This feature is a bit difficult because hand sizes vary by person, especially by age. A piece of UI may be in the green zone for one person, while being in the red zone for another. I would strongly recommend just play testing instead of solely relying on representation of thumb zones.

1 Like

Screen size varies slightly by device, but the device emulator is still good for getting a general idea of how UI will appear on the user’s screen. Same with thumb zones. Even though thumb sizes differ, it’s helpful to have a general idea.

3 Likes

This seems doable by anyone with PDN or Gimp and a sketchbook app on their device. A cool idea nonetheless, but still equivalent to toggling on and off a full screen ImageLabel you can create by yourself in a few minutes. Maybe thumb maps like this would be better off as a wiki resource / plugin.

Thanks for the suggestion, but unless I misunderstand the requirements we already have it.

Are you looking for mobile controls to show up in emulator or it’s something else?

At RDC there was a segment about optimal control and GUI element placement on mobile devices that showed some pretty “thumb zone” graphics as seen in the OP.

The OP suggests a feature like this included in Studio that shows the “thumb zone” on emulated mobile device screens - the areas of the screen that are most comfortable to reach with your thumbs while playing.

1 Like

Suggested feature is option to toggle between that (default) and this:

Would make it easier to decide where to place UI while designing interface.

5 Likes

Got it, thanks for clarification.

4 Likes

Any information about this feature being added?

3 Likes