This article relates to the game "Team Fortress 2". Click here for more information.
This article's documentation is for anything that uses the Source engine. Click here for more information.

Team Fortress 2/Your First Map: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
No edit summary
Line 1: Line 1:
{{LanguageBar}}
{{LanguageBar}}  
{{DISPLAYTITLE:Your First Map}}
{{DISPLAYTITLE:Your First Map}}


{{TF2 topicon}}{{source topicon}}[[Category:Hammer]][[Category:Level Design]][[Category:Team Fortress 2|Your first map]]
{{TF2 topicon}}{{source topicon}}[[Category:Hammer]][[Category:Level Design]][[Category:Team Fortress 2|Your first map]]
<!--I quoted a lot from "Level Design Introduction/Your First Level (Portal 2)".-->
<!--Quoted a lot from "Level Design Introduction/Your First Level (Portal 2)".-->
In {{tf2|4}}, players can play lot of community maps, such as jump, dodgeball, MGE, trading maps, training maps, etc. Even if you are just vaguely trying to do map making, there will be a type of map you want to make. This article will cover common needs across various maps. Anyone running {{Hammer|2}} for the first time is the intended audience for this article. Whether you use Hammer or {{Hammer++|2}}, either is fine.


== Getting started ==
In {{tf2|4}}, players can enjoy a wide variety of community-made maps, including jump maps, dodgeball, MGE, trading maps, training maps, and more. Even if you're only vaguely interested in map creation, there's probably a type of map you're eager to build. This article covers the basics common to all types of maps. It’s intended for anyone launching {{Hammer|2}} for the first time. Whether you're using the standard Hammer editor or {{Hammer++|2}}, either one will work just fine.
The Hammer editor is built in TF2. Refer to [[Getting Started]] for running Source's level editor.


== Create main stage and applying a skybox ==
== Getting Started ==
=== Make a cube ===
The Hammer editor is built into TF2. Refer to [[Getting Started]] to learn how to launch the Source level editor.
 
== Creating a Play Area and Adding a Skybox ==
 
=== Making a Cube ===
[[File:l4d_hammer_brush_01.jpg|thumb|right|300px|caption|Drawing a brush.]]
[[File:l4d_hammer_brush_01.jpg|thumb|right|300px|caption|Drawing a brush.]]


Before dealing with this topic, We need to think about what a sky is in the Source engine. Many Source engine game users imagine a world is a flat platform and there is an open space above it. However, Source engine maps are actually in a box! When players see a wallpaper with a picture of the sky on it, they think it's the sky. Now let's implement this. Let's create a cube-shaped world.
Before we jump in, let’s talk about how the sky works in the Source engine. Many players imagine the world as a flat surface with open sky above, but Source maps are actually built inside a sealed box! What looks like the sky is really a texture applied to the ceiling. Let’s recreate that now by making a cube-shaped world.


# Press {{key|Shift}}+{{key|B}}, or select the [[File:Hammer block.png]] "Block Tool" in the left toolbar.
# In the '''Top''' 2D view, left-click and drag from the top-left toward the bottom-right.
# As you drag, you'll see a dotted outline forming a rectangle or square.
# Make a 512×512 square, and make sure it’s visible in the '''Top''', '''Right''', and '''Side''' viewports.
# Press {{key|Enter}} to create the brush you've drawn.


# Press {{key|Shift}}+{{key|B}} or select the [[File:Hammer block.png]] "Block tool" in the left tool bar.
{{note|Hold {{key|Space}} and drag to move the 2D camera view.}}
# Left-click and drag in the '''Top''' 2D view in a movement that is ''Right'' and ''Downward'' as shown below.
# You should see a dotted outline of a rectangle or square as you drag.
# Create a square 512x512 units and let go of the left-mouse button. Please make the 512x512 square visible not only at '''Top''' but also at '''Right''' and '''Downward''' viewport.
# Press {{key|Enter}} on your keyboard to create this brush that you've just drawn.


{{note|space and drag can move 2D camera view}}
{{clr}}


{{clr}}
=== Making It Hollow ===
[[File:Hammer make hollow.png|thumb|right|400px|caption|Make it empty.]]


=== Dig It! ===
Now let’s hollow it out.
[[File:Hammer make hollow.png|thumb|right|400px|caption|make it empty.]]
Now it's time to dig inside.


# To go back to selection mode, click on the [[File:Hammer select.png]] '''Selection tool''' icon on the '''Tool''' bar or press the {{key|Esc}} key.
# Click the [[File:Hammer select.png]] '''Selection Tool''' or press {{key|Esc}} to return to selection mode.
# Right-click the "x" in the center of the square to select it. Left-click, then choose '''Make Hollow'''. Set the thickness to 16.
# Right-click the "x" in the center of your cube to select it. Left-click again and choose '''Make Hollow'''. Set thickness to 16 units.


A new cube is created inside the cube.
This will create inner walls, forming a playable hollow space.


{{note|There is no need to blindly use '''make hollow'''. You can also build the walls, floor, and ceiling one by one using the '''Block Tool'''.}}
{{note|You don’t have to use '''Make Hollow'''. You can also build the walls, floor, and ceiling manually with the '''Block Tool'''.}}


{{clr}}
{{clr}}


=== Navigating in the 3D Camera viewport ===
=== Navigating the 3D Camera Viewport ===
Moving around in 3D is a bit different from the 2D viewports:


* Hold down {{key|Space}} and left-click and drag to '''rotate''' the camera.
3D navigation differs slightly from the 2D views:
* Hold down {{key|Space}} and right-click and drag to move '''up/down''' and '''left/right'''.
* Hold down {{key|Space}} and both right and left-click and drag to move '''forward''' and '''backward'''.
* You can also use the {{key|W}}{{key|A}}{{key|S}}{{key|D}} keys to move '''forward''', '''backward''', '''strafe left''' and '''strafe right''' respectively.
* The {{key|Z}} key toggles on and off "mouse look" mode. Move your mouse cursor over the 3D Camera viewport and press the {{key|Z}} key. You can now move your mouse around as if mouse look was on in the game.


{{note|The {{key|W}}{{key|A}}{{key|S}}{{key|D}} keys can be used in combination with the {{key|Space}} navigation}}
* Hold {{key|Space}} and left-click + drag to '''rotate''' the camera.
* Hold {{key|Space}} and right-click + drag to move '''up/down''' and '''left/right'''.
* Hold {{key|Space}}, left + right-click + drag to move '''forward/backward'''.
* Use {{key|W}}, {{key|A}}, {{key|S}}, and {{key|D}} to move like in-game (forward, back, strafe left/right).
* Press {{key|Z}} in the 3D viewport to toggle "mouse look" mode, allowing free camera rotation with your mouse.
 
{{note|You can combine {{key|W}}{{key|A}}{{key|S}}{{key|D}} movement with {{key|Space}} navigation for more control.}}


{{clr}}
{{clr}}


 
=== Applying a Skybox Texture ===
=== Apply Skybox ===
[[File:Hammer face sheet.png|left|300px]]
[[File:Hammer face sheet.png|left|300px]]
[[File:Hammer Texture search.png|right|thumb|700px|caption|tools/toolsskybox]]
[[File:Hammer Texture search.png|right|thumb|700px|caption|tools/toolsskybox]]


Now we are gonna put on the skybox.
Let’s apply the sky texture.


# Move the camera view into the cube.
# Move your 3D camera inside the cube.
# Select Toggle Texture application with {{key|Shift}}+{{key|A}}
# Press {{key|Shift}}+{{key|A}} to activate the Texture Application Tool.
# Select face of the cube inside.
# Click a face inside the cube.
# In the face edit sheet, click '''Browse...'''.
# In the Face Edit Sheet, click '''Browse...'''


Search for {{code|tools/toolsskybox}}. Typing "tools" in the filter can help narrow it down.


Search {{code|tools/toolsskybox}}. You can find it more easily by typing '''tools''' in the filter field.
Once selected, apply it to the ceiling (or whichever surface you want to act as the sky). You can also set it as the current texture to use it more easily later.


Once you have selected the skybox, apply it to the surface you want to apply it to. Using '''current texture''' will make your work easier.
Any face with the {{code|toolsskybox}} texture will appear as sky in-game.


The side to which {{code|toolsskybox}} is applied becomes the sky.
{{clr}}
{{clr}}


== Make starting locate ==
== Adding a Player Spawn Point ==
Now let's go into the game. Source games require an entity to spawn players.
 
