LINKS

Creating a custom Icon.

Your own game Icon

In this tutorial we are going to create our own custom icon for our UDK project. Before we can go any further, download the files below to continue.

DOWNLOAD: Mobilephoneapp.icon Tutorial DOWNLOAD: IcoFX Version 1.6.3

STEP ONE

First, any image will do for this tutorial but if your new to all this just download the picture from the link above.

If your going to use your own image I recommend that:

• The image is 256 pixels x 256 pixels

• It is of low resolution (32bit true colour)

• It is a BMP file or Jpeg or png or gif file.

In this tutorial we need to download this program to create the icon. In this tutorial I am using the IcoFX Version 1.6.3 Click here to download it, Click here to view their website.

Install the Icon Program and follow all the instructions, read the agreements etc.

STEP TWO

Run the icon editor program IcoFX. Close any tips for the day that may load up.

Click on file and click on Import Image. Locate the image you downloaded from the link, open the file iconfun.zip, and extract the file "iconfun.bmp" and click open.

A New Image window will appear with some options.

Select these options if they are not already selected.

• True Color + Alpha Channel (32 bits)

• 256x256

Click OK

You will now have an image like below on your screen.

Click "Yes". Don't forget to backup any files you are going to change.

STEP THREE

Right click the small phone image in the small window and select "New Image"

We now want to select 48x48.

From here we repeat all the steps until we have all these dimensions.  ( 256x256, 48x48, 32x32, 24x24, 16x16) So your screen should now look like the image below.

We are ready to save this icon now.

Click "File" and click "Save As".

Locate this Directory

C:\UDK\UDK-2012-05\Binaries\InstallData

This is a default directory, yours may differ, even the version of the editor may differ but this tutorial works for most versions.

Locate the file "GameIcon.ico"

Click on this file and click "Save". Click yes to confirm you want to overwrite the file.

This now has overwritten the UDK icon. So next time you make a package it will use this icon in the project.

Now we can make our "Un-install" icon.

Click "Yes". Don't forget to backup any files you are going to change.

STEP FOUR

Click here to download the Un-install icon. This icon is 128x128.

Import this icon and follow the same steps as step 2 but when the New Image screen appears select Custom and check that the Width and Height is 128 x 128. Click OK.

So this time we need to make 128x128, 48x48, 32x32, 24x24, 16x16.

Click "File" and click "Save As".

 Locate this directory again.

C:\UDK\UDK-2012-05\Binaries\InstallData

and locate the file "Uninstall.ico"

Click "Save".

Click OK to Confirm to overwrite the file.

That's it! If you install a project and look in the un-install, it will have the icon.

Have fun and good luck, if you haven't done it yet I would try importing my own images and see how they go...

Change the files size to the file size your icons are in the Manifest.xml

STEP FIVE

Because we changed the icon file if the size of the file has been changed the editor will have difficulty reading this when packing.

Locate the following directory:

C:\UDK\UDK-2013-07\Binaries\InstallData

Locate the file: Manifest.xml

You need to change the file size here if it is different to the file size of the original icon or it will not pack and your UDK project wont pack correctly. This part of the tutorial is good for any external files you created that need to be packed using Frontend.

[1] In the text editor search engine, type in: "Gameicon" and click find, find next or search depending on your text editor you are using. At the end of the sentence is the text: Size="54948"

[2] Type in the text editor "Uninstall" or look down a couple of lines and find it. This says Size="85182" at the end of the line.

[3] Make sure the new icons you created are the same "size" as the files mentioned above in the Manifest.xml document.

If they are not, manually type their size in and save. To locate the correct size of your icon, right click it, select "Properties"  Where it says "Size" this is file size you need to add to the line.

If they are the same size already, do not modify them at all.