Mod Switch – Frontend Map and UIScenes

UT3 LogoNow things start getting fun. This stage of the tutorial is going to end with you having your own UIScene loading when you start the game. We are going to take a couple steps with it through. The first step is to replace the Frontend map with our own; once that is completed, we will be replacing the Title Screen reference with our own and building the Title Screen UIScene and the Main Menu UIScene, and a final step when we move to our own datastore. This stage is also going to be a little different, because of the nature of kismet and the fact that our code is already completed. I hope you have enjoyed the process up to here. Once this is completed, you can safely depart into your own process. I will be covering a couple advanced topics after this:

  • Localization which is used to allow your game to be played in other languages
  • Background Matinee providing an automated movie in the background of your UIScene
  • Distribution to allow you to see how to package your game up and pass it around to your friends, foes and users
  • Package Suggestions which falls under the label of miscellaneous, but is still very important as it allows you to clean up how your code is thrown around and allow you to pass around a patch version of your distribution

Frontend Map Kismet

Go ahead and open up your Editor, remember to include your mod switch. When things load, we will start with the kismet, and then create a dummy level that will allow you to hook in the matinee later. For our purposes, there will simply be a still image behind the UIScene from the player’s viewpoint. If you are not comfortable within Kismet, I suggest you take a break from here and go hit the 3D Buzz website.

In a new sequence – the default first screen if you wish – create a new Level Loaded And Visible Event. To its output, you will need to add a new Open Scene Action and attach one more Open Scene Action to its success output. At the very end, I have included a Log Action to allow you to tell when things have completed. It will allow you to see that our UIScene is being used in place of the UT default when we finish the first stage. Your kismet should look like this.

010509-0846-modswitchfr1.jpg

There are two schools of thought for the next step. If you want to be clearer, I would suggest you use the kismet variables, but if you are so inclined you can simply drop the references directly into the Scene entry in the options for the Open Scene Action. I will include screen shots so kismet variables will suffice.

We need to open up a package for reference, and we will be using it in place of the UIScenes we will be creating in a moment. The package is called UI_Scenes_ChrisBLayout.upk (Located in [Unreal Tournament 3 Install Dir]UTGameCookedPCUI) and it contains the UT3 Default UIScenes. You should already have seen me reference it previously, and I used it for my testing and building out my values. We are looking for Titlescreen and Background. Select each and set them up as follows:

010509-0846-modswitchfr2.jpg

Note that the variables are Objects, not strings. Once that is complete, go ahead, close the Kismet Editor, and Make a basic map. It does not have to be detailed, similar to our first build of the code. We will revisit this level later when we visit matinees to spruce things up a bunch. You will need at least one player start; otherwise, you can do anything you want. (If you want to have anything seen, you will probably need a light too.). Make sure to save your map into the [Maps] directory.

Open up [Config]/DefaultEngine.ini and add the following block.

[URL]
Name=Ender Wiggins
Map=EFrontEnd.ut3
LocalMap=EFrontEnd.ut3
GameName=End3r's Game
GameNameShort=End3r

When you run the game now, it will load your mod’s configuration file, run your map, and execute your kismet. It will of course be using the default UIScenes, but they are being triggered within your map. You should see your map in the background and you should see the log output on the left hand side.

010509-0846-modswitchfr3.jpg

UIScene Creation & Correlation

Now we can get back into the fun and fray. We need to create two UIScenes to provide the functionality of the UT Default scenes, which we will mold, slowly, into our own. Open the editor back up and then load up your map. Open the generic browser then move over to the Actor Class browser and load in your code package – [Script]/Ender.u – so you have access to the classes we created previously.

Right click into the Generic Browser (make sure you are not in the class listing page) and go down to new UIScene. The window that comes up is very important. This window is where you provide the package, group, and name for your UIScene. This window is also, where you choose the class that your UIScene is derived from.

