Create a Portal 2 mod

Now, for those of you out there who want to create your own Portal 2 mod, this guide is for you. Whether you're new to Source engine modding, or have experience with older versions, it is different for Portal 2. It is NOT based on HL2, which means Valve built a new game from the ground up, and a lot of the things you may know about modding Portal are about to go down the drain. Not all of those things, though. Portal 2 is still based on the Source engine, and uses similar principles when it comes to game files and running those files.

Let's start with what I know:
Portal 2 is a game based on the engine Source 2009
The UI is rendered by something Valve refers to as VGUI (the UI newer games such as Portal 2 is rendered by VGUI2)
The Source SDK available in the Tools section of Steam can NOT be used for Portal 2 modding;
Portal 2 is a game built from the ground up and is NOT based on HL2
Portal 2 Authoring Tools are in some form an update to the Source SDK, only used for Portal 2
As mentioned before, everything while creating a mod for Portal only partially applies
Most, if not all textures used in Portal 2 have been upgraded to VTF version 7.5;
All of the most important textures (game logo, loading screens, chapter thumbnails) run on VTF version 7.5
Source 2009 remains backward compatible with older VTF versions (confirmed for at least version 7.2)

So, welcome modders, and get ready to find out how long you can last through this painstakingly long guide. I'm serious; there are 16 17 chapters of greatly detailed writing for you to indulge in. Good luck.

Create a playable mod

The first step, before you can do any sorts of customisation, is to make your mod playable. Now, if you want something OFFICIAL, you can always go to: https://developer.valvesoftware.com/wiki/Create_a_portal_2_mod
This part of the guide describes pretty much exactly what is written in the VDC guide. Of course, your mod is NOT on the Steam Store, and thus is not considered a 'game' by Steam (At least not for now). Solution: Create a folder and name it 'My Mod' in ...\Steam\SteamApps\sourcemods and open it up.

Next, create the most important file: a text document called 'gameinfo.txt.' Open it up and copy the following code:

"GameInfo"
{
	game 		"Your Mod's Name"
	title 		"Your Mod's Name"
	GameData	"portal2.fgd"
	gamelogo 	1

	SupportsDX8     0
	SupportsXbox360 1

	FileSystem
	{
		SteamAppId				620		// This will mount all the GCFs we need (240=CS:S, 220=HL2).
		ToolsAppId				211		// Tools will load this (ie: source SDK caches) to get things like materials\debug, materials\editor, etc.
		
		//
		// The code that loads this file automatically does a few things here:
		//
		// 1. For each "Game" search path, it adds a "GameBin" path, in <dir>\bin
		// 2. For each "Game" search path, it adds another "Game" path in front of it with _<langage> at the end.
		//    For example: c:\hl2\cstrike on a french machine would get a c:\hl2\cstrike_french path added to it.
		// 3. For the first "Game" search path, it adds a search path called "MOD".
		// 4. For the first "Game" search path, it adds a search path called "DEFAULT_WRITE_PATH".
		//

		//
		// Search paths are relative to the base directory, which is where hl2.exe is found.
		//
		// |gameinfo_path| points at the directory where gameinfo.txt is.
		// We always want to mount that directory relative to gameinfo.txt, so
		// people can mount stuff in c:\mymod, and the main game resources are in
		// someplace like c:\program files\valve\steam\steamapps\half-life 2.
		//

		SearchPaths
		{
			Game				|gameinfo_path|.
			Game				portal2_dlc2
			Game				portal2_dlc1
			Game				portal2
		}
	}
}

Remove the Game/portal2_dlc1 search path, UNLESS your mod is going to have Co-Op functionality. If you're wondering why, it's because there are some files in the original game directory on your hard drive that are crucial for Co-Op functionality. We also need to keep the portal2_dlc2 search path as that is the core of the mod, and we actually need to steal a few files from that directory.

Now that gameinfo.txt exists, create two subfolders: 'cfg' and 'maps.' Open the maps folder and create a folder named 'soundcache.' Copy the file named '_master.cache' from ...\Steam\steamapps\common\portal 2\portal2_dlc2\maps\soundcache to the new soundcache folder.



Congratulations! You've completed the hard work (for now). Simply restart Steam and your mod should be listed. Run it, and you'll notice that your menu doesn't load. Don't worry. The engine creates caches and the dots in the bottom corner will turn yellow when it's finished.

Once it's finished, hit Ctrl+Alt+Del and open the task manager. (Sorry to those Linux or Mac OS users) Find portal2.exe and end the process. Don't worry; it's safe.

Now that the engine has finished creating caches, run your mod again and it will start normally. You'll notice that nothing's changed, but this is where it gets interesting...

Customise core menu funtions

Be advised, you need more than just a copy of Portal 2 for this part.
From here on, you'll need:
- Portal 2 Authoring Tools - Beta
- GCFScape
Authoring Tools can be downloaded from the 'Tools' section in Steam, while this is the link for GCFScape:
http://nemesis.thewavelength.net/index.php?p=26
If you don't have them, go and install them now. You can't continue otherwise. GCFScape is required to open VPKs. Authoring Tools is required to create a VPK. First step is to extract a few files from the original installation of Portal 2. Before that, create a folder named 'pak01_dir' somewhere else on your hard drive. Preferrably desktop for me, but it's your choice. Once you've done that, fire up GCFScape.

