Making Icons and Integrating: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
m (Nesciuse moved page Making Icons and Integrating/en to Making Icons and Integrating without leaving a redirect: Move en subpage to basepage)
 
(15 intermediate revisions by 8 users not shown)
Line 1: Line 1:
{{LanguageBar}}
{{toc-right}}
{{cleanup}}
{{cleanup}}
{{otherlang2
'''icon''' tells Steam where the icon can be found; In this case, in the resource folder: ''resource\game'' It should default to looking for icon.tga
| ru = Making_Icons_and_Integrating:ru}}
== How to make an Icon for your mod ==
 
If you'd rather, there's a Youtube tutorial as well. '''Watch it here''' [http://www.youtube.com/watch?v=9OYe6Q7BnDI Youtube Tutorial]
 
There are two types of icons that this page will detail creating for your mod.
 
*''An icon in Steam.''
 
[[File:foo_Short2.jpg]]
 
*''The actual icon associated with the short-cut.''
 
[[File:short1.jpg]]
 
Both are easy enough to make.


== Requirements ==
== Making an icon for your mod ==
[[File:steamlibraryico.jpg|Steam Library|thumb|256px]]
[[File:Desktopico-tut.jpg|Desktop and Enlarged|thumb|256px]]


Adobe Photoshop or [http://www.gimp.org/ Gimp]
For the icon of your mod to show, there are two places it can be displayed: In your steam library and on your desktop. (right)


[http://rapidshare.com/files/328928705/Targa_converter.zip AlphaConv] or [http://www.mediafire.com/?h5m4mjmm3i5 mirror]
To make your icon you will need either:
*[http://www.adobe.com/products/photoshop.html Adobe Photoshop]
*[http://www.gimp.org/ GIMP]
*[https://www.getpaint.net/ Paint.NET]


[http://icofx.ro/ IcoFX]
== Making the Steam Library Icon ==
To start open an image editor and create a new file with the dimensions 256x256 pixels. Then save your image as a .png in a folder (For example {{code|sourcemods/resource/icons_raw/}}) and name it ''icon_huge''.


Source sdk + steam
Copy the ''icon_huge'' and rename it to ''icon_big'' and scale it down to 32x32 and do it again but name it ''icon'' and scale it to 16x16.


== Make Steam Icon first ==
After creating the icons, Open the ''icon'' file and save it as a targa file (.tga) in the {{code|sourcemods/YourMod/resource}} folder, do the same with ''icon_big'' and '''NOT''' with ''icon_huge''.


First things first; Open steam and launch the Source SDK in the tools tab. If you haven't already, [[Create_a_Mod|Create a Mod]] and navigate to your mod folder: ''C:\Program Files(x86)\steam\steamapps\SourceMods\mymod'' where "mymod" is the name of your mod. If you have, navigate to your mod folder.  
Now once you have done all of that, the next step is to show the icon in the steam library. Go to your mods folder and open ''gameinfo.txt''.


Open your gameinfo.txt file in your favorite plain-text editing software.
Below ''game, title, title2, and/or type'', type ''icon "resource/icon"'', example:
It should look akin to the following
<pre>
<pre>
"GameInfo"
"GameInfo"
{
{
// This is what shows up in the 'Third Party Games' area of the Steam games list.
game "My First HL2MP Mod"
game "mymod"
title "HALF+LIFE'"
type singleplayer_only
title2 "deathmatch mod"
FileSystem
type multiplayer_only
{
icon "resource/icon"
    SteamAppId 215 // GCF for Source SDK Base
nomodels 0
    ToolsAppId 211 // Tools will load this (ie: source SDK caches) to get things like materials\debug, materials\editor, etc.
nohimodel 1
 
nocrosshair
SearchPaths
...
{
Game |gameinfo_path|.
Game sourcetest
Game hl2
}
}
}
</pre>
Add the following lines under '''type'''
<pre>
"developer" "noob industries"
"developer_url" "http://www.google.ie"
"icon" "resource\GameIconSteam\icon_mymod"
</pre>
</pre>


...So that it looks like this:
Now save and restart Steam and your icon should appear in the library.
<pre>
"GameInfo"
{
// This is what shows up in the 'Third Party Games' area of the Steam games list.
game "mymod"
type singleplayer_only
        "developer" "noob industries"
        "developer_url" "http://www.google.ie"
        "icon" "resource\GameIconSteam\icon_mymod"
FileSystem
{
    SteamAppId 215 // GCF for Source SDK Base
    ToolsAppId 211 // Tools will load this (ie: source SDK caches) to get things like materials\debug, materials\editor, etc.
 
SearchPaths
{
Game |gameinfo_path|.
Game sourcetest
Game hl2
}
}
}
</pre>
 
=== Breakdown ===
 
*'''developer''' is the name of what company or who made the game. This affects the game files itself, such as seen in the your Steam games list.
*'''developer_url''' will make the developers name in steam a hyperlink to the address specified above in this case google
 
*'''icon''' tells steam where the icon can be found; In this case, in your mod folder: ''resource\GameIconSteam'' It should default to looking for icon_mymod.tga
 
== Making the Steam Icon ==
 
Open your favorite graphics-design or photo-editing software, and make a blank canvas with dimensions of 16*16 pixels. Make it transparent, if you'd like. Design your icon.
 
Save it as a .png to your ''C:\Program Files(x86)\steam\steamapps\SourceMods\mymod\resource\GameIconSteam'' mod folder as icon_mymod.png. Don't forget to replace "mymod" with your mod name!
 
Now navigate to that folder.
Open [http://www.mediafire.com/?h5m4mjmm3i5 AlphaConv]
*select Target format to be .tga
*Uncheck Convert only 32-bit images(with alpha channel)
*Drag and drop icon_mymod.png onto the program and it will convert it to the same folder
*delete the input file (icon_mymod.png)
 
== Making the Game.exe Icon ==
 
*Download and install IcoFx
 
Open it and like photoshop make an Image. Click on the Windows Icon near the top middle of the program...This generates an icon.
 
Now save it to your
''C:\Program Files\steam\steamapps\SourceMods\mymod\resource'' folder


{{note|Remember that you must call the icon game.ico or it will not work and it must be in the above folder}}
== Making the hl2.exe Icon ==
{{note|You may need to restart your computer to be able to make the icon visible on your desktop.}}
*Take your 256px icon and save it as an interlaced .png.
*Find a .ico converting website and make convert the .png to .ico.
*Download and save the .ico in {{code|\steamapps\sourcemods\''MODNAME''\resource}} as "game.ico".
Now you can {{key|RMB}} the mod in your steam library and create a desktop shortcut.


== Conclusion ==
== Editing the icon with XBLAH's Modding Tool ==


And that for the most part is how to get your game fully iconified
The mod icon can be edited with [[XBLAH's Modding Tool]] through a comprehensive UI without requiring the modder to mess with text files or resources.


restart steam to get your new icons loaded
<br/><span style="color: #FFFFFF; font-weight: bold">Where to find it</span><br/>
If you want to see your game.exe icon on the desktop rightclick on it and make a desktop shortcut inside steam...
This can be accessed within the tool through '''Mod > Game info'''.
{{note|Im pretty sure you need to restart the computer to see your new Game icon on the desktop }}
But if you cant wait start the game and alt+tab out of it and look down at the toolbar to see the icon on the program


I hope this helped
<br/><span style="color: #FFFFFF; font-weight: bold">How to use it</span><br/>
Dont forget to check out my Video tutorial of this process here
Right click the picture box next to the Icon label and click Load. Select the file path and extension and the tool will generate the icons at the correct sizes, add them to the resource path and update the gameinfo.


[http://www.youtube.com/watch?v=9OYe6Q7BnDI Youtube Tutorial]
[[File:XBLAH's Modding Tool - Gameinfo Icon.png]]

Latest revision as of 08:16, 12 July 2024

English (en)Русский (ru)Українська (uk)Translate (Translate)
Broom icon.png
This article or section needs to be cleaned up to conform to a higher standard of quality.
For help, see the VDC Editing Help and Wikipedia cleanup process. Also, remember to check for any notes left by the tagger at this article's talk page.

icon tells Steam where the icon can be found; In this case, in the resource folder: resource\game It should default to looking for icon.tga

Making an icon for your mod

Steam Library
Desktop and Enlarged

For the icon of your mod to show, there are two places it can be displayed: In your steam library and on your desktop. (right)

To make your icon you will need either:

Making the Steam Library Icon

To start open an image editor and create a new file with the dimensions 256x256 pixels. Then save your image as a .png in a folder (For example sourcemods/resource/icons_raw/) and name it icon_huge.

Copy the icon_huge and rename it to icon_big and scale it down to 32x32 and do it again but name it icon and scale it to 16x16.

After creating the icons, Open the icon file and save it as a targa file (.tga) in the sourcemods/YourMod/resource folder, do the same with icon_big and NOT with icon_huge.

Now once you have done all of that, the next step is to show the icon in the steam library. Go to your mods folder and open gameinfo.txt.

Below game, title, title2, and/or type, type icon "resource/icon", example:

"GameInfo"
{
	game		"My First HL2MP Mod"
	title		"HALF+LIFE'"
	title2		"deathmatch mod"
	type 		multiplayer_only
	icon		"resource/icon"
	nomodels 	0
	nohimodel 	1
	nocrosshair
	...

Now save and restart Steam and your icon should appear in the library.

Making the hl2.exe Icon

Note.pngNote:You may need to restart your computer to be able to make the icon visible on your desktop.
  • Take your 256px icon and save it as an interlaced .png.
  • Find a .ico converting website and make convert the .png to .ico.
  • Download and save the .ico in \steamapps\sourcemods\MODNAME\resource as "game.ico".

Now you can RMB the mod in your steam library and create a desktop shortcut.

Editing the icon with XBLAH's Modding Tool

The mod icon can be edited with XBLAH's Modding Tool through a comprehensive UI without requiring the modder to mess with text files or resources.


Where to find it
This can be accessed within the tool through Mod > Game info.


How to use it
Right click the picture box next to the Icon label and click Load. Select the file path and extension and the tool will generate the icons at the correct sizes, add them to the resource path and update the gameinfo.

XBLAH's Modding Tool - Gameinfo Icon.png