1. Sega 500 A Near TC for the GUI Jeff “Ezeikeil” Giles jgiles@artschool.com http://gamestudies.cdis.org/~jgiles

2. So far We’ve covered the core ins and outs of the GUI system in UT2003. Changed the Menus. Got functionality.

3. Today The presentation is going to be a little light on the graphic site of things since the GUI doesn’t like to have it’s picture taken. Also, I’m going focus on the functionality of the new stuff. Not really look at the specifics of previously seen GUI items.

4. The Plan We’re going to overhaul the front end of UT2003 so that it doesn’t look or behave like anything even resembling UT. Also, we’re going to make it run exclusively on a specific map, with a specific game type and mutator.

5. The Plan Main OptionsPlay Config Menu How our menu’s will relate: Splash Intro Movie

6. Getting started Our main menu is simply going to be a new background, text box and a button “begin” which takes us to the options screen. class EzeMainMenu extends GUIPage;

7. Main Menu The first big change is that we loaded some custom textures for the menus One for the background, one for the button. #exec texture IMPORT name=MAINMENU FILE=Textures\MainMenu.bmp #exec texture IMPORT name=BEGIN FILE=Textures\Begin.bmp

8. Main Menu //This menu's defaults Background=Material'MAINMENU' WinWidth=1.0 WinHeight=1.0 WinTop=0.0 WinLeft=0.0 bAllowedAsLast=true BackgroundRStyle=MSTY_Additive //begin button Image=material'BEGIN' ImageStyle=ISTY_Scaled ImageColor=(R=255,G=255,B=0,A=255) ImageRenderStyle=MSTY_Translucent Onclick=ButtonClick bFocusOnWatch=true bAcceptsInput=true bMouseOverSound=true OnClickSound=CS_Up

9. Main Menu Adding some functionality We need something to happen when our button is clicked…e.g. something for the delegate to point to.

