Frictional Game Wiki

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.

<h1>Level Editor 101 - Basics to Advanced</h1>
<div class="level1">

</div>

<h2>Foreword</h2>
<div class="level2">

<p>
I know this first one is going to look a bit like a large wall of text, I'm sorry, but there's not much to show off in pictures when it comes to interface. There will be plenty of pictures later, though.
</p>

<p>
This tutorial will cover both beginner and advanced methods for the majority of things in the level editor. Even if you have no experience with modding, you should be able to follow these tutorials. If you can't, either you skipped a section of the tutorial, or there's something wrong with my tutorial. You can PM me on the FG forum (Kiandra) and let me know what I need to clarify.
</p>

<p>
For the sake of not swamping everyone with everything, I'm going to start with the absolute basics. If you haven't downloaded the level editing suite, you can do so <a href="http://wiki.frictionalgames.com/hpl2/tools/start" class="urlextern" title="http://wiki.frictionalgames.com/hpl2/tools/start"  rel="nofollow">here</a>. There are adequate instructions on the linked page on how to download and install the editing suite, so I won't be covering that in this tutorial.
</p>

<p>
If you wish to add to this page or would like to see your tutorial in the Useful Links Section (coming soon), feel free to edit this page and give yourself credit. Just try to stick with the same format used by the rest of the tutorial.
</p>

</div>

<h1>Part 1: The Level Editor's Interface</h1>
<div class="level1">

<p>
Okay, so I'm hoping you know where the level editor is. For windows users, like me, it's C:/Program Files (x86)/Amnesia - The Dark Descent/redist just double-click on the level editor application <em>not the PDB file </em> to get started.
</p>

</div>

<h2>Part 1A: Level Editor Buttons</h2>
<div class="level2">

<p>
<img src="/lib/exe/fetch.php?w=471&h=330&tok=b88f7c&media=hpl2:tutorials:level_editor:woah.jpg" class="medialeft" title="woah.jpg" alt="woah.jpg" width="471" height="330" />So what is this thing, exactly? It's a lot of buttons! We'll go through each one of them in a bit of detail. Don't panic about needing to know all of them right off the bat, I'll refer back to the hotkeys and appearances of the buttons every time they're used in the basic tutorials. You'll become more familiar with them as you use them.
</p>

<p>
As we go through them, I will start with the buttons in the left side-bar and move counter-clockwise to the bottom bar, then right side-bar, then the top menu. It would be beneficial if you follow along in the level editor and click on the buttons or press the hotkeys when they're mentioned.
</p>

<p>
Don't worry if your screen doesn't look exactly like mine. I have the perspective viewport enlarged (you can do this by hovering your cursor over the bottom right quadrant and pressing spacebar). To enlarge the pictures beside each tool, you can right-click and select Open Image in New Tab.
</p>

<p>
We'll go over each of these buttons in more detail as they become relevant.
</p>

</div>

<h3>Left Menu Bar</h3>
<div class="level3">

<p>
<b>1. Select Tool</b><a href="/lib/exe/fetch.php?tok=269809&media=http%3A%2F%2Ffc08.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2F0%2F3%2Fselecttool_by_rueppells_fox-d66ofdh.jpg" class="media" title="http://fc08.deviantart.net/fs70/f/2013/146/0/3/selecttool_by_rueppells_fox-d66ofdh.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=6e23a4&media=http%3A%2F%2Ffc08.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2F0%2F3%2Fselecttool_by_rueppells_fox-d66ofdh.jpg" class="mediaright" title="selecttool_by_rueppells_fox-d66ofdh.jpg" alt="selecttool_by_rueppells_fox-d66ofdh.jpg" width="117" height="80" /></a>
</p>

<p>
Hotkey: 1 <br/>

Button Appearance: White, triangle-shaped pointer <br/>

What it does: You can click on anything and move it, duplicate it, turn it, or stretch it <br/>

<br/>

<b>2. Lights</b><a href="/lib/exe/fetch.php?tok=2630d3&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2F2%2F7%2Flights_by_rueppells_fox-d66ogoj.jpg" class="media" title="http://fc01.deviantart.net/fs70/f/2013/146/2/7/lights_by_rueppells_fox-d66ogoj.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=5a65fe&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2F2%2F7%2Flights_by_rueppells_fox-d66ogoj.jpg" class="mediaright" title="lights_by_rueppells_fox-d66ogoj.jpg" alt="lights_by_rueppells_fox-d66ogoj.jpg" width="117" height="80" /></a><br/>

Hotkey: 2 <br/>

Button Appearance: Yellow light bulb <br/>

What it does: allows you to add lights so your map isn't a pitch black when you load it <br/>

<br/>

