In this tutorial we will make one single UI_scene

UI_scenes in UT3 are User Interface Scenes. So basicly what we are building with a UI_scene is nothing else then a menu screen. Our purpose in building those screens is communicating our storyline to the player.

The text in this tutorial is also used in the tutorial "Basic Conversations in UT3"

First thing you need to do is use a basic level to test your UI_scene in.

Create a new subtractive level

Right-click the Cube icon in the toolbar

Create a new cube with the following dimensions:

X     1024

Y     1024

Z     512

Subtract the cube by clicking the subtract button in the toolbar

Apply some texturing on it (In image 1 is to be seen what my cube looks like after texturing, use your own textures from the standard UT3 packages)
(Image 1)

Insert a player start in it, and a lightpoint

Insert a static actor by selecting “PhysAnimTestActor” in your generic browser under the tab “Actor Classes”, followed by right clicking on your surface and select “AddPhysAnimTestActer here” Result is to be seen in Image 2
(Image 2)

Now it's time for our UI_scene.

Create a new UIscene by opening your generic browser, select the tab “Generic” select “new” and apply the data in the tab as seen in Image 3.
(Image 3)

A new folder named Test will be made in your generic browser containing the UIscene.
To make it visible select UI scenes in the upper left corner of your generic browser, as seen in Image 4
(Image 4)

Open your UI scene by double clicking on it.

On the right side of the editor, we will turn off “bDisplay Cursor” because we are going to work with simple numeric selection keys to start with (making clickable buttons is more advanced, clicking buttons will do for now.)
also make sure that the checkbox “bPauseGameWhileActive” is selected, to avoid being shot in the back by another mobster. (image 5)
(Image 5)

First thing I allways do is create one Image label, and use that one as background. The content of the label doesn't really matter. You can choose to leave it blank (as I did here)
Create one Image label on your screen, and size it to 420x500.
What we will do with this label is group all the other labels together.

Important:
In the bottom right corner of your  Unreal_UIscene_Editor window is an area called Scene_Tools. This area contains two tab's: Scene and Styles. With Scenes selected you will see the image label you just selected. When you create a text label, make sure the the text labels are placed INSIDE the image label (a + sign will appear) that way all the labels are linked to the image label, and with that their position on the screen is secured!(example in Image 7)

Now we are going to place some Labels in the screen. Right-click in the big empty area, select Place Widget > Label and name it Quest1Welcome
If you make a large amount of conversations, be sure you write them out in advance, and label them individually. If you don’t, you cannot assign the proper conversation in Kismet.

On te middle right side of your Unreal_UIscene_Editor window you'll find a positiong block. Here you can insert data to make sure your labels are placed exactly the way you want them to be.

Insert the text that has to be shown inside the Label. You can insert it under the tab: Data > DataSource > MarkupString.
You can align the text under the tab Data > StringRenderComponent > StyleOverride > TextStyleCustomization
Example can be seen in Image 6
(Image 6)

For our game Son of Argan we have made a ton of UI_scenes. an Example is to be seen in image 7.

(Image 7)

In the example above you can clearly see the Scene_Tools area as mentioned before. I also labeled all of my labels accordingly.

Good luck and:

Have Fun!