010509-0846-modswitchfr5.jpg We should start at the main menu. Select it from the dropdown menu pictured above and give it a name. I suggest you use a new package and do not wrap it up in your map and provide a group name as well. The main advantage of this is that you can exchange them at will and not need to bother worrying about what map its being used in, not to mention the advantage of using multiple references. Most people will likely be putting their logo and other images into the package with this UIScene.

When it opens up the UIScene editor hop back over to your generic browser and open up the MainMenu UIScene from UI_Scenes_ChrisBLayout.upk and you should be able to compare. The minimum you should include in this scene are as follows:

  • A UTUIMenuList named lstMenu
  • A Label named lblDescription
  • Two UISafeRegionPanels named pnlSafeRegion and pnlLongSafeRegion
  • Two further images that we will copy so the player can see who they are when logged in
  • A UTUIButtonBar named pnlButtonBar

A few of these can be placed automatically, so we should start there. Keep in mind, there is a hierarchy that is quite useful when you have to move something around on the scene. You should take advantage of it as often as you can. Start with the two UISafeRegionPanels. Go to our UIScene and right click in the blank area of the body within the blue rectangle. Under Place Widget is where the UISafeRegionPanel is located. Once selected it will ask you for the name and call the first one pnlSafeRegion. A white rectangle should be created that includes all of the real estate within the blue rectangle. In the bottom right is a hierarchy of the elements within your UIScene, grown off MainMenu. You can edit the order, so you control the overlaying of items. Select and Right click the MainMenu entry and add a second UISafeRegionPanel, name this one pnlLongSafeRegion. Once it is in there, select and right click the long panel. In the menu you can see an option called Reorder Widget. Select this and move the long panel to the bottom.

Right click on the long panel and add a UTUIButtonBar element to it, the name of which should be pnlButtonBar. The list is in alphabetical order so use that to your advantage. The button bar is added to the bottom of the safe panel and centered, as it should be.

Now jump back over to the other main menu (the one in UI_Scenes_ChrisBLayout.upk) and expand the tree under pnlLongSafeRegion. In here, you should see two entries, called imgNameBGPC and imgNameBGConsole. These two items are what allow the name to be shown in the bottom right of the main menu when you log in. If you are not releasing on console I do not think you will need to copy the console image, but I will here for hind sight because I plan to release a few tutorials on how to get the mod into console if I figure it out. Select each of the items, include their sub items as well, and copy them over to our menu tree, under the Long Safe Panel. Place them where you wish. The locations do not come along when you copy and paste.

With all that done you now have some only two items left to add. The Description Label and the Menu List itself. For now go ahead and copy them over from the default, it will save us some time with theming and setting up the datastore yet. At this point, we are going to save the main menu and get the title screen completed.

010509-0846-modswitchfr4.jpgGo back to your generic browser and create a new UIScene, use the same package and group, but name this one TitleScreen and use the TitleScreen class that we created previously. This is really a very simple UIScene, because its contents are optional. You should include some form of prompt so the user knows its waiting on them but otherwise everything is just fluff and games. As long as you include it within a safe panel, as we did before, you will do fine.

With those two completed all we have to do is redirect the TitleScreen UIScene Reference. Open up the kismet and change the reference to point to our new TitleScreen UIScene. You should look at the value that is thrown into the scene variable, if you have done everything right you will see it cast from our UIScene class. If not, something was screwed up and you need to create it again. It should look like this.

EUIFrontEnd_TitleScreen’End3rUIAssets.Scenes.TitleScreen’

Give your mod a load! It should look like crap, because of how simple and brief things have been thus far, but it is yours nonetheless. Do note that there is an extra item in the menu. You will need to update the Datastore before it reflects the proper values. They are off by one entry, if you click Settings you will be prompted to exit. The next step is to move into the datastore.

Datastore

Okay folks, home stretch. Open up the editor and navigate to your package on the generic browser. Open up your main menu and select the lstMenu element. Expand the datastource element, under data. Change the markup to the tag you used for your datastore, mine is <EMenuItems:MainMenu>. If you do not remember it, you should go open your datastore code up again.

