User:DJFluXion/Sprites: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
(Tutorial in progress)
 
(Redirected page to User:VectorFluxion/Sprites)
Tag: New redirect
 
(3 intermediate revisions by 2 users not shown)
Line 1: Line 1:
[[Sprites]], in the Source engine, are fixed, two dimensional, flat [[texture|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]].
#redirect [[User:VectorFluxion/Sprites]]
 
As sprites are custom textures, they must be packed into the level with [[VIDE]]; otherwise, players will receive a [[missing content|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:
 
#[https://www.getpaint.net/ Paint.NET] and [http://nemesis.thewavelength.net/index.php?p=50 Nem's VTF file type plugin]. You'll also need [https://forums.getpaint.net/topic/8375-drop-shadow-and-other-effects-krisvdms-plugin-pack-updated-2010-10-26/ this plugin] to center images.
#[https://notepad-plus-plus.org/ 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 <font color="red">'''red.'''</font> 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...

Latest revision as of 20:44, 7 November 2020