Just a heads up: The structure inside the pak01_dir folder will resemble the structure of Portal 2. You can't use your own directory conventions; this is an important thing to remember.

So, in GCFScape, click 'File,' and then 'Open.' (Or just press Ctrl+O) Next thing, open up the directory of your Portal 2 installation. Open the 'portal2_dlc2' folder and find 'pak01_dir.vpk' and click on it. Make sure the file type is 'VPK Files.' THEN click 'Open.'

VGUI reads the menu from a few .res files inside the VPKs of your Portal 2 installation. We're doing this because we need to steal a few files from the game to customise our menu.

Now, you might be wondering; 'What about all of those other VPKs?' Well, pak01_dir is the only one that matters for a mod, because it contains the index of all the other VPKs.

Anyways, enough chit chat. We want a file named 'mainmenu_new.res.' This file is stored under the resource/ui/basemodui directory. Remember what I said about the pak01_dir structure always being the same? Go ahead and create this same subfolder structure in your pak01_dir folder. Open the basemodui folder, and drag the file from GCFScape to your new folder.

Next thing: open that folder with a text editor of your choice. The first thing you want to do is remove the Co-Op functionality. Let's do that now.

When you have the file open, you'll see something like:

	"BtnCoOp"
	{
		"ControlName"				"BaseModHybridButton"
		"fieldName"					"BtnCoOp"
		"xpos"						"88"		[$GAMECONSOLE && ($GAMECONSOLEWIDE && !$ANAMORPHIC)]
		"xpos"						"63"		[$GAMECONSOLE && (!$GAMECONSOLEWIDE || $ANAMORPHIC)]	
		"xpos"						"88"		[!$GAMECONSOLE && $WIN32WIDE]
		"xpos"						"63"		[!$GAMECONSOLE && !$WIN32WIDE]	
		"ypos"						"250"		[$GAMECONSOLE]  
		"ypos"						"228"		[!$GAMECONSOLE] 	
		"wide"						"280"
		"tall"						"20"
		"autoResize"				"1"
		"pinCorner"					"0"
		"visible"					"1"
		"enabled"					"1"
		"tabPosition"				"0"
		"navUp"						"BtnQuit"					[$GAMECONSOLE]
		"navUp"						"BtnPlaySolo"				[!$GAMECONSOLE]
		"navDown"					"BtnCommunity"
		"labelText"					"#PORTAL2_MainMenu_CoOp"
		"style"						"MainMenuButton"
		"command"					"CoopPlay"
		"ActivationType"			"1"
		"FocusDisabledBorderSize"	"1"
	}

This is the item that describes the Co-Op button, which string to display, what to do when clicked, and which buttons come next and before it when using the arrow keys. You can delete all of that now... unless you want to keep Co-Op functionality.

Next thing: find this bit: (right at the start)

	// Single player
	"BtnPlaySolo"

This is where the single player button is. There are a couple of things we need to do:
- Rename it
- Change the buttons that are selected with arrow keys

In that segment of the button, you'll find something like:

		"labelText"					"#PORTAL2_MainMenu_Solo"

You can change the label to anything you like. For example:

		"labelText"					"Play My Mod"

Save that file now, but don't close it.

You will find another segment like:

		"command"					"SoloPlay"

Replace this with:

		"command"					"Extras"

This will make it jump into the Extras menu, allowing us to customise the chapter list.

There are now two more things to do to the main menu:
- Change the navigation
- Change the position of the buttons

Find:

		"navDown"					"BtnCoOp"

Replace this with:

		"navDown"					"Options"

However, this step is not necessary if you want to keep Co-Op functionality.

While you're at it, also remove:

		"navUp"						"BtnQuit"	[$GAMECONSOLE]
		"navUp"						"BtnEconUI"		[!$GAMECONSOLE]

You also have to remap the Options and Quit buttons. So, for the Options button, find:

		"navUp"						"BtnCoOp"			[$GAMECONSOLE]

Replace that with:

		"navUp"						"BtnPlaySolo"			[$GAMECONSOLE]

Again, this step is not necessary if you want to keep Co-Op functionality.

Customise core menu functions (continued)

Because we already have the Extras menu as the chapter list, we need to remove the code for the original Extras menu. Find the part that looks like this:

	"BtnExtras" [!$GAMECONSOLE]
	{
		"ControlName"				"BaseModHybridButton"
		"fieldName"					"BtnExtras"
		"xpos"						"88"	[$GAMECONSOLE && ($GAMECONSOLEWIDE && !$ANAMORPHIC)]
		"xpos"						"63"	[$GAMECONSOLE && (!$GAMECONSOLEWIDE || $ANAMORPHIC)]	
		"xpos"						"88"	[!$GAMECONSOLE && $WIN32WIDE]
		"xpos"						"63"	[!$GAMECONSOLE && !$WIN32WIDE]	
		"ypos"						"340"	[$GAMECONSOLE]  
		"ypos"						"318"	[!$GAMECONSOLE]   
		"wide"						"280"
		"tall"						"20"
		"autoResize"				"1"
		"pinCorner"					"0"
		"visible"					"1"
		"enabled"					"1"
		"tabPosition"				"0"
		"navUp"						"BtnOptions"
		"navDown"					"BtnQuit"
		"labelText"					"#L4D360UI_MainMenu_Extras"
		"style"						"MainMenuButton"
		"command"					"Extras"
		"ActivationType"			"1"
	}