Before you close this out you should take a moment to remove the campaign (and any other elements you are not using) from the “list” listing – it’s under UTSimpleList > List. You should know that when we get into localization we will need to revisit this part of the menu. Currently you should not need anything in the listing our datastore will handle it. The list is simply the placeholder for the later elements. You can also play with the formatting later, to customize it.

With that, you are done; go ahead and save it all out. When you load the mod now you should be able to see the menu system has changed.

As I said earlier, we are going to be going into advanced topics from here out. I hope that there are not too many issues in this but I will be commenting in a few notes. Best of luck. Expect the tutorials to mature over the next week or so as people go through it. Moreover, good luck with your mod adventures.

=) Here is the finished product, note the bg changed on the login screen because it uses our map now.

010509-0846-modswitchfr6.jpg 010509-0846-modswitchfr7.jpg 010509-0846-modswitchfr8.jpg
  • Bob

    Every time I make a mention to change, your default ini files you will need to delete and or update the UT ini files that are created from them with the values that we are adding or updating to the default inis. I make all of my changes to the defaults for simplicities sakes.

  • Bob

    When working in the UIScene editor there is a resolution slider that you can use to keep track of how your scene looks at different resolutions. How kind of Epic =) I work at 1024x but often jump down to 800x resolution for scaling and resolution checking.

  • Bob

    There are some circumstances where your Title Screen does not show up when you load the game. This is because of a setting within UTUI; you will see it under the following header.

    [UIRegistryDataProvider UIDynamicFieldProvider]
    PersistentDataFields=(PropertyTag="GoStraightToMainMenu",PropertyType=DATATYPE_Property,StringValue="1",ImageValue=None,ArrayValue=,RangeValue=(CurrentValue=0.000000,MinValue=0.000000,MaxValue=0.000000,NudgeValue=0.000000,bIntRange=False))

    Simply delete it and you should be able to see it again.

  • Bob

    Do be aware that you cannot change the class of a UIScene once it has been created. You will need to begin anew, but you can always copy and paste out of it.

  • Bob

    When you run the game the first time, you will be provided with a prompt for the CD-Key. Every time you delete your [Config]/UTEngine.ini file, it will need to have the CD-Key provided again.

    One simple hack I figured out was to throw the block from your UTEngine under the title [OnlineSubsystemGameSpy.OnlineSubsystemGameSpy] into your [Config]/defaultengine.ini file and you don’t have to worry about giving the product key when you are playing with the title screen or working within your [Config]/default*.ini files and don’t want to bother with duplicating your changes.

    The only catch is that you have got to make sure that you remove the entry before distributing or your cd key will be lost to the horrors of the internet. =)

  • Pingback: Frontend Progress Report | White Mod - Development()

  • Andreas

    First of all I must thank you for this wonderful tutorial ^^ You have done an incredible job. Thanks a lot.

    But I have run into some problems =/ When I lunch my mod I get to the title screen where it says “Press Any Key” and I see the log output on the left side. But once I press any key nothing happens I can’t even turn off the game. I need to shut it down manually whit task manager.

    any idea what might be the problem?

    // Andreas

  • Bob

    If you check your logs, chances are your package reference is incorrect. Do me a favor and shoot me an email with your log and the contents of your title screen class and im sure we can work it out.

  • Bob

    in looking at your logs your package references are incorrect. Just so you know, you can still quit by using the [F10] Console. Type in ‘quit’ and it will shut the game down cleanly.

  • Andreas

    Thanks for helping me Bob, I had to change

    MainMenuScene=”TestModUIAssets.Scenes.MainMenu”

    to

    MainMenuScene=”TestModUIAssets.MainMenu”

    since I didn’t have my scenes in a group in my package.

    But this still did’t do it =( so I sent you another mail whit the Package’s tree structure. I hope it helps.

    ~Andreas

  • Andreas

    YES! found the problem! I started to wounder where the “Assets” part of the name represented, and then it hit me. It was so simple.

    My package was named “TestModUIScene” not “TestModUIAssets”. This typo occurred since I just replaced the “End3r” part of all names whit “TestMod” but named the package on my own since either it wasn’t in the tutorial or I just simply missed it.

    Oh well thanks for all the help Bob and for making this wonderful tutorial ^^

    cheer m8

    ~Andreas

  • Bob

    Good Luck. I am still working on the localization tutorial. Its taking longer than expected for reasons i would rather not get into.

  • Boy, I feel dumb. Thanks a lot for your extensive tutorial, Bob! I figured out my issue; the correct command line to be using to mod switch should have been
    “[install directory]Unreal Tournament 3BinariesUT3.exe” -mod=..AvariceGameConfig -useunpublished

    Thanks a lot for your awesome work!

  • Casey

    Hi. Awsome work on these tutorials. I’ve had no trouble thus far, except trying to replace the UT3 Titlescreen img with my own. I added an img as a child to my pnlSafeRegion in my TitleScreen but how do I apply the image? Thanks.

    • Bob

      Check out the properties for the image. There is a field that says something like image source or the like that you are looking for.

  • Casey

    Thanks Bob. It was hidden away. Last question for now is how do I make the background of my TitleScreen transparent? I troed making the background transparent and saving it as a tga.@Bob

  • Bob

    I have no idea why yours wouldnt be transparent already, but making it transparent seems to be the solution.

    I do my textures as PSD’s and import them directly in without middle formats so idk how that would impact things on your end.

    As a quick aside i would like to mention that naming your map has some consequences. If you dont prepend UTFrontend to your level you will have some very quirky issues with your game type.

    Read more here:
    http://utforums.epicgames.com/showthread.php?t=628930&highlight=frontend&page=2

  • Casey

    I’ll try importing directly as PSD’s. Thanks 🙂

  • Konsollhode

    Hey!
    Great Tutorial! Very easy to follow=)

    But my simple list won’t update with the text I put in it, as soon as I exit the UIScene editor the text is lost. Even if it shows up in the editor..
    f.ex: I use “New Game” instead of “Campaign” and so on..
    I’ve changed the datasource code to ,
    (Where F is for my own switch), and changed “Instant Action” to “New Game” in the .uc file.

    -> Everything else works like a bell, even my own custom title and main menu elements..
    Got a quick fix for me?

  • Patrick

    Hello, first of all great tutorials.
    and now I’m stuck, Ive got a mainmenu thats setup to say “new game/loadgame/settings/exit”

    new game and load game are temporarily set to open InstantActionScene.
    I made a new scene called MissionSelectScene (this is what opens from new game). and changed the code from

    case ZMAINMENU_OPTION_NEWGAME:
    OpenSceneByName(InstantActionScene);
    break;

    To

    case ZMAINMENU_OPTION_NEWGAME:
    OpenSceneByName(MissionSelectScene);
    break;

    ofc this doesnt work because it doesnt know what MissionSelectScene is yet.

    Ive gone through some of the source and other parts and I tried defining in several places, MissionSelectScene=”ZevUIAssets.Scenes.MissionSelect”

    So far no luck – it either has had problems with where ive defined it and sometimes how.

    Changing InstantActionScene=”ZevUIAssets.Scenes.MissionSelect” and leaving the, case switch, to open “instantactionscene” when its clicked worked, but I dont want to change these defaults for every time I want a new scene opening (because I might run out of default scenes to change and it seems a bad way of doing it).

  • Patrick

    YAY I DID IT!!!! ( i had a few hiccups along the way so the yay=its about time)

    declared a variable containing the scene name

    var string MissionSelectScene;

    then in the default properties put

    defaultproperties
    {
    MissionSelectScene=”ZEVUIAssets.Scenes.MissionSelect”
    }

    ——————-

    It seems so simple now… and Ive been on the right tracks for hours, defining it as a string then as a UIscene then trying other things (inside and out of default properties) then for the last hour I had it! only it was coming up with warnings (instead of errors)… so I went for a break came back and realised I was typing something other than “missionselect” (i was putting menuselect).

    anyways It works. and Im happy.

  • Great tutorials as usual.

    I am having an issue saving the file though. I am trying to save the UI elements into my base package(not my map) and i keep getting GetLastError: 32 and GetLastError: 183 when it tries to move/copy while saving. Any ideas?

    1 other question. you say to copy the description label and the list from default. What default? I dont see anything that fits that description..

    Thanks!

  • cog

    Hi Bob..Thanks for this ModSwitch Tutorial. I really appreciate the effort 🙂
    I am following your tutorial…and after finishing when run the mod -useunpublished I can see my TitleScreen and it also prompts for press and key but it kind of stay like that its something similar to Andreas problem.
    But m sure its not a typo please check this image…can someone plz help in this…. http://img23.imageshack.us/img23/4466/modswitch.jpg
    I am using new patch UT3Patch4 with Titan Pack
    cheers cog

  • cog
  • Bob

    Hello Cog,

    I have no idea what this is that i am looking at, but I may have some time later this evening. I see that you are using the End3r package, and there is nothing wrong with that, other than needing to do some considerable changes later.

    If you are really interested in getting this fixed i suggest you get on my teams IRC channel and see if anyone (like me) is available to help you there.

  • cog

    @Bob
    hi Bob thanks for your reply…well ill surly find the IRC channel….but at the sametime if u get sometim..can u please have a look on this link i uploaded End3r folder.. http://www.megaupload.com/?d=DRI2P5CZ …thanks again for help!

  • cog

    @Bob
    As u mentioned “Before you close this out you should take a moment to remove the campaign (and any other elements you are not using) from the “list” listing – it’s under UTSimpleList > List.”
    I did exactly this..but when i deleted campaign from list everytime i load MainMenu in unreal enditor that list always loads empty plz check this image :- http://img9.imageshack.us/img9/676/simplelist.jpg
    m not sure if this is the problem 🙁

  • Bob

    this is a known issue, but it is not always the same for everyone. It worked for me and my proof readers but quite a few of you readers have had issues, and since i updated to 2.0 i have had the same issue.

    I have written to epic a few times to see if the mailing list knows about this stuff.

  • cog

    ooh thats an issue….i guess i have to downgrade back to the old patch…get this ModSwitch fixed working…

  • Bob

    It doesnt get better on 1.3. The thing works from time to time, you just have to cross your fingers and hope.

    Or you can grab mine and mold it into what you need.

  • cog

    @Bob
    haha sure…
    well just last time i wana give it a try….can u share the very basic version of mod switch only which is covered in this tutorial…i wana check if that works on my machine or not? will that be possible for u?
    cheers
    cog

  • Russ McMackin

    Any progress on this yet for being broken in 2.0? I haven’t been able to find any fixes / workarounds yet.

  • Eric

    Hi !

    I read the tutorials, and I have a problem. I want to remove UT’s default map and UT’s default game types. I know I can do this with the inis but that I must be careful. I read it’s not the better method. If I make a new UIScene, the InstantAction one, what must I remove using the Editor ? I must create a new class ? I don’t know how to start this…

    Thanks for your answers.

    • Bob

      You are kind of on the right track, but its a lot more work than it is worth. You have to replace the Frontend, its title screen, main menu and the instant action scenes to achieve what you describe, each with its own class involved, and each with its own UI changes, as well as the data store entries associated with the UIScene.

      I would suggest you either a) dont or b) you remove the menu list elements from the UI all together and just drop in your own buttons. It will be much easier and you wont have to worry about the list element issues.

  • Eric

    Moreover, when I start on my InstantAction scene, the map behind desappears and there’s a white back. I don’t understand how to have my simple scene .ut3 always with my menus.

  • Bob

    @cog

    Your best bet is to simply grab my mod off of mod db. That has this tutorial explicitly. The End3r’s game mod is not something i can share openly.

  • Bob

    @Lokken

    The default is the original. It is in a package called UI_Scenes_ChrisBLayout.upk, available at… unreal tournament 3UTGameCookedPCUI

    As for your error, I have no idea what that is about. I would suggest you walk through the tutorial again and if it occurs, send an email to the UT3Mods Mailing list.

  • Eric

    Ok thanks
    I have something I don’t understand. what can I do to use my custom maps and not UT’s maps. I had a look at UT’s UI, in the Editor, especially in the UIScene InstantAction, ( in the UI_Scenes_ChrisBLayout package), and I saw the map lists, but I don’t understand how to put my list in a new UIScene.I have a new package, with the UIScenes I need.

  • Oscar

    I’ve been following your tutorials and I must say they’re great. I’ve run into a problem, well not a problem but a very annoying thing. I’ve followed this tutorial halfway through and have created my own FrontEnd map but I’m still using the default UIScenes. The problem is that when I run UT3 (UT3.exe” -mod=..Sanctum -useunpublished) it gives me an error message that says “Ambigous package name: Using ‘[UT3 root folder]SanctumCookedPCCustomMapsSanctumFrontEnd.ut3’, not ‘[UT3 root folder]SanctumUnpublishedCookedPCCustomMapsSanctumFrontEnd.ut3′” but it stoll starts and it still uses my own FrontEnd map.
    I have not placed my mod map in the root directory, I’ve placed it in my documentsmy gamesunreal tournament 3 So it shouldnt even be looking in the root directory.

    This is very confusing :S
    Is there a way to just remove that message?
    it seems to work anyways

  • Bob

    @Eric
    The maps are auto loaded. If you want to remove the ut3 maps and insert your own you will need to write a new UIScene that derives from the instant action class that explicitly removes the ones you are trying to get rid of.

    @Oscar
    That message is rooted in the update to v2.0. The lead developer of the mod switch made it automagically load the directories as i prescribed them so your entries in the ini files will cause it to look twice. You will see the update in the post here…

    http://blog.gneu.org/2009/03/mod-switch-20-update/

    Specifically:

    Primarily this patch removes the CookedPC folder. and moves the localization from the published folder out into the root of your mod. You can, of course, put your localization anywhere you want, but the mod switch actually loads things from these same locations automagically. […]

    You can thus remove any references to the paths having to do with the script output and the localization from your ini files

  • gary

    i am following your tut and am having a problem. every time i try to run the mod it throws the error” Failed to find file for package EFrontEnd for async preloading” any ideas on how to fix this

    • Bob

      PM Me on AIM or join our IRC channel

  • gary

    where do i join the IRC Channel ?

  • gary

    what is the channel name for the irc chat????

  • Bob

    irc://irc.enterthegame.com/whitemod – It is on the bottom of the whitemod.com website.

  • gary

    I am still having a problem with your tut i am unable to save that package separately from the package. which I think is the reason why I keep getting the error “Failed to find file for packageEFrontEnd for async preload”

  • Bob

    That is not what is going on. The reason it cant find the package is that you are not finishing the tutorial before you try to run it. There is at least one more section that you have not read, the last one which is referring to the mod 2.0 updates and it will correct your issues if you read through the whole tutorial before you get to work on the implementation of it.

  • Konsollhode

    Hey!
    Thought I had this mod structure under control, but as it seems now the MainMenu loops.. Everything works fine, but after the level has loaded the main menu comes up again and again.. Any ideas where the error lies?

  • Bob

    The main menu class is probably the best place to start. It has to be making reference to itself. Start with some logging and follow the code through its path.

  • Jordan

    hey bob, I’m trying to follow this tutorial, and I can’t seem to get it to work. Can you give me a hand? I can’t seem to find your email to send a log, so can I paste it here or can you email me, so then I can email you?

    –Jordan

  • Bob

    My contact information is as follows:

    Please feel free to message me any time, and if you are in a bind – IRC.

    [email protected] | GTalk, Email & MSN ID
    TheAdvocateSB | AIM
    irc://irc.enterthegame.com/whitemod | IRC

    Discussion is also available here. If you are having any problems in particular you should post them here. If its just not clicking or you need a smile there are others around that may be willing to help you out as well.