How to add weapon HUD image
Tutorial helps to add weapon hud images as developer does
Last updated
Tutorial helps to add weapon hud images as developer does
Last updated
Software you need:
Laighter - tool for generating normal maps.
Paint.Net - tool for drawing images (or any other image editor).
SLK_img2pixel - tool for converting images to a limited palette.
Hands Pack - PITO hands prefabs images
PITO Palettes - palettes for SLK_img2pixel tool
Let's made sawed-off shotgun (obrez)! First of all, search in google some screenshots from stalker games where player hold obrez in hands, save image, then search for item icon. Sounds for reloading and shot you can find in google or from unpacked stalker game. Just convert them to low quality mp3 size (32-64 kbps).
For the item icon reference I will use 48x16 w_ak.png file from assets/ui/items/, and will clear it and paste there founded obrez icon, image sampling must be closest neighbour. And save it as new file called "w_obrez.png"
Then open screenshot with hands from game, cleanup it, so background will be transparent.
Now save it as separate file and open SLK_img2pixel tool.
Press "Load image" button and open previously saved HUD image. In sample tab set to Relative, x div and y div to 2. Sample - Floor
Open Colors tab and load one of the palettes what I provide at the top of tutorial.
Dither set to No Dithering.
Open Process tab and set your weapon image as you want, like contrast, hue, saturation etc.
Go to the Load/Save tab and press "Save Image" button.
Open saved image in image editor, and correct hands colors to match a pito game original color palette/atmosphere.
Use hands pack to paste it into image and then edit or transform them until it suits the weapon.
Resize image to size that power by two. Like 96x48. Save it as w_obrez_hud.png to assets/ui/ folder.
Now it's time to generate normal map image that help hud to interact with level light.
Open Laighter tool.
Open obrez hud file by clicking square with arrow down icon at the top left corner.
Open hud file.
It's a little bit blurry, need to setup correct sampling, go to Visualization tab at the right side and check Pixelated checkbox.
Now set Mode from Texture to Normal Map.
Click at the image at center of screen
Then you will see, that all buttons and sliders is active now!
Check Use Alpha at the bottom left corner.
Now image looks correct.
At the left side of the workspace in Normal tab you can play with settings to make normal map looks good to you when it's interact with light. To test how it interact with it, change Visualization Mode from Normal Map to Preview.
You will see this:
If you zoom out, you'll see a light source that can be dragged around and changed it color. Middle mouse wheel button to drag around workspace, wheel up and down to zoom.
To change color, select light source and click on Color selector button in the Light group at the right side of Visualization tab.
When you will done with creating Normal Map - select image at center of workspace, then go to top left corner and click at squared with arrow up icon button to export image.
Export window will appear, select checkbox Original directory, it will save normal map file near w_obrez_hud.png file. Only check Normal checkbox and rename it from _n to _nm. Game use _nm suffix to apply normal map from file to selected hud.
Press export and close Laighter.
Congratulations! You've created weapon hud image with icon and normal map!