While you're at it, remove the Community Maps menu as well: However, if you want to leave community maps and the PeTI level designer in your mod, you'll need to let this code remain.

	// Community Maps
	"BtnCommunity" [!$GAMECONSOLE]
	{
		"ControlName"				"BaseModHybridButton"
		"fieldName"					"BtnCommunity"
		"xpos"						"88"	[$GAMECONSOLE && ($GAMECONSOLEWIDE && !$ANAMORPHIC)]
		"xpos"						"63"	[$GAMECONSOLE && (!$GAMECONSOLEWIDE || $ANAMORPHIC)]	
		"xpos"						"88"	[!$GAMECONSOLE && $WIN32WIDE]
		"xpos"						"63"	[!$GAMECONSOLE && !$WIN32WIDE]	
		"ypos"						"280"	[$GAMECONSOLE]  
		"ypos"						"258"	[!$GAMECONSOLE] 	
		"wide"						"280"
		"tall"						"20"
		"autoResize"				"1"
		"pinCorner"					"0"
		"visible"					"1"
		"enabled"					"1"
		"tabPosition"				"0"
		"navUp"						"BtnOptions"	[$GAMECONSOLE]
		"navUp"						"BtnCoOp"		[!$GAMECONSOLE]
		"navDown"					"BtnOptions"
		"labelText"					"#PORTAL2_MainMenu_Community"
		"style"						"MainMenuButton"
		"command"					"CreateChambers"
		"ActivationType"			"1"
		"FocusDisabledBorderSize"	"1"
	}

Remove all of that code. You'll also want to remove the Robot Enrichment button and the icon that goes with it. You may or may not want to keep the feature, but if there isn't going to be Co-Op, remove the following code.

	"BtnEconUI" [!$GAMECONSOLE]
	{
		"ControlName"				"BaseModHybridButton"
		"fieldName"					"BtnEconUI"
		"xpos"						"88"	[$WIN32WIDE]
		"xpos"						"63"	[!$WIN32WIDE]	
		"ypos"						"378"
		"wide"						"280"
		"tall"						"20"
		"autoResize"				"1"
		"pinCorner"					"0"
		"visible"					"1"
		"enabled"					"1"
		"tabPosition"				"0"
		"navUp"						"BtnQuit"
		"navDown"					"BtnPlaySolo"
		"labelText"					"#PORTAL2_MainMenu_Econ"
		"style"						"BitmapButton"
		"command"					"EconUI"
		"ActivationType"			"1"
		"bitmap_enabled"			"vgui/store/store_button"
		"bitmap_focus"				"vgui/store/store_button_focus_anim"
	}

and:

	"PnlCloudPic"
	{
		"ControlName"			"ImagePanel"
		"fieldName"				"PnlCloudPic"
		"xpos"					"310"
		"ypos"					"288"
		"wide"					"50"
		"tall"					"50"
		"visible"				"0"
		"enabled"				"1"
		"tabPosition"			"0"
		"scaleImage"			"1"
		"image"					"resource/icon_cloud_small"
	}

Back to the navigation. Inside the Options button text, find:

		"navDown"					"Extras"			[!$GAMECONSOLE]

Replace that with

		"navDown"					"BtnQuit"			[!$GAMECONSOLE]

Also find:

		"navUp"						"BtnCommunity"	[!$GAMECONSOLE]
		"navDown"					"BtnPlaySolo"		[$GAMECONSOLE]

Remove the second line. Now. Replace the first line with 'BtnPlaySolo' or 'BtnCoOp' depending on your choice of either yes or no to Co-Op functionality. Also remove '[!$GAMECONSOLE]' from the first line.

In the Quit button code, find:

		"navUp"						"BtnExtras"

Replace that with:

		"navUp"						"BtnOptions"

Last thing, find:

		"navDown"					"BtnEconUI"

Remove that. Now.

OK, on to the button positioning. If we leave it as is, there will be gaps between the three (or four) buttons. We don't want that. That's what this is about.

There are two 'ypos' strings for each button. You'll notice that there's a pattern. It starts with '310' and '288' for the Single Player button. The only one string for the Quit button should be set to '348.' You'll notice that the Options button has '310' and '288.' Change those values to '340' and '318' respectively. There's now a pattern; 30 difference in the values for each 'ypos' string. This should eliminate any gaps between each of your menu buttons. If you want Co-Op functionality in your mod, and thus, require a button for it, set the Co-Op button's values to '310' and '288.' To make sure the single player button doesn't interfere, set those values to '280' and '258.' You should be done.

This is actually just a simple customisation; you can add buttons that continue and/or load saved games, etc. It gets the job done, though.

There are still a lot of things to do, and you may have some frustrations with some of them in your experiences... or you may get impatient with the painstakingly long system of packing a new VPK every time you make a modification... or even this painstakingly long guide that you've been reading through.