10. Main Menu This simply causes a menu to open if the controller in index 2 is the caller. function bool ButtonClick(GUIComponent Sender) { //jump to next menu if ( Sender==Controls[2] ) Controller.OpenMenu("eze.EzeGameConfig"); return true; }

11. Main Menu We also trap the keyboard so the if escape is pressed, we can back out of the game. function bool MyKeyEvent(out byte Key,out byte State,float delta) { if(Key == 0x1B && state == 1)// Escape pressed { return true; } else return false; }

12. Main Menu And just for fun, we add a scroll box to the screen which is initialized here… var GUIScrollTextBox scrollbox; function InitComponent(GUIController MyController, GUIComponent MyOwner) { super.InitComponent(MyController, MyOwner); scrollbox=GUIScrollTextBox(Controls[3]); scrollbox.SetContent("Boo-ya!|Opening a can of whoop-ass",); }

13. Main Menu And declared pretty much like any other button Begin Object Class=GUIScrollTextBox Name=PlayerScroll WinWidth=0.472071 WinHeight=0.109878 WinLeft=0.493632 WinTop=0.831000 CharDelay=0.0025 EOLDelay=0.5 bNeverFocus=true End Object Controls(3)=GUIScrollTextBox'PlayerScroll'

14. Options menu Right, we’ve told our menu to open another menu, time to create that one. class EzeMainMenu extends GUIPage;

15. Options menu Most of the contents of this page are pretty much the same, so no point in talking about them. Really, the buttons have different pictures and locations, that’s about it…

16. Options menu The newness really lies in the functionality of the ButtonClick function.

17. Options menu function bool ButtonClick(GUIComponent Sender) { //Open Mutator menu if ( Sender==Controls[3] ) Controller.OpenMenu("eze.EzeBounceConfig"); //Begin Game if ( Sender==Controls[1] ) { Console(Controller.Master.Console).DelayedConsoleCommand("open DM- Antalus?Mutator=eze.adrenalinbounce?numbots=4"); Controller.CloseAll(false); } return true; }

18. Options menu So waz going down? This simply opens a menu, just like we said a second ago. //Open Mutator menu if ( Sender==Controls[3] ) Controller.OpenMenu("eze.EzeBounceConfig");

19. Options menu But this is a bit different Nut Shell?...It opens our level and closes the menu… //Begin Game if ( Sender==Controls[1] ) { Console(Controller.Master.Console).DelayedConsoleCommand("open DM- Antalus?Mutator=eze.adrenalinbounce?numbots=4"); Controller.CloseAll(false);

20. Options menu DelayedConsoleCommand accepts a string which is parsed buy the ‘?’ is used to determine how the game runs. "open DM-Antalus?Mutator=eze.adrenalinbounce?numbots=4"); Which map to open, use a mutator and the number of bots.

21. Using our menu So, how to we get UT to use OUR menu? Not hard, but it does take another file and a mod to the UT2003.ini

22. Using our menu Here’s the whole file Simply specify which menu class to use… class EzeGames extends GameEngine; defaultproperties { MainMenuClass="Eze.EzeMainMenu" }

23. Using our menu And now in the UT2003.ini we make a change to this line. [Engine.Engine] GameEngine=Engine.GameEngine

24. Using our menu Replace with this So if you run from a map it show up. Yet the is a problem… [Engine.Engine] GameEngine=Eze.EzeGames

25. Using our menu Our menu doesn’t show up on the 1 st run. No matter what Here’s why…

26. Recognize this guy?

27. Using our menu Well, this is actually a level. A scripted sequence to be exact, which is running a unrealgame.cinematicgame. If we open it (NvidiaLogo.ut2) up in the editor we’ll find a AIScript tag. Once opened, here’s what you’ll find.

28. Using our menu Under the AIScript tab

29. Using our menu This causes a specific menu to open when the script is done. Here’s my preferred solution: Make a copy of this level. I called mine EzeIntro.ut2

30. Using our menu And in this copy, point the script at our menu class.

31. Using our menu Lastly, in the UT2003.ini. We tell UT to use OUR map too. [URL] Protocol=unreal ProtocolDescription=Unreal Protocol Name=Player Map=Index.ut2 LocalMap=EzeIntro.ut2

32. Using our menu And, yeah. You can totally customize the intro map if you like.

33. Using our menu Great! Your menu’s are now in place. Time to waste hours of our lives figuring out where to place the buttons & stuff by yutzing with the X and Y coordinates… There has to be a better way…

34. a better way… Yeah…there is… Here’s an snipit from an online forum by a fella named Dr.Sin… You’ll need to be running the debug *.u’s for this by the way.

35. a better way… Just move you current *.u’s (the retail build) into a temp folder and dump the debugs into the system folder. (if your at school, you should be good to go)

36. a better way… First things first… all mod authors please do the following: 1. In UT2003.ini look for the header [XInterface.GUIController] 2. Add this to the section: bModAuthor=true

37. a better way… This will unlock the GUI placement and debug code. Once there, at any GUI page you can do the following.. Press CTRL-ALT-D to enter design mode.

38. a better way… Hold CTRL and click on any control on the page. The GUI will highlight (from the outermost inward as you click) the different controls under the cursor.

39. a better way… >OH….my god….debug info….for which menu the mouse is over….my god!<

40. a better way… CTRL+Cursors move the control CTRL+ -/= size Y CTRL+ +/- size X Holding ALT will size/move 5x faster. Holding ALT will also allow you to move the control via the mouse.

41. a better way… >>> GASP!!! <<< Wait, there’s more. Press CTRL-C to copy the dimensions & position of the control to the clipboard.

42. a better way… Yes…you can cut and paste your screen coordinates. WinWidth=0.300000 WinHeight=0.236250 WinLeft=0.024882 WinTop=0.589333

43. a better way… And…yes…there is a god >>>Thud!....passes out from shock and dismay…<<<

44. a better way… What Dr.Sin says about the GUI… “Makes designing menus much easier.”

45. Actually, he says a bit more… A GUIPage is the main menu container that holds other menu components. It's what the controller tracks on the top most level. To make a new menu, create a new page and start adding GUIComponents to it.

46. Actually, he says a bit more… The GUIComponents get defined in the default props and need to be assigned in order to the Controls[x] array.

47. BTW Word has is, Dr.Sin is someone at Epic.

48. Lastly… Time to deal with the splash screen.

49. And that loading screen… Dealing with this fella is actually really easy once we get the EzeMainMenu in place…because, this file also specifies the loading page to use. Just add yours… LoadingClass="Eze.EzeLoading"

50. And that loading screen… But there is one slightly odd thing…The loading screen is derived from a vignette…and there isn’t a since doc in the code explaining what a vignette is in the context of UT Figures don’t it?

51. And that loading screen… Fortunately, it’s a very simple class made up of 2 functions: And if you look at how it’s currently used in TestVignette.uc, you’ll see you can do all sorts of stuff with it… simulated event Init(); simulated event DrawVignette( Canvas C, float Progress );

52. And that loading screen… But, it really just boils down to displaying a picture and some text…but you can make it all snazzy if you like But keeping it simple, means we can pack everything into one function…

53. And that loading screen… simulated event DrawVignette( Canvas C, float Progress ) { c.DrawTile(Background, C.SizeX, C.SizeY, 0, 0, Background.USize, Background.VSize ); C.Style = ERenderStyle.STY_Alpha; theFont =Font(DynamicLoadObject("UT2003Fonts.FontLarge", class'Font')); C.Font = theFont; C.DrawColor = c.MakeColor(255,128,0); C.FontScaleX = 1; C.FontScaleY = 1; c.setpos(c.ClipX/7, c.clipY/4*3); c.drawtext("Think you can take me?... Be-otch!"); }

54. And that loading screen… Nothing complex, but does the job nicely…

55. Lastly… Previously, we thought this image to be locked up in a dll. Turns out it’s not. Just in an odd place.

56. Lastly… Look in your ut2003\help directory. Just open this up in Photoshop and have fun…

57. Lastly… Ok, this isn’t really a programmer solution, but we should know about it. And no. Image size doesn’t seem to matter Go big or go home!

58. That’s a wrap Et Voila! All the steps required to create your own total conversion of UT. Hope this meets all your GUI needs. But first…

59. A word to the wise… Before you lay into the overhauling the menu’s for UT, consider this first. Just because you can, doesn’t mean you should.

60. A word to the wise… What I mean by this is: Modify the menu only where appropriate to do so. There is no faster was to get people to stop playing your mod that Hosing their GUI!... Particularly if they feel this means a reinstall of UT!

61. A word to the wise… This extends into even talking about the game art. Don’t graffiti up their stuff. Some people actually like the look of UT. …despite how tempting the splash screen is, unless your doing a TC...leave it alone in your distribution.

62. A word to the wise… For an example of very good moding a game and menu system…just look at how Half life was integrated with counterstrike…The mod played nicely with the existing system.

63. A word to the wise… In addition to this, we already know how to get around this buy using command lines to specify which ini files to run. And you can even take it one step further if you feel the need…all your assets and source code can be included in your own custom paths.

64. A word to the wise… I’ll get off my soap box now…