User:DJFluXion/Sprites

From Valve Developer Community
< User:DJFluXion
Revision as of 06:58, 9 August 2018 by DJFluXion (talk | contribs) (Tutorial in progress)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Sprites, in the Source engine, are fixed, two dimensional, flat images that always appear facing the observer (player) in-game. Creating your own custom sprites is a very easy task; like regular textures, sprites also have a VTF file, for the sprite image/texture itself, and a VMT file to allow it to be used in Hammer.

As sprites are custom textures, they must be packed into the level with VIDE; otherwise, players will receive a missing texture error in place of the sprite (that only you see), when loading your map. Sprites must be placed in the materials folder in the directory of the respective game you're mapping for.

Creating a custom sprite

This tutorial will show you how to create a custom "glow" sprite. The game we will be using is TF2.

Things you'll need:

  1. Paint.NET and Nem's VTF file type plugin. You'll also need this plugin to center images.
  2. Notepad++. This one is optional, but I strongly recommend you use it.

Step 1: The Sprite Image

Open Paint.NET. Go to Image > Canvas Size and make an image with the dimensions 128x128.

Use the paint can, or the shape tool with the "Draw Filled Shape" option selected from the drop-down on the top left, and make the background completely black. Do not use a transparent alpha channel.

Next, mouse over the "Colors" window, hold down the shift key, and drag the color picker horizontally all the way to the right. Your color should now be pure red. You can also select this color from the predefined colors palette.

Set the Brush Size to 75, and the Hardness to 0%. Create a new layer (ctrl+shift+n), and click once roughly in the center of the image. Go to Effects > Object Align > Center Both to ensure that the brush stroke you just made is truly in the center. Chances are, you may not see a difference, but this is a good safety measure. Then double click on the layer with the red brush stroke and set the transparency/opacity to 180.

Create a new layer, set the hardness to 100% and the brush size to 4. Click roughly in the center of the image and use the "Center Both" command again in the Effects menu. In Paint.NET Ctrl+F repeats the last used effect, along with the same settings previously used in the effect.

Ctrl+Shift+F to flatten the image down to one layer. The resulting image should resemble HAL 9000's camera eye from 2001: A Space Odyssey.

Exporting the sprite image to VTF

In progress...