Implement your core menu customisations

All that hard work has to be seen, right? I agree. This step isn't that hard. However, you'll need the Authoring Tools for this, as I explained before. Open up ...\Steam\steamapps\common\Portal 2\bin. Find vpk.exe. Find your pak01_dir folder, and drag it on to vpk.exe. Let go of your click, and the rest is magic. You now have a functional VPK! Finally, drag it on to your main mod folder. Restart Steam, and you should be able to admire your hard work.



Your final product should look something like this:

Create functioning chapter buttons

The next stage of menu customisation; the chapter buttons. For this, we have to use the Extras menu as the single player menu; the reason why we used the 'Extras' command instead of the 'SoloPlay' command. Here, you can have as many or as little chapters as you like. You'll need to create a 'scripts' folder for this task. Inside this folder, create an 'extras' text file. On the first line, type 'Extras' as a template. Again, just like the 'gameinfo' text file, the engine needs to know what this code is for. While we're in the scripts folder, go to ...\Steam\steamapps\common\Portal 2\portal2_dlc2 and copy the 'game_sounds_manifest' text file over to your mod's scripts folder. Back to the 'extras' text file, copy and paste the following code:

"Extras"
{
    "chapter1"
    {
        "title" "Chapter 1"
        "subtitle"  "The Beginning"
        "command"   "map sp_a1_00"
        "pic"   "vgui/chapters/chapter1"
    }
}

Just letting you know; the right bracket in the bottom line of the code above is not part of the code for an individual chapter, and just marks the end of the code for the whole document.

This is just an example, but it is functional and self-explanatory so I won't explain much about it. You'll need to do the same for the other chapters in your mod. I'm not going to go in to more detail about it, as you should work it out yourself and it is the same code for each chapter, you only have to change the map and the titles. If anything, this is probably the simplest customisation in the entire process. Once you're finished, save the file. Make sure it is in your mod's folder, and not in the pak01_dir folder that you have created.

Your finished product should look something like this...:

...but with more chapters.

Moving on now...

Create and implement your own logo

Time for the significant stuff! This part isn't very complicated, however it does involve some code for functionality. Here, you'll need GIMP.* This is an image editing and creation program that supports many plug-ins such as the VTF plug-in. This allows you to create images with the VTF file extension which is required for images to function in the Source engine.

Here are the links for GIMP and the VTF plug-in respectively:
https://www.gimp.org/
https://code.google.com/archive/p/gimp-vtf/

You'll need to manually extract the GIMP-VTF files and copy them to your GIMP directory, for example: C:\Program Files (x86)\GIMP-2.0\lib\gimp\2.0\plug-ins.

Once you've done that, fire up GIMP. Create a new image file with a resolution of 512x128. First, add a background layer that's either white or black, depending on the contrast of your logo. This background layer is going to be used as the Alpha layer; this makes it transparent and thus allows you to admire your logo in all its glory without a visible background layer. The rest is up to you and your imagination!

Simple yet effective:

You may notice that there is no background layer and that it is in fact transparent. This is another method that works: when creating your new file, choose 'Transparency' under Advanced. This method and the use of a white or black background layer both work completely fine.

Make sure when exporting your logo that you use these settings:
Note that for the image I was exporting in this screenshot, I made the background transparent in the first place. In this example I didn't use a white or black background; as I mentioned before, this method also works. If you have a background layer that is going to act as the alpha layer, make sure you select it in this window. You'll also need to create a file called 'portal2logo.vmt.' Open up a text editor, and copy this code:

UnlitGeneric
{
$basetexture "vgui/portal2logo" 
$translucent 1
$vertexcolor 1
$vertexalpha 1
$ignorez 1
$additive 0
$no_fullbright 1
$SHADERSRGBREAD360 1
}

All you need to do now is create a materials/vgui directory inside your pak01_dir folder, copy your logo and VMT file over and create a new VPK using 'vpk.exe!'

Your final product should look something like this:

*I have experimented with using Photoshop to create the actual logo, and GIMP to export it. Do your magic in photoshop, then open your PSD file with GIMP. Note that you'll have to use a black or white background layer, and then once you're done, add a transparent layer mask. This can be done by selecting your background layer, making the background selection, and then clicking 'Select and Mask.' To the right, you'll see various options. Just make sure that Transparency is set to '100.' Once that's done, right click the mask that has been created. This is shown in the section where you can select a layer. It should be shown to the right of the original part of the layer that is also displayed. After you right click it, click 'Apply Layer Mask.' Save your PSD file, and open it in GIMP. Export it as a VTF with the same settings as above, but don't select an alpha layer. Follow the same steps with packing the VPK and all that. Finally, run your mod, and behold!

Replace the main menu background

More significant stuff! For this task, you'll need RAD Video Tools. Download that at this link:
http://www.radgametools.com/bnkdown.htm

This allows you to convert almost any video/image in to a BIK file. This is the file extension that the Source engine uses and is why we can't just use a standard JPEG/PNG or MP4. For this example, I'm going to use the following image:

Fire up RAD Video Tools. You'll be greeted with something like this:

