> For the complete documentation index, see [llms.txt](https://themattempire.gitbook.io/documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://themattempire.gitbook.io/documentation/archive/roblox/user-interface-ui/surface-ui-in-world-ui.md).

# Surface UI (In World UI)

In-World UI, in this case known as Surface UI, is great for offering information in the world such as leaderboards, text, and button interactions. In-world UI is also a preferred approach to UI for VR experiences as it increases immersion in comparison to Screen based UI.

## Adding a Part with SurfaceGUI

<figure><img src="/files/9tZOkk5LcDazaqVebsuZ" alt=""><figcaption><p>Add a part and SurfaceGUI asset...</p></figcaption></figure>

* Create a Part in the world to put your UI onto.
  * The size of the part is the size of the UI.
  * You can set the Part‘s translucency to 1 to make it invisible.
* Go down to the ‘StarterGui’ folder and add a ‘SurfaceGui’ part
  * To add the ‘SurfaceGui’ element …
    * Press the '+' next to the ‘StarterGUI’ asset to add elements.
    * Type in ‘surface’ to help find it.
    * Rename it as you see fit. eg.’GameMenuUI’
* On the ‘SurfaceGui’ asset, make sure of the following :
  * Click on ‘Adornee’ and select your target UI part in world
    * eg. The ’GameMenuUI’ asset
  * Adjust the 'Face' parameter to make sure the UI appears on the desired side. The SurfaceGUI will be outlined in blue, if you add a UI element this might be easier to see.
  * Make sure that :&#x20;
    * ‘Active’ is On.
    * ‘Enabled’ is On.
    * ‘AlwaysOnTop’ is On. This is important when using interactive elements like Buttons.

## Text Scale

As *the maximum size of text is 100*, it is a good idea to scale your SurfaceGUI Sizing. This scale will affect *everything* within the SurfaceGUI settings. It's better to have it set correctly at the start otherwise you may need to adjust all of your layout settings later.

<figure><img src="/files/A204dMgDC1t8bma9VXOw" alt=""><figcaption><p>Adjust Sizing for larger text as needed...</p></figcaption></figure>

* Go down to Sizing / PixelsPerStud and *reduce* the number so text elements are *bigger*.

Note that if the text gets *too* big the quality may be reduced, so balance scale to text quality as needed.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://themattempire.gitbook.io/documentation/archive/roblox/user-interface-ui/surface-ui-in-world-ui.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.