Let’s add a spawn point so we can enter the map.
 
# Select the [[File:Hammer entity.png]] '''Entity Tool''' using {{key|Shift}}+{{key|E}} or from the '''Tool''' Bar.
# Click in the center of your cube to place the entity.
 
=== The Grid ===
 
All 2D views use a grid. Objects snap to the grid by default, which helps avoid bugs like leaks. It’s best to leave this setting on.
 
The default grid size is 64 units. This value is shown in the status bar at the bottom of the Hammer window.


# Select the [[File:Hammer entity.png]] '''Entity Tool''' by hitting {{key|Shift}}+{{key|E}} or selecting on the '''Tool''' Bar.
* Click the '''Smaller Grid''' icon [[File:hammer_SmallerGrid.png]] or press {{key|[}} to reduce the grid size for precision.
# Stand it on center of square.
* Click the '''Larger Grid''' icon [[File:hammer_LargerGrid.png]] or press {{key|]}} to increase the grid size for faster layout.


=== The grid ===
To reduce the grid to 16 units, press {{key|[}} twice. Confirm it says '''Grid: 16''' in the bottom-right of the Hammer window.
A grid is displayed in all the 2D views. By default, all objects snap to the grid. Although you can turn this off, it is considered good practice to leave it on because it prevents leaks and other errors in your map.


The default grid size is 64 units, which means that each line is 64 units apart. The current size of the grid is displayed in the status bar at the bottom of the Hammer window.
=== Back to the Spawn Entity ===


* Clicking the '''Smaller Grid''' icon [[File:hammer_SmallerGrid.png]] will make the grid half as big, for finer adjustments. You can also decrease the grid size with the {{key|[}} key
Now, select the entity using the Selection Tool.
* Clicking the '''Larger Grid''' icon [[File:hammer_LargerGrid.png]] will make the grid twice as big, for larger adjustments. You can also increase the grid size with the {{key|]}} key.


To bring the grid size down to 16 units, press the {{key|[}} key twice. Look at the '''Status bar''' at the bottom right of the Hammer window and make sure it reads '''Grid: 16'''. If it doesn't, press {{key|[}} or {{key|]}} until is does.
{{note|Entities have a small '''x''' near their base—click there to select them.}}


=== Going back to the main topic ===
[[File:Hammer obj properties.png|500px|caption|Select {{code|info_player_teamspawn}}]]{{clr}}
Select the entity by using the Selection Tool.
{{note|Entities also have an '''x''' slightly below their waist. Click there to select it.}}


Let’s configure it.


[[File:Hammer obj properties.png|500px|caption|select {{code|info_player_teamspawn}}]]{{clr}}
Press {{key|Alt}}+{{key|Enter}}, or right-click the entity and choose '''Properties'''.
Now it's time to set its properties.


Press {{key|Alt}}+{{key|Enter}}, or right-click and enter '''Properties'''.
Change the class name to {{code|info_player_teamspawn}}.


Change the entity name to {{code|info_player_teamspawn}}.
== Compiling and Running the Map ==


== Compile and Run ==
Once your map is ready, press F9 to compile it.
When everything is ready and finalized, press F9 to compile.
If you want to try your map, move the BSP file to {{code|[your Steam Directory]\steamapps\common\Team Fortress 2\tf\maps}}


Then in the TF2 client, click on "Create Server" and search for your map to start. Make sure Steam Networking is disabled if you want to stop players from joining your server!
To test it, move the compiled BSP file to:
{{code|[your Steam Directory]\steamapps\common\Team Fortress 2\tf\maps}}


Then launch TF2, click "Create Server", and find your map in the list.


[[File:Skybox demostrare1.jpg|700px]]
[[File:Skybox demostrare1.jpg|700px]]


As you can see, we did well.
And there you have it—your first map!


{{navbar2|Team Fortress 2/Your First Map|Your First Map|Team Fortress 2 Maping tutorial|Team Fortress 2 Maping|Team Fortress 2/Building Respawn Room|Building Respawn Room}}
{{navbar2|Team Fortress 2/Your First Map|Your First Map|Team Fortress 2 Mapping tutorial|Team Fortress 2 Mapping|Team Fortress 2/Building Respawn Room|Building Respawn Room}}

Revision as of 03:09, 26 May 2025

English (en)Translate (Translate)


In Team Fortress 2 Team Fortress 2, players can enjoy a wide variety of community-made maps, including jump maps, dodgeball, MGE, trading maps, training maps, and more. Even if you're only vaguely interested in map creation, there's probably a type of map you're eager to build. This article covers the basics common to all types of maps. It’s intended for anyone launching Hammer Hammer for the first time. Whether you're using the standard Hammer editor or Hammer++ Hammer++, either one will work just fine.

Getting Started

The Hammer editor is built into TF2. Refer to Getting Started to learn how to launch the Source level editor.

Creating a Play Area and Adding a Skybox

Making a Cube

Drawing a brush.

Before we jump in, let’s talk about how the sky works in the Source engine. Many players imagine the world as a flat surface with open sky above, but Source maps are actually built inside a sealed box! What looks like the sky is really a texture applied to the ceiling. Let’s recreate that now by making a cube-shaped world.

  1. Press Shift+B, or select the Hammer block.png "Block Tool" in the left toolbar.
  2. In the Top 2D view, left-click and drag from the top-left toward the bottom-right.
  3. As you drag, you'll see a dotted outline forming a rectangle or square.
  4. Make a 512×512 square, and make sure it’s visible in the Top, Right, and Side viewports.
  5. Press Enter to create the brush you've drawn.
Note.pngNote:Hold Space and drag to move the 2D camera view.

Making It Hollow

Make it empty.

Now let’s hollow it out.

  1. Click the Hammer select.png Selection Tool or press Esc to return to selection mode.
  2. Right-click the "x" in the center of your cube to select it. Left-click again and choose Make Hollow. Set thickness to 16 units.

This will create inner walls, forming a playable hollow space.

Note.pngNote:You don’t have to use Make Hollow. You can also build the walls, floor, and ceiling manually with the Block Tool.

Navigating the 3D Camera Viewport

3D navigation differs slightly from the 2D views:

  • Hold Space and left-click + drag to rotate the camera.
  • Hold Space and right-click + drag to move up/down and left/right.
  • Hold Space, left + right-click + drag to move forward/backward.
  • Use W, A, S, and D to move like in-game (forward, back, strafe left/right).
  • Press Z in the 3D viewport to toggle "mouse look" mode, allowing free camera rotation with your mouse.
Note.pngNote:You can combine WASD movement with Space navigation for more control.

Applying a Skybox Texture

Hammer face sheet.png
tools/toolsskybox

Let’s apply the sky texture.

  1. Move your 3D camera inside the cube.
  2. Press Shift+A to activate the Texture Application Tool.
  3. Click a face inside the cube.
  4. In the Face Edit Sheet, click Browse...

Search for tools/toolsskybox. Typing "tools" in the filter can help narrow it down.

Once selected, apply it to the ceiling (or whichever surface you want to act as the sky). You can also set it as the current texture to use it more easily later.

Any face with the toolsskybox texture will appear as sky in-game.

Adding a Player Spawn Point

Let’s add a spawn point so we can enter the map.

  1. Select the Hammer entity.png Entity Tool using Shift+E or from the Tool Bar.
  2. Click in the center of your cube to place the entity.

The Grid

All 2D views use a grid. Objects snap to the grid by default, which helps avoid bugs like leaks. It’s best to leave this setting on.

The default grid size is 64 units. This value is shown in the status bar at the bottom of the Hammer window.

  • Click the Smaller Grid icon Hammer SmallerGrid.png or press [ to reduce the grid size for precision.
  • Click the Larger Grid icon Hammer LargerGrid.png or press ] to increase the grid size for faster layout.

To reduce the grid to 16 units, press [ twice. Confirm it says Grid: 16 in the bottom-right of the Hammer window.

Back to the Spawn Entity

Now, select the entity using the Selection Tool.

Note.pngNote:Entities have a small x near their base—click there to select them.

Select info_player_teamspawn

Let’s configure it.

Press Alt+ Enter, or right-click the entity and choose Properties.

Change the class name to info_player_teamspawn.

Compiling and Running the Map

Once your map is ready, press F9 to compile it.

To test it, move the compiled BSP file to: [your Steam Directory]\steamapps\common\Team Fortress 2\tf\maps

Then launch TF2, click "Create Server", and find your map in the list.

Skybox demostrare1.jpg

And there you have it—your first map!