Find whatever image you want to use, then select it and press the 'Bink it!' button in the bottom left corner. Once you've done that, you'll be greeted with a large window that might look a bit familiar to people who have used Windows 95 before. Since this is an image and not a video, the only setting we have to touch is the compression setting. Select 'Compress to a % of the original:' and type 100 in the box next to it.

Last but not least, rename your Bink file to 'menu_act01' and click the 'Bink' button that's positioned to the far right of the window. Make sure that the file type is Bink 1 and not Bink 2, as it isn't supported by the Source engine...

Finally, create a 'media' subfolder in your mod's main folder. Copy over your new bink movie and...
Behold! Your main menu should now look something like this:

Note that Portal 2 uses 5 Bink movies for the main menu since there are 5 different "acts." You can either copy the same movie 4 times and use the same one for every "act," or you could use different movies for each act. It's all up to you!

Replace extras menu and quit confirmation dialogs

Are you annoyed with the default dialogs on the extras menu and the quit confirmation?


Here's how to change that. Fortunately, you don't have to go through that slow system of packing a new VPK every time you want to make a change. Create a 'resource' subfolder in your mod's main folder. Go to ...\Steam\SteamApps\common\Portal 2\portal2_dlc2\resource and find the 'basemodui_english' text document. Copy that over to your mod's resource folder and open it up. You might want to use a text editor such as Notepad++ or VS Code because you'll need to find a couple of line numbers. For me, the extras dialog was on line 453. You should find 'EXTRAS.' Replace that with something like 'NEW GAME.'

The next part is the quit confirmation dialog. For me, this was on lines 1687 and 1688. You should find 'Portal 2.' Replace that with the name of your mod. If you want to, you can also replace 'Are you sure you want to quit?' with something like 'But there's still science to do!'

Once you've finished, your dialogs should look something like this:

Implement custom background menu audio

Unfortunately, this task requires the slow system of creating a new VPK whenever you want to make a change. Fortunately, it isn't complicated at all. Just be aware that WAV type audio files are required for them to work with the Source engine. Most of you probably don't have that type of audio file; if you don't, just convert your audio online on a website like https://convertio.co or http://media.io. Just like the menu background, there are five different ones for each 'act.' As I mentioned in that section, you can either use the same Bink movie for each 'act' or use a different Bink movie for each; it's all up to you. First of all, create a sound\music\mainmenu subdirectory in your 'pak01_dir' folder.

Once you've converted your audio, name it 'portal2_background01.' As I mentioned before, you have two decisions here. You can copy it four times and name them '...02,' '...03,' '...04,' and '...05' respectively. You can also use different audio for each 'act;' just make sure that the audio files are in your desired order; the numbers '01,' '02,' '03,' '04,' and '05' decipher the order.

Once you're done with that, just drag your modified 'pak01_dir' folder on to 'vpk.exe,' and replace the VPK in your mod folder! Fire up your mod and you should be able to hear the glorious sound of your choice of background audio. Just note that you'll have to be a bit patient as it will take longer to pack the VPK because of the audio files.

Create and implement custom chapter thumbnails

You may have noticed that your chapter menu looks a bit empty without any thumbnails. It's time to fill up that space! For the best results, you'll need to use an image resizer. You'll figure out why later in this section.

Just like implementing your own logo, you need a VMT file that accompanies the VTF which is the thumbnail itself. First of all, create a 'chapters' folder within your materials/vgui subdirectory that's in your 'pak01_dir' folder.

Fire up GCFScape again, but this time open ...\Steam\SteamApps\common\Portal 2\portal2\pak01_dir.vpk; not the VPK that is in the 'portal2_dlc2' subfolder. Find materials\vgui\chapters and you should see something like this:

Copy and paste all of the VMT files in to your materials\vgui\chapters subdirectory. If your mod is going to have more than 10 chapters, just copy one of the VMT files, rename it 'chapter11' (or chapter12, etc.) and double click on it. You should see something like this:

Note that in this screenshot I was using VTFEdit; this is a useful tool for editing VMTs and even making slight changes to VTFs. However, if you haven't downloaded it, the VMT should open in your text editor anyway. Change the 'chapter1' that I circled to 'chapter11.' If you have a twelfth chapter, and so on, just rename the VMT and adjust the code accordingly.

For creating the thumbnail itself, you'll need to use GIMP again. Remember when I mentioned using an image resizer for the best results? Here's why. The VTF needs to be a resolution of 256x256. However, it is displayed in a way similar to a widescreen image. If you just create a VTF directly from GIMP at a resolution of 256x256, it will appear stretched in the actual menu. If you create it at a resolution of, for example, 1600x900, and then resize it to 256x256, you should get better results.

Here, you could just take a screenshot of one of your maps, resize it to 256x256, import it to GIMP, and export it as a VTF. Of course, you don't need an alpha layer for this. Use these settings:

For this example, I created a very sophisticated image:

One last thing. Remember the 'extras' text file that you created inside your mod's scripts folder? Open it up. For every chapter, you'll need to add a new line:

        "pic"   "vgui/chapters/chapter1"

Just adjust the code accordingly for each different chapter. Your 'extras' text file should now contain code similar to this...

"Extras"
{
    "chapter1"
    {
        "title" "Chapter 1"
        "subtitle"  "Chapter 1"
        "command"   "map sp_a1_00"
        "pic"   "vgui/chapters/chapter1"
    }
}

...but with more chapters.

Once you're finished with all of that, just pack a new VPK, replace the existing one and fire up your mod! You should be witnessing eye candy similar to this:

Implement your own icon

This is pretty simple, and just like the menu backgrounds, doesn't require the use of the slow system of packing a new VPK every time you want to make a change. Surprisingly, we don't need to make use of an ICO file. Handy; we only have to export once from GIMP. Here, we need a TGA file instead. Do your magic in GIMP* at a resolution of...

32x32! Now this might seem a bit low-res, which it is in my experience of creating an image originally at 32x32. Try creating the icon at a higher resolution (say 256x256) and then resize it to 32x32 and export it as a TGA file. The TGA file needs to be the name of your mod:

If you've probably done all that and restarted Steam, you're probably saying to yourself 'Where's the icon?' We need to do one last thing to make it work. Open up your 'gameinfo' text file. Create a new 'icon' string anywhere in the file, as long as it's not in the file system or search paths code. Personally, I'd create it under the 'gamelogo' string:

Then type 'resource/MyMod.' Restart Steam, and you should be able to witness your beautiful handiwork:

*Or Photoshop. As I've done with the logo, I created an icon in Photoshop and then used GIMP to export the image as a TGA file.

'Fix' controller button layout and keyboard/mouse bindings screens

You may or may not have noticed this, but your controller button layout screen might look something like this:

Your keyboard/mouse bindings screen might also look something like this:


These problems can easily be fixed. Navigate your way to ...\Steam\SteamApps\common\Portal 2\portal2_dlc2\resource. Copy the 'portal2_english' text document to your mod's resource folder.

Next, rename it to something like 'MyMod_english.'

Notice that 'MyMod' is the same as my mod folder's name. The text document must be this way or else it will be ineffective.

Restart Steam, and make your OCD happy!

Replace loading screens during initial mod launch

You're almost at the end modders! (of this guide, that is; you'll be using Hammer as well) Time to replace the loading screen when the mod launches. You can use Photoshop, GIMP, or possibly any other image editing software as long as you export it from GIMP. Why? Like the logo, the loading screens are VTF files. I'm pretty sure you all know the deal with exporting images as VTF files by now. So, do your magic in whatever image editing software you have. (I haven't tested with anything other than Photoshop, so no guarantees with ther editing software). Since there are two different loading screens, you can either create one and use that one for both, or create two different ones; it's all up to you and your imagination!

Just note that your final image must be a resolution of 1024x1024. This means that like with the chapter thumbnails, create something at a resolution of something like 4096x2304 if you want that extra 4K quality when the image is downsampled. Speaking of downsampling, that's exactly what you'll have to do before you export it as a VTF file. As mentioned above, it MUST be a resolution of 1024x1024.

For this example, I created yet another very sophisticated image:

When exporting in GIMP, you don't need an alpha layer, because this is the background itself and not the logo. So, use these settings:

Export the image as 'portal2_product_1.vtf.' If you're only going to have one loading screen, copy that file and rename the new copy 'portal2_product_2.vtf.' You'll also need to copy each of those files, and rename each copy to 'portal2_product_1_widescreen.vtf' and 'portal2_product_2_widescreen.vtf' respectively. Of course, if you're going to have two loading screens, name one 'portal2_product_1.vtf' and the other 'portal2_product_2.vtf.' As mentioned above, copy each one and rename them 'portal2_product_1_widescreen' and 'portal2_product_2_widescreen' respectively. In your 'pak01_dir' folder, create a materials/console subdirectory, because that's where the loading screens must be located

Here, you'll need to dig through the Portal 2 game files again. Navigate yourself to ...\Steam\SteamApps\common\Portal 2\portal2 and fine 'pak01_dir.vpk.' Open it up, and navigate to materials/console. You'll find the default loading screens along with their respective VMT files. You'll need to copy every VMT file in that directory to the materials/console directory in your 'pak01_dir' folder. You may notice other irrelevant VMT files, such as 'startup_loading.vmt.' Ignore those files.

Since we are making changes to the 'pak01_dir' folder, we need to pack a new VPK. As usual, navigate to ...\Steam\SteamApps\common\Portal 2\bin and drag your 'pak01_dir' folder on to 'vpk.exe.' It may take a while to finish creating the new VPK depending on how much space your 'pak01_dir' folder chews up. Once it's packed, replace it with the old VPK, restart Steam, and behold!

This is obviously a cheap example; you can do your mod much better justice than this!

Replace loading screens between test chambers

Sooo... yes, there are two parts to the loading screens; the first part which is the loading screens shown during the initial mod launch as shown in the previous chapter, and the second part which is the loading screens in between test chambers. That's what this the FINAL chapter is going to be about! If you've made it this far, congratulations and I hope you go on to make a great mod that may even end up on Greenlight sometime. Anyway, the loading screens are located in materials/vgui/loading_screens. Hmm... a very self-explanatory folder name. Mind you that this is within 'pak01_dir.vpk' so navigate your way to it via ...\Steam\SteamApps\common\Portal 2\portal2 and open the aforementioned directory. You will find many, and when I say many, I mean MANY VTF and VMT files. Why? Well, there are actually 4 loading screens when a test chamber is loading. This is because there are four segments for each loading screen; for example, in the loading screens which display the Aperture Laboratories logo, one part is shown, and then another, and so on. This is why there are so many VTF and VMT files.

You'll probably want to copy ALL of the VMT files to the materials/vgui/loading_screens directory in your pak01_dir folder. Oh, I forgot to mention that you'll have to create that directory first; so do that and then copy the VMT files... except the VMT files that have 'e1912' or 'coop' in the name, unless your mod will have co-op functionality, which means that you'll want loading screens for co-op as well. So you know, the files with 'default' in the name are the loading screens that show the Aperture Laboratories logo; the others are the loading screens that usually show part of a test chamber. 'a1,' 'a2,' 'a3,' and 'a4' are the designators for each act so the engine knows when to display what loading screen. Ideally, your map name structure should begin with 'sp_aX.' (replace X with the act number) This makes it possible for the engine to match maps with loading screens, which is exactly what you want. Anyway, enough chit-chat. Copy all of the VMT files you need to the materials/vgui/loading_screens directory in your "pak01_dir" folder; of course, you'll need to create that directory beforehand.
Now, it's all up to you and your imagination! Just make sure that every VTF name matches the name of the VMT file. You can use the same screen for all four segments in ONE loading screen, but I highly recommend not to use the same loading screens for every act. Once you're finished, just pack a new VPK as usual, replace it with the old one in your mod's folder, restart Steam, run a map, and you should be witnessing the (hopefully delicious) eye candy that you have created yourself while waiting patiently for a map to load!

Don't do this; I put zero effort in to the example for this chapter of the guide and just used the cheap image I created for the previous chapter.

Implement co-op functionality

As requested, I'm writing a chapter about how to implement co-op functionality. Remember the 'mainmenu_new.res' file for modifying the main menu? We'll be modifying it again... or not, if you aren't going to have co-op functionality in your mod. If that's so, then skip this chapter entirely. You may or may not remember but I wrote in the first chapter about modifying the main menu that you'll be wanting to keep the code for the co-op button. If you haven't kept the code for the co-op button, make your way to 'pak01_dir.vpk' in ...\Steam\SteamApps\common\Portal 2\portal2 and open 'mainmenu_new.res.' Copy the following code to the 'mainmenu_new.res' file in the resource/ui/basemodui subdirectory of your 'pak01_dir' folder:

	"BtnCoOp"
	{
		"ControlName"				"BaseModHybridButton"
		"fieldName"					"BtnCoOp"
		"xpos"						"88"		[$GAMECONSOLE && ($GAMECONSOLEWIDE && !$ANAMORPHIC)]
		"xpos"						"63"		[$GAMECONSOLE && (!$GAMECONSOLEWIDE || $ANAMORPHIC)]	
		"xpos"						"88"		[!$GAMECONSOLE && $WIN32WIDE]
		"xpos"						"63"		[!$GAMECONSOLE && !$WIN32WIDE]	
		"ypos"						"250"		[$GAMECONSOLE]  
		"ypos"						"228"		[!$GAMECONSOLE] 	
		"wide"						"280"
		"tall"						"20"
		"autoResize"				"1"
		"pinCorner"					"0"
		"visible"					"1"
		"enabled"					"1"
		"tabPosition"				"0"
		"navUp"						"BtnQuit"					[$GAMECONSOLE]
		"navUp"						"BtnPlaySolo"				[!$GAMECONSOLE]
		"navDown"					"BtnCommunity"
		"labelText"					"#PORTAL2_MainMenu_CoOp"
		"style"						"MainMenuButton"
		"command"					"CoopPlay"
		"ActivationType"			"1"
		"FocusDisabledBorderSize"	"1"
	}

You might want to position it where it will actually be positioned in the main menu.
Now, you can remove the following line:

		"navUp"						"BtnQuit"					[$GAMECONSOLE]

Next, figure out where this button is going to be placed. If it is going to be below the singleplayer button, keep the following line as is:

		"navUp"						"BtnPlaySolo"				[!$GAMECONSOLE]

As with the example showed in the first chapter about modifying the main menu, the options button is under the singleplayer button. However, since we are adding the co-op button below the singleplayer button, which makes it positioned above the options button as well. We need to modify the navigation in a different way compared to last time.
Firstly, find the following line:

		"navDown"					"BtnCommunity"

Change it to:

		"navDown"					"BtnOptions"

Now we need to change the navigation in the singleplayer button code.
Firstly, find the following lines:

		"navUp"						"BtnQuit"	[$GAMECONSOLE]

and

		"navUp"						"BtnEconUI"		[!$GAMECONSOLE]

You can remove these two lines now.

Next, we need to change the navigation in the options button code.
Firstly, find the following line:

		"navUp"						"BtnCommunity"	[!$GAMECONSOLE]

You can remove that now.
As you should be able to see, there is already a line for the up navigation with the co-op button.

Finally, we need to change the positioning.
Within the singleplayer button code, find the following two lines:

		"ypos"						"220"		[$GAMECONSOLE]

and

		"ypos"						"198"		[!$GAMECONSOLE]

Change them to:

		"ypos"						"280"		[$GAMECONSOLE]

and

		"ypos"						"258"		[!$GAMECONSOLE]

Next, within the co-op button code, find the following two lines:

		"ypos"						"250"		[$GAMECONSOLE]

and

		"ypos"						"228"		[!$GAMECONSOLE]

Change them to:

		"ypos"						"310"		[$GAMECONSOLE]

and

		"ypos"						"288"		[!$GAMECONSOLE]

Next, within the options button code, find the following two lines:

		"ypos"						"310"	[$GAMECONSOLE]

and

		"ypos"						"288"	[!$GAMECONSOLE]

Change them to:

		"ypos"						"340"	[$GAMECONSOLE]

and

		"ypos"						"318"	[!$GAMECONSOLE]

Finally, within the quit button code, find the following line:

		"ypos"						"348"

...and don't change anything!
Once you've finished, pack a new VPK, replace it with the old one, and restart Steam!

Your main menu should now look something like this:

Implement co-op functionality (continued)

This part is unnecessary if the co-op part of your mod is going to have challenge mode. However, read the text below the screenshot, you'll want to look at it. If you aren't going to implement challenge mode, open 'pak01_dir.vpk' in ...\Steam\SteamApps\common\Portal 2\portal2_dlc1 and navigate to the resource/ui/basemodui subdirectory. Copy 'coopmode.res' to the resource/ui/basemodui subdirectory in your pak01_dir folder. Open it, and remove the following code:

	"BtnChallengeMode"
	{
		"ControlName"			"BaseModHybridButton"
		"fieldName"				"BtnChallengeMode"
		"command"				"OpenChallengeModeDialog"
		"xpos"					"0"
		"ypos"					"50"
		"wide"					"0"
		"tall"					"20"
		"visible"				"1"	
		"enabled"				"1"
		"tabPosition"			"0"
		"navUp"					"BtnStandardMode"
		"navDown"				"BtnStandardMode"
		"labelText"				"#PORTAL2_ChallengeCoopMode"
		"style"					"DefaultButton"
	}

Also, remove the following two lines since they are now unnecessary:

		"navUp"					"BtnChallengeMode"
		"navDown"				"BtnChallengeMode"

Then just pack a new VPK, replace it with the old one, restart Steam, and your mode select dialog should look like this:

But wait, there's more! You can't just have a co-op menu; you also need maps designed for co-op. Here is a link that shows you how to implement co-op functionality into the maps themselves: https://developer.valvesoftware.com/wiki/Creating_a_Portal_2_Coop_Map

Replace icon that appears on loading screens between test chambers

No, you're not done yet with the loading screens. You should notice that the default Portal 2 icon appears on loading screens between test chambers:

This chapter describes exactly how to change that. First, fire up GCFScape. Open the 'pak01_dir.vpk' file located in ...\Steam\SteamApps\common\Portal 2\portal2 and navigate your way to the materials/vgui subdirectory. Find a file named 'spinner.vmt,' and copy it to the materials/vgui subdirectory in your 'pak01_dir' folder.

Next, create an icon with a transparent background at a resolution of 128x128. Export it from GIMP as 'spinner.vtf.' Export it your way when it comes to the transparency; either use no alpha layer and have default transparency, or use an alpha layer for the background. Just make sure that 'Compress' and 'Mipmaps' are ticked, and the version is set to 7.5. Save it in the materials/vgui subdirectory in your 'pak01_dir' folder.

Next, pack the folder in to a new VPK using 'vpk.exe' which is located in ...\Steam\SteamApps\common\Portal 2\bin and replace it with the old VPK in your mod's folder!
Open your mod, choose a test chamber, and behold!
Yet another cheap example; this time in the form of an Aperture antline...

Conclusion

I hope this guide has helped all of you readers out there a great deal, and congratulations if you had the patience to read through this loooooooooooooooooooong guide. For now, you've reached the end; just let me know if you want me to write about how to implement other things that still resemble features from the original game.

I hope that you all make great mods and that some of them even end up on Greenlight; please let me know! That should be possible, though, now that I've finished writing this guide. (At least for now)

[PedroLucas201441]

The Mod is not modyfiying the menu

[Aige]

when i tried to make it show in my sourcemods and restart steam nothing showed? is there something i did wrong?

[Domaged]

When I follow the instructions in 'create a playable mod' section, nothing shows up in my steam menu. Should it be in my steam library looking like a game? Thanks!

[opywndow]

i dont know why but the main menu replacement does nothing

[filval387]

I've changed the music of the main menu to my own but it doesn't play at the right speed, it goes too fast. Is there a way to fix that?

[Shrek Gaming]

Is There Any Way To Make Coop Work?
(It Crashes When I Try To Play Split Screen, Play Online, Or Try To Open Robot Enrichment Store)

[Darth Vader]

@PedroLucas201441 This is not a guide to put your mod on the Steam store. Unless you are willing to pay $100 your mod is not going to show up on the Steam store.

[Memo Core]

how can i make custom test chambers?

[agitated cat]

how does one keep challenge mode functionality

[Neof73]

i know this guide is old but, how do i remove stuff from the base game without affecting the base game? and what about using hammer for the mod?