<b>3. Billboards </b><a href="/lib/exe/fetch.php?tok=f2f1d7&media=http%3A%2F%2Ffc07.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F9%2Ff%2Fbillboards_by_rueppells_fox-d66oigz.jpg" class="media" title="http://fc07.deviantart.net/fs71/f/2013/146/9/f/billboards_by_rueppells_fox-d66oigz.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=3de6a1&media=http%3A%2F%2Ffc07.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F9%2Ff%2Fbillboards_by_rueppells_fox-d66oigz.jpg" class="mediaright" title="billboards_by_rueppells_fox-d66oigz.jpg" alt="billboards_by_rueppells_fox-d66oigz.jpg" width="117" height="80" /></a><br/>

Hotkey: 3 <br/>

Button Appearance: White rectangle <br/>

What it does: The stream-like things coming from the window as displayed in  <a href="http://fc01.deviantart.net/fs71/f/2013/068/6/8/lillian_by_rueppells_fox-d5xhoaf.jpg" class="urlextern" title="http://fc01.deviantart.net/fs71/f/2013/068/6/8/lillian_by_rueppells_fox-d5xhoaf.jpg"  rel="nofollow">this link</a>. <br/>

<br/>

<b>4. Particles</b> <a href="/lib/exe/fetch.php?tok=7613ae&media=http%3A%2F%2Ffc00.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F6%2F3%2Fparticlesystem_by_rueppells_fox-d66ojf8.jpg" class="media" title="http://fc00.deviantart.net/fs71/f/2013/146/6/3/particlesystem_by_rueppells_fox-d66ojf8.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=54d1fc&media=http%3A%2F%2Ffc00.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F6%2F3%2Fparticlesystem_by_rueppells_fox-d66ojf8.jpg" class="mediaright" title="particlesystem_by_rueppells_fox-d66ojf8.jpg" alt="particlesystem_by_rueppells_fox-d66ojf8.jpg" width="117" height="80" /></a><br/>

Hotkey: 4 <br/>

Button Appearance: Blue atom-like thing <br/>

What it does: Makes neat special effects like fire, smoke, fog, dust, and water droplets <br/>

<br/>

<b>5. Sounds</b> <a href="/lib/exe/fetch.php?tok=13d95e&media=http%3A%2F%2Ffc07.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2Fa%2F3%2Fsounds_by_rueppells_fox-d66ojy2.jpg" class="media" title="http://fc07.deviantart.net/fs70/f/2013/146/a/3/sounds_by_rueppells_fox-d66ojy2.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=d28b59&media=http%3A%2F%2Ffc07.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2Fa%2F3%2Fsounds_by_rueppells_fox-d66ojy2.jpg" class="mediaright" title="sounds_by_rueppells_fox-d66ojy2.jpg" alt="sounds_by_rueppells_fox-d66ojy2.jpg" width="117" height="80" /></a><br/>

Hotkey: 5 <br/>

Button Appearance: Grey megaphone <br/>

What it does: Places different, looping sound effects (like ambient noise) around the map, causing a 3D effect with the sound <br/>

<br/>

<b>6. Static Objects</b><a href="/lib/exe/fetch.php?tok=589e29&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2Fa%2Fb%2Fstatic_objects_by_rueppells_fox-d66okdx.jpg" class="media" title="http://fc01.deviantart.net/fs71/f/2013/146/a/b/static_objects_by_rueppells_fox-d66okdx.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=839222&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2Fa%2Fb%2Fstatic_objects_by_rueppells_fox-d66okdx.jpg" class="mediaright" title="static_objects_by_rueppells_fox-d66okdx.jpg" alt="static_objects_by_rueppells_fox-d66okdx.jpg" width="117" height="80" /></a><br/>

Hotkey: 6 <br/>

Button Appearance: Red Lego brick <br/>

What it does: Brings up a menu on that large blank right-hand column which will let you place in objects that cannot be interacted with, such as walls, pillars, door frames, stairs, and railings. <br/>

<br/>

<b>7. Entities</b><a href="/lib/exe/fetch.php?tok=0a8c01&media=http%3A%2F%2Ffc08.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2Fd%2F9%2Fentites_by_rueppells_fox-d66okvt.jpg" class="media" title="http://fc08.deviantart.net/fs70/f/2013/146/d/9/entites_by_rueppells_fox-d66okvt.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=e139eb&media=http%3A%2F%2Ffc08.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2Fd%2F9%2Fentites_by_rueppells_fox-d66okvt.jpg" class="mediaright" title="entites_by_rueppells_fox-d66okvt.jpg" alt="entites_by_rueppells_fox-d66okvt.jpg" width="117" height="80" /></a><br/>

Hotkey: 7 <br/>

Button Appearance: A little white ghost <br/>

What it does: Brings up the menu for objects which can be interacted with (mostly), such as furniture, paintings, lamps, monsters, tinder boxes, lanterns, in-game items, and notes <br/>

<br/>

<b>8. Areas</b> <a href="/lib/exe/fetch.php?tok=f0edf6&media=http%3A%2F%2Ffc04.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2Fd%2F8%2Fareas_by_rueppells_fox-d66omx2.jpg" class="media" title="http://fc04.deviantart.net/fs70/f/2013/146/d/8/areas_by_rueppells_fox-d66omx2.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=d7f423&media=http%3A%2F%2Ffc04.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2Fd%2F8%2Fareas_by_rueppells_fox-d66omx2.jpg" class="mediaright" title="areas_by_rueppells_fox-d66omx2.jpg" alt="areas_by_rueppells_fox-d66omx2.jpg" width="117" height="80" /></a><br/>

Hotkey: 8 <br/>

Button Appearance: Transparent-looking box <br/>

What it does: creates the<u>super</u><u>important</u> player start areas, script areas, ladder areas, water areas, etc <br/>

<br/>

<b>9. Primitives</b> <a href="/lib/exe/fetch.php?tok=198b43&media=http%3A%2F%2Ffc08.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2F3%2Fb%2Fprimitives_by_rueppells_fox-d66oneb.jpg" class="media" title="http://fc08.deviantart.net/fs70/f/2013/146/3/b/primitives_by_rueppells_fox-d66oneb.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=d32dc4&media=http%3A%2F%2Ffc08.deviantart.net%2Ffs70%2Ff%2F2013%2F146%2F3%2Fb%2Fprimitives_by_rueppells_fox-d66oneb.jpg" class="mediaright" title="primitives_by_rueppells_fox-d66oneb.jpg" alt="primitives_by_rueppells_fox-d66oneb.jpg" width="117" height="80" /></a><br/>

Hotkey: 9 <br/>

Button Appearance: A cone and a cylinder <br/>

What it does: Places in the visual effect for deep and large pools of water, add ceilings, floors, and ground to large areas with more texture options, pretty much whatever you think a flat piece of repeating pattern could be useful for <br/>

<br/>

<b>10. Decals</b> <a href="/lib/exe/fetch.php?tok=f4a74f&media=http%3A%2F%2Ffc00.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F7%2F1%2Fdecals_by_rueppells_fox-d66onow.jpg" class="media" title="http://fc00.deviantart.net/fs71/f/2013/146/7/1/decals_by_rueppells_fox-d66onow.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=46c9a0&media=http%3A%2F%2Ffc00.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F7%2F1%2Fdecals_by_rueppells_fox-d66onow.jpg" class="mediaright" title="decals_by_rueppells_fox-d66onow.jpg" alt="decals_by_rueppells_fox-d66onow.jpg" width="117" height="80" /></a><br/>

Hotkey: 0 <br/>

Button Appearance: A black goo splat <br/>

What it does: Allows you to place images that wrap around surfaces, such as blood and dirt stains <br/>

<br/>

<b>11. Fog Areas</b> <a href="/lib/exe/fetch.php?tok=3088d1&media=http%3A%2F%2Ffc07.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F4%2F5%2Ffogarea_by_rueppells_fox-d66ooim.jpg" class="media" title="http://fc07.deviantart.net/fs71/f/2013/146/4/5/fogarea_by_rueppells_fox-d66ooim.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=092296&media=http%3A%2F%2Ffc07.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2F4%2F5%2Ffogarea_by_rueppells_fox-d66ooim.jpg" class="mediaright" title="fogarea_by_rueppells_fox-d66ooim.jpg" alt="fogarea_by_rueppells_fox-d66ooim.jpg" width="117" height="80" /></a><br/>

Hotkey: Ctrl+1 <br/>

Button Appearance: Cloud <br/>

What it does: Creates an area filled with fog <br/>

<br/>

<b>12. Combine</b> <a href="/lib/exe/fetch.php?tok=e1afcf&media=http%3A%2F%2Ffc06.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2Fb%2Ff%2Fcombine_by_rueppells_fox-d66oot3.jpg" class="media" title="http://fc06.deviantart.net/fs71/f/2013/146/b/f/combine_by_rueppells_fox-d66oot3.jpg"><img src="/lib/exe/fetch.php?w=117&h=80&tok=0cd4bf&media=http%3A%2F%2Ffc06.deviantart.net%2Ffs71%2Ff%2F2013%2F146%2Fb%2Ff%2Fcombine_by_rueppells_fox-d66oot3.jpg" class="mediaright" title="combine_by_rueppells_fox-d66oot3.jpg" alt="combine_by_rueppells_fox-d66oot3.jpg" width="117" height="80" /></a><br/>

Hotkey: Ctrl+2 <br/>

Button Appearance: two arrows, a blue and a red, facing each other
</p>

</div>

<h3>Bottom Menu Bar</h3>
<div class="level3">

<p>
<b>1. Grid Planes</b>
</p>

<p>
Hotkey: none <br/>

Button Appearance: an XY, YZ, or XZ depending on which plane you're using <br/>

What it does: cycles through grid planes - changes how objects move when you're placing them (vertical or horizontal) <br/>

<br/>

<b>2. Toggle Grid Snapping </b> <br/>

Hotkey: none <br/>

Button Appearance: U-magnet <br/>

What it does: changes whether objects will "snap" to the grid (move in multiples of 0.25). When it's deselected, you can move objects by multiples of 0.001 <br/>

<br/>

<b>3. Height </b> <br/>

Hotkey: none <br/>

Button Appearance: White text box with a 0 in it currently <br/>

What it does: changes the height of the grid. Standard walls in amnesia are 4 tall and 4 wide. You can change whether the grid is visible by pressing G <br/>

<br/>

<b>4. Snap Separation</b> <br/>

Hotkey: none <br/>

Button Appearance: White text box with 0.25 currently in it <br/>

What it does: changes the distance between grid spaces (precision of grid-snapping), most useful as 0.125 or 0.25 <br/>

<br/>

<b>5. Enlarge Current Viewport</b> <br/>

Hotkey: Spacebar <br/>

Button Appearance: Two white boxes stacked on each other <br/>

What it does: makes the box which is highlighted red (because your cursor is hovering over it) fill up the screen <br/>

<br/>

<b>6. A - Ambient Light </b> <br/>

Hotkey: None <br/>

Button Appearance: A capital A <br/>

What it does: Toggles between having the ambient boxlight; the one that makes everything evenly bright so there's no black-holes-of-doom (more on these later) <br/>

<br/>

<b>7. Global Pointlight</b> <br/>

Hotkey: None <br/>

Button Appearance: A capital P <br/>

What it does: Toggles the global pointlight; this one enhances normal maps. Translation: it makes flat things look 3D.
</p>

<p>
Note: the global pointlight and ambient light do not show up in-game; only in the level editor <br/>

<br/>

<b>8. Focus</b> <br/>

Hotkey: F <br/>

Button Appearance: A capital F <br/>

What it does: zooms the camera so that the selected object fills your view. This button is indispensable if you don't have a mouse or middle mouse button (the one used to pan) <br/>

<br/>

<b>9. Lock Tracking Grid</b> <br/>

Hotkey: None <br/>

Button Appearance: An LT <br/>

What it does: Your view will move according to the grid's height if this is selected <br/>

<br/>

<b>10. Clip Planes</b> <br/>

Hotkey: None <br/>

Button Appearance: The +/- buttons beside the drop-down menu <br/>

What it Does: Causes certain parts of the map to turn invisible; useful when you're making very large maps and file size is causing lag <br/>

<br/>

<b>11. Faded Buttons</b> <br/>

Hotkeys: None <br/>

Button Appearance: The faded buttons which become more distinct when a clip plane is created. We'll go over these in detail later.
</p>

</div>

<h3>Right Side-Bar Menu</h3>
<div class="level3">

<p>
The large, dark-grey area is where item-specific menus will show up. Each of these menus will be covered as they become relevant; I don't want to throw too much information at you all at once :p<br/>

<b>Select Object Type </b> <br/>

<b>Co</b> = grouped objects <br/>

<b>Li</b> = lights <br/>

<b>Bi</b> = billboards <br/>

<b>Pa</b> = particle systems <br/>

<b>So</b> = sound <br/>

<b>St</b> = static object <br/>

<b>En</b> = entities <br/>

<b>Ar</b> = area <br/>

<b>Pr</b> = primitive <br/>

<b>De</b> = decal <br/>

<b>Fo</b> = fog area
</p>

</div>

<h3>Edit Menu</h3>
<div class="level3">

<p>
<b>Undo</b>
</p>

<p>
Hotkey: Ctrl+Z <br/>

What it Does: Undoes your previous actions, including selections and focusing on objects <br/>

<br/>

<b>Redo </b> <br/>

Hotkey: Ctrl+Y <br/>

What it Does: Reverses Undo <br/>

<br/>

<b>Delete</b> <br/>

Hotkey: Backspace or Delete <br/>

What it Does: Deletes selected object(s) <br/>

<br/>

<b>Duplicate </b> <br/>

Hotkey: Ctrl+D <br/>

What it Does: Replicates selected object(s) <br/>

<br/>

<b>Create/Destroy Compound</b> <br/>

Hotkey: B <br/>

What it Does: Groups objects together so that selecting one of them will select all of them; compounds are outlined in red <br/>

<br/>

<b>Find Objects</b> <br/>

Hotkey: Ctrl+F <br/>

What it Does: brings up a search menu so you can find objects by type or name <br/>

<br/>

<b>Browse Groups</b> <br/>

Hotkey: none <br/>

What it Does: Allows you to search up and manage specific compounds <br/>

<br/>

<b>Level Settings</b> <br/>

Hotkey: none <br/>

What it Does: There are several functions. The <em>Skybox</em> menu allows you to select a skybox. Indoor maps do not need skyboxes unless the windows are transparent. It's just a waste of memory. <em>Fog </em> toggles the global fog and all its variables. It's like a never-ending fog area. <em>Decals </em> changes the maximum number of triangles allowed in your decals. Translation: changes how much memory and how complex your decals are. <br/>

<br/>

<b>Options </b> <br/>

Hotkey: none <br/>

What it Does: allows you to change certain level editor options. These are handy for making the level editor actually fit your screen.
</p>

</div>

<h3>File Menu</h3>
<div class="level3">

<p>
<b>New</b>
</p>

<p>
Hotkey: none <br/>

What it Does: Create a new, empty map <br/>

<br/>

<b>Open </b> <br/>

Hotkey: none <br/>

What it Does: Opens a previously saved .map file, including those made by FG. Go take a look at them some time; they're useful case studies. <br/>

<br/>

<b>Save</b> <br/>

Hotkey: Ctrl+S <br/>

What it Does: Saves your map. Save early, save often - especially with the level editor (it crashes quite frequently on my computer) <br/>

<br/>

<b>Save As</b> <br/>

Hotkey: none <br/>

What it Does: Saves your map under a different file name. If you mess around with someone else's map (which is not okay without their permission), <em>always save as something else before making any changes</em>. That way, you don't do what I did and delete the entire Cellar area of ATDD (I was experimenting with lighting). <br/>

<br/>

<b>Open Recent</b> <br/>

Hotkey: none <br/>

What it Does: opens a drop-down menu of recently saved maps. If this is your first time on the level editor, the menu will be blank. <br/>

<br/>

<b>Import Objects</b> <br/>

Hotkey: none <br/>

What it Does: allows you to import exported objects, such as compounds other people have made <br/>

<br/>

<b>Export Objects</b> <br/>

Hotkey: none <br/>

What it Does: Saves your .map file as an .expobj (EXPorted OBJect) <br/>

<br/>

<b>Quit</b> <br/>

Hotkey: Alt+F4 <br/>

What it Does: Closes the level editor; it will always prompt you to save before it closes.
</p>

</div>

<h2>Part 1B: Navigating Around the Level Editor</h2>
<div class="level2">

<p>
This isn't too bad; you'll be moving around a lot, but give it a try while I explain here anyways.
</p>

</div>

<h3>Magnifying Screens</h3>
<div class="level3">

<p>
Currently, there should be <b>four</b>different views on your screen. Starting in top left, moving counter-clockwise, they say Front, Top, Perspective, and Right. I've never found much use for Front, Top, or Right. You can zoom in on specified screens by pressing <b>spacebar</b> while your cursor is hovering over it. You can also press <b>spacebar</b> again to zoom back out. If you're following along, highlight the <em>perspective</em> screen and press <b>spacebar</b> to magnify it if you haven't already done so.
</p>

</div>

<h3>Moving Around The Level Editor in Perspective Mode</h3>
<div class="level3">

<p>
<b>Rotating Camera </b> <br/>

Hotkey: Alt + Left Mouse Button <br/>

This is more useful than zoom in a lot of cases. Click and hold down <b>alt and the left mouse button</b>; you should notice the border of your screen turned from red to yellow. Move your cursor like you're dragging the screen around - the same way you would if you were to put your finger on a piece of paper and rotate it. <br/>

<br/>

<b>Zooming the Camera </b> <br/>

Hotkey: Alt + Right Mouse Button <br/>

The second most useful button. You can get by without pan if you're creative with the focus tool and tracking grid (which is what anyone without a middle mouse button is going to do). Hold down <b>alt and the right mouse </b><b>button</b>then move the cursor <b>up</b>to zoom in, <b>down </b> to zoom out. <br/>

<br/>

<b>Panning the Camera</b> <br/>

Hotkey: Alt + Middle Mouse Button <br/>

Hold down <b>alt and the middle mouse button</b>, now move the cursor in any direction. From what I've seen of other people using the level editor, using pan is like placing your finger on top of a sheet of paper and pushing it around to view different parts - like the hand tool in Photoshop. <br/>

<br/>

<b>If you're now in Narnia in the Level Editor</b>
</p>
<ul>
<li class="level1"> Go down to where <b>Grid Control</b>      is</li>
<li class="level2"> Type 0 in the box labelled Height</li>
<li class="level2"> Press the <b>XZ </b>     Button</li>
<li class="level2"> Type 0 in the height box again</li>
<li class="level2"> Press the <b>XY</b>button (same as the XZ button)</li>
<li class="level2"> Type 0 in the height box</li>
<li class="level2"> Press <b>YZ</b>      button (same as the XY and XZ button) to return the grid to normal</li>
</ul>

</div>

<h1>Part 2: Building a Basic Room</h1>
<div class="level1">

<p>
<a href="/lib/exe/fetch.php?tok=89049b&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs71%2Ff%2F2013%2F147%2Ff%2F1%2Fperspective_mode_by_rueppells_fox-d66ui8q.jpg" class="media" title="http://fc01.deviantart.net/fs71/f/2013/147/f/1/perspective_mode_by_rueppells_fox-d66ui8q.jpg"><img src="/lib/exe/fetch.php?w=485&h=330&tok=3ee036&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs71%2Ff%2F2013%2F147%2Ff%2F1%2Fperspective_mode_by_rueppells_fox-d66ui8q.jpg" class="medialeft" title="perspective_mode_by_rueppells_fox-d66ui8q.jpg" alt="perspective_mode_by_rueppells_fox-d66ui8q.jpg" width="485" height="330" /></a>For this tutorial, we're going to make the basic shell required for a map. The final product will be similar in layout to TutorialMap_BareBones.map, which is available for download, along with the rest of the tutorial maps here (link will be available by June 9, 2013).
</p>

<p>
So we're going to start by creating a new map. Once your level editor has been opened, it will automatically create a new map file for you. Because it's easier to work with, let's focus in on the Perspective screen by hovering your cursor over the bottom right quadrant (labeled Perspective) and pressing <b>spacebar</b>. Your screen should now look like the image displayed on the left.
</p>

<p>
<a href="/lib/exe/fetch.php?tok=707759&media=http%3A%2F%2Ffc06.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F6%2F7%2Fprimitivesmenu_by_rueppells_fox-d66uipu.jpg" class="media" title="http://fc06.deviantart.net/fs70/f/2013/147/6/7/primitivesmenu_by_rueppells_fox-d66uipu.jpg"><img src="/lib/exe/fetch.php?tok=707759&media=http%3A%2F%2Ffc06.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F6%2F7%2Fprimitivesmenu_by_rueppells_fox-d66uipu.jpg" class="mediaright" title="primitivesmenu_by_rueppells_fox-d66uipu.jpg" alt="primitivesmenu_by_rueppells_fox-d66uipu.jpg" /></a>
</p>

<p>
We're going to start by putting in a floor made from a plane. Start by pressing <b>9</b>    on your keyboard or clicking the <b>cylinder and cone </b>      button in the left side-bar. You should see the menu, displayed on the right, appear in the side-bar to the right.
</p>

<p>
This is the Primitives Menu. Pretty simple, actually. Its components can be accessed after you've placed down your plane by clicking on it using the select tool (<b>1</b>) and choosing the Primitive or Planes tab (more on that later). Either way, this tab is use to build flat surfaces with <a href="http://vinterfall.com/wp-content/uploads/2010/08/seamless-tiled-floral-pattern-vector-background.gif" class="urlextern" title="http://vinterfall.com/wp-content/uploads/2010/08/seamless-tiled-floral-pattern-vector-background.gif"  rel="nofollow">tiled patterns</a>. Let's take a look at these buttons before we move on.
</p>

<p>
<b>Type </b>     <br/>
This is a drop-down menu. The only available option is Plane, so there's no use messing around with it too much.      <br/>
 <br/>
<b>Material</b>       <br/>
Ignore that blank white text box, it will display the file name of the material you choose to use on the plane.      <br/>
<b>…</b>     button can be used to select from a pre-made texture      <br/>
<b>+</b>     button will allow you to create a custom texture from scratch      <br/>
 <br/>
<b>Tile Amount</b>       <br/>
The three text boxes are in the order X, Y, Z. This isn't of too much concern considering you can just undo any mistakes or fix them later, but it's nice to know. A larger number will create more tiles per grid space (the pattern gets smaller); a smaller number will create fewer tiles per grid space (the pattern gets bigger). For most materials, we will change the tile amounts to 0.5, 0, 0.5 (X, Y, Z).      <br/>
 <br/>
<b>Tile Offset </b>     <br/>
Again, the boxes are labeled in the order X, Y, Z. These boxes change where the pattern is. Once we've placed in a plane, feel free to mess with these buttons a bit.      <br/>
 <br/>
<b>Texture Angle</b>       <br/>
This will change the angle the pattern is at. For example, if you want floor boards that are diagonal instead of horizontal, you can change the texture angle to 45.      <br/>
 <br/>
<b>Align to World Coordinates</b>       <br/>
I'm not sure what the technical talk for this is, but it pretty much ensures that every plane you make will match up with every other plane you make seamlessly. This is useful for when you need multiple planes with the same pattern side-by-side. Instead of having to manually adjust the tile offset, the level editor will do it for you.      <br/>
 <br/>
<b>Cast Shadows</b>       <br/>
This button's useless because planes never cast shadows. No matter how hard you try, it's not happening. There are ways to mitigate this, however, which we'll cover under the lighting section.      <br/>
 <br/>
<b>Collides</b>       <br/>
If you want the player or anything to be able to stand on this plane, leave the box ticked. If you're using planes to make water, un-tick the box so the player doesn't <a href="http://www.youtube.com/watch?v=FIlMOaPtePc" class="urlextern" title="http://www.youtube.com/watch?v=FIlMOaPtePc"  rel="nofollow">walk on water</a>(completely irrelevant link).
</p>

<p>
<a href="/lib/exe/fetch.php?tok=98ba24&media=http%3A%2F%2Ffc06.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F3%2F0%2Fmaterialmenu_by_rueppells_fox-d66ut12.jpg" class="media" title="http://fc06.deviantart.net/fs70/f/2013/147/3/0/materialmenu_by_rueppells_fox-d66ut12.jpg"><img src="/lib/exe/fetch.php?w=436&h=300&tok=46edc2&media=http%3A%2F%2Ffc06.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F3%2F0%2Fmaterialmenu_by_rueppells_fox-d66ut12.jpg" class="medialeft" title="materialmenu_by_rueppells_fox-d66ut12.jpg" alt="materialmenu_by_rueppells_fox-d66ut12.jpg" width="436" height="300" /></a>So let's choose a material to use. Go ahead and click on the <b>…</b>    button. You should be seeing this menu. The <b>static_objects</b>     menu (second from the bottom in that screenshot) has the most textures available. Most of the tileable ones will be under the ceiling or floor menus for the bases (eg cellarbase, mansionbase, castlebase, dungeonbase).
</p>

<p>
I'm going to make a mansion-based map, so I'll choose static_objects/mansionbase/floor/mansionbase_floor_boards.mat
</p>

<p>
<a href="/lib/exe/fetch.php?tok=407855&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F0%2F4%2Fplane_by_rueppells_fox-d66uvvh.jpg" class="media" title="http://fc01.deviantart.net/fs70/f/2013/147/0/4/plane_by_rueppells_fox-d66uvvh.jpg"><img src="/lib/exe/fetch.php?w=147&h=100&tok=407b04&media=http%3A%2F%2Ffc01.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F0%2F4%2Fplane_by_rueppells_fox-d66uvvh.jpg" class="mediaright" title="plane_by_rueppells_fox-d66uvvh.jpg" alt="plane_by_rueppells_fox-d66uvvh.jpg" width="147" height="100" /></a>Take a second to decide what floor you want to put in, and click the <b>OK </b>    button when you're done. We're almost ready to put in the floor, but first, we need to change the tile amount. It's currently just a little bit too big (tiles will be too small). The most common change is to switch the two outer columns from 1, 1, 1 to 0.5, 1, 0.5 (note: changing y value does nothing unless you align to world coordinates).
</p>

<p>
<a href="/lib/exe/fetch.php?tok=2107d5&media=http%3A%2F%2Ffc09.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F1%2F4%2Fcompletedplane_by_rueppells_fox-d66uwal.png" class="media" title="http://fc09.deviantart.net/fs70/f/2013/147/1/4/completedplane_by_rueppells_fox-d66uwal.png"><img src="/lib/exe/fetch.php?w=147&h=100&tok=36e669&media=http%3A%2F%2Ffc09.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F1%2F4%2Fcompletedplane_by_rueppells_fox-d66uwal.png" class="mediaright" alt="" width="147" height="100" /></a>Alright, all that's left is to click and drag your cursor across the area you want your floor to take up. The area will be outlined by a white rectangle. Try not to make your floor too large. We can change the size later, but it's always easier when that's not necessary. You should have something that looks a bit like this.
</p>

<p>
<a href="/lib/exe/fetch.php?tok=76d4c3&media=http%3A%2F%2Ffc02.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F5%2Fe%2Fplaneselection1menu_by_rueppells_fox-d66v2oc.jpg" class="media" title="http://fc02.deviantart.net/fs70/f/2013/147/5/e/planeselection1menu_by_rueppells_fox-d66v2oc.jpg"><img src="/lib/exe/fetch.php?w=150&h=522&tok=4f32d0&media=http%3A%2F%2Ffc02.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F5%2Fe%2Fplaneselection1menu_by_rueppells_fox-d66v2oc.jpg" class="medialeft" title="planeselection1menu_by_rueppells_fox-d66v2oc.jpg" alt="planeselection1menu_by_rueppells_fox-d66v2oc.jpg" width="150" height="522" /></a>We're going to adjust the size of this plane so it will make an 8×8 room. Press <b>1</b>    or choose the Selection Tool, then click on the floor. From here, you should see the menu illustrated on the left.
</p>

<p>
If the numbers are not the same, that's not a big deal. While we're here, though, let's explain them a bit. I think the name one's pretty obvious so let's skip that.
</p>

<p>
<b>Position</b>
</p>

<p>
There are three coordinates here that tell you how far along any one axis the plane has been moved. <b>X</b>      is for the <b>red</b>      line, <b>Y</b>      is for the <b>green</b>      line, and <b>Z</b>      is for the <b>blue</b>      line. Unlike in some programs, <b>Y</b>      is <b>up/down</b>.
</p>

<p>
<b>Rotation</b>
</p>

<p>
Rotation is how much the plane (or object) has been rotated around any given axis. All of these should be set to <b>0</b>      on your map, like mine are. They will come in handy later.
</p>

<p>
<b>Scale</b>
</p>

<p>
For a plane, this is the exact size of the plane. Since we're making an 8×8 plane (with no Y height change), we'll be changing the <b>X</b>      and <b>Z</b>      values both to <b>8</b>.
</p>

<p>
The other two tabs that are slightly visible (labeled Primitive and Plane), will come into use later if we need to adjust tiling size, material, or texture angle.
</p>

<p>
Awesome! We have a plane that's big enough to fit an 8×8 room on it. Let's move on to building some walls.
</p>

<p>
<a href="/lib/exe/fetch.php?tok=c18770&media=http%3A%2F%2Ffc00.deviantart.net%2Ffs71%2Ff%2F2013%2F147%2F9%2F5%2Fstaticobjectmainmenu_by_rueppells_fox-d66v583.jpg" class="media" title="http://fc00.deviantart.net/fs71/f/2013/147/9/5/staticobjectmainmenu_by_rueppells_fox-d66v583.jpg"><img src="/lib/exe/fetch.php?w=100&h=359&tok=95ccb5&media=http%3A%2F%2Ffc00.deviantart.net%2Ffs71%2Ff%2F2013%2F147%2F9%2F5%2Fstaticobjectmainmenu_by_rueppells_fox-d66v583.jpg" class="mediaright" title="staticobjectmainmenu_by_rueppells_fox-d66v583.jpg" alt="staticobjectmainmenu_by_rueppells_fox-d66v583.jpg" width="100" height="359" /></a>Press <b>6 </b>    or click the<b> little red Lego button </b>    to bring up the static object menu. Yay, new menu to talk about! I'm sure you're getting used to the process here. I'm going to explain all the buttons again (big woop).
</p>

<p>
<b> Static Objects </b>
</p>

<p>
Okay, the first part is this drop-down menu at the top. It will display the base you're using. As a general rule, objects from the same base will always look good together (as long as you use common sense). These will be in alphabetical order. Since I chose mansionbase for my floor, let's scroll down and take a look at what clicking the mansionbase option brings up.  <br/>
 <br/>
There's now a lot of text in that large white box under the drop-down menu, right? The sections are labeled based on their traditional function. By all means, you do not have to use the ceiling pieces for ceiling - I've seen ceiling pieces used as flooring before - but it's a good guideline of where to start. There should be a scroll-bar on the right side of the list; scroll down until you find walls and choose one of them. If you didn't use the mansionbase, go back to the dropdown menu and find the base you used, then find walls under that one.  <br/>
 <br/>
<b>Refresh Button</b>   <br/>
This clears the large white area, don't click it unless you want to reset the screen to blank.  <br/>
 <br/>
<b>Object Info</b>   <br/>
The thumbnail is a preview of what your static object will look like, pretty nifty, but you can't rotate it. BB Size is telling you how large the object you selected is. Most wall sets are 4, 4, 0.—, meaning they're 4 long, 4 high, and relatively thin. The Polygon count is letting you know how many polygons the model has. Translation: a higher number means a more detailed and more memory-consuming model.  <br/>
 <br/>
<b>Rand. Scale</b>   <br/>
This changes how large or small your object is. Unlike with planes, 1 refers to 100% of the original size. A value of 2 would be 200% (double) the original size, and a value of 0.5 would be 50% (half) the original size. You can change the scales individually in the Min. Scale boxes (ordered X, Y, Z). If Rand. Scale is checked, you can choose the maximum scale of the object. This is useful for models like grass and trees. For now, we're going to ignore it.  <br/>
 <br/>
<b>Rand. Rotate</b>   <br/>
This changes what direction your model is facing. Like with the Rand. Scale, the Min Rotate boxes can be used to determine the angle of your object. With rotation of walls, we will mainly be changing the <b>y</b>-value (the middle one).
</p>

<p>
<a href="/lib/exe/fetch.php?tok=0d6615&media=http%3A%2F%2Ffc09.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F1%2Fa%2Ftwowalls_by_rueppells_fox-d66v7ms.jpg" class="media" title="http://fc09.deviantart.net/fs70/f/2013/147/1/a/twowalls_by_rueppells_fox-d66v7ms.jpg"><img src="/lib/exe/fetch.php?w=485&h=330&tok=ab4c60&media=http%3A%2F%2Ffc09.deviantart.net%2Ffs70%2Ff%2F2013%2F147%2F1%2Fa%2Ftwowalls_by_rueppells_fox-d66v7ms.jpg" class="medialeft" title="twowalls_by_rueppells_fox-d66v7ms.jpg" alt="twowalls_by_rueppells_fox-d66v7ms.jpg" width="485" height="330" /></a>
</p>

<p>
Once you have a model selected, place two walls side-by-side on one side of the floor. You can do this by clicking where you want them to go. If they're in the wrong spot or facing the wrong way, press <b>1</b>  to change to the <b>selection tool</b>  and move them to the right spot.
</p>

<p>
<em>My level editor crashed >:(</em>
</p>

</div>
Frictional Game Wiki

User Tools

Site Tools

Page Tools
