[FULL GUIDE] WoW to UDK

[samgartell]

In this tutorial I'll be covering literally everything, from exporting to making a scene in UDK half way through writing this, it's become abundantly obvious I'm not just writing about WoW, I'm writing a full fledged guide on how to use UDK, be prepared for this. I'm posting it in Level Design, because it's the closest to what building scenes in UDK actually is. If I'm off, extremely sorry.
First off, you're going to need a few things;

- Time, and capacity to learn. (Maybe over-said, but you really WILL need these this isn't going to be a "Do this, do that, repeat tutorial, It'll be in-depth, explain everything, and hopefully teach you something about the engine, and not just the process it takes to rip models from WoW.)
- Unreal Development Kit (Link)
- A World of Warcraft installation (Any should do)
- A Model Viewer, such as Machinima Studio
- To speed things up, a bulk/batch image converter (UDK Won't support JPEG - Use PNG or TGA for least compression and best results)

With all that, we can get started.

Index
1. Exporting
2. Preparing UDK and Importing
3. Compiling Material Shaders
4. Applying Material to Mesh
5. Terrain Nodes, Tilesets, and Painting Landscape
6. Building a Scene
7. Dynamic and Static Lighting
8. Matinee and Kismet
9. Building/Compiling Scene
10. Finalising


1. Exporting

First, open your chosen Model Viewer, you should be presented with a viewport for the model preview, and a treeview of WoW's data. We're going to be using a simple model as an example, such as a tree from Grizzly Hills (worldexpansion02doodadsgrizzlyhillstreesgrizzlyhills_tree02.m2,) double click the model, or the model of your choice


You'll notice it's in the .M2 format, a format made by Blizzard, this will NOT work in UDK, it won't even pick it up as a file, so importing it won't even be an option. To fix this, we have to export it in a format UDK can read, the fastest option is to export it as an FBX, there are other options (Such as exporting as OBJ and then opening in a modelling program and exporting as ASE or PSK for skeletal meshes.) but we can settle for FBX as any cons are negligible.
To do this, you can either right click on the model in the file browser, or in the model browser, and press Export, like this;


When done, if using Machinima Studio, it'll ask you to wait for 10 seconds, (this can seem tedious if you're wanting to export multiple models fast, but Machinina Studio more than makes up for it in terms of having less bugs than WoWModelViewer) After the ten seconds is up, press continue, the exporting menu will open, below, you'll see the options you'll need ticked/selected in green, and any others either aren't relevant for this part of the tutorial, or are already ticked or selected, so leave them as they are.



Now press export.
Export it to a place you can remember, somewhere safe, to avoid losing it.
Now that you have the file exported, and in a format safe for UDK, go ahead and open your chosen batch image converter, find the folder you exported to, and convert every JPEG to PNG, even though you chose to force PNG textures in the exporter menu, the normal map will still be JPEG, we don't NEED a normal map, but it can really improve a model by telling the engine how to render lighting over it, giving it a 3D effect if done correctly.

Now open UDK.

[samgartell]

2. Preparing UDK and Importing

2a) Preparing UDK
If you're new to UDK, you'll probably be a bit confused about what you're looking at - But really UDK is incredibly simple to use when you get the hang of it.
Firstly, you'll see a menu that should say "Welcome to UDK", this is just a port to show you useful links and get you started with tutorials and documentation. What we need though, is the button that says "New Map", once you've clicked that, a new menu will open, and what you choose here will depend on what time of day you want to set your scene in, you can choose any, ultimately it won't effect anything and you can change things later, but it does help make a basis for your scene.



After you've chosen the time of day, you can close any windows that aren't the UDK Window or the "Content Browser". You'll most likely see four viewports showing perspective, front, side and top-down views of the gameworld, I usually hide any that aren't perspective, because with WoW styled world-building, you really don't need too much accuracy. This should leave you with this:



You can delete the meshes that are in the viewport, we won't be needing them, you can do this by left clicking on them, and pressing delete on the keyboard, the smaller box is surrounded by the "brush" (The red wireframe cube) if you're struggling to delete the actual mesh, move the brush and try again.

You'll now be left with a Lightmass Importance Volume (Yellow wireframe cube,) the Brush, a dominant directional light (The lightbulb sprite with D/S written on it,) a Player Spawn (The grey and orange "gamepad" looking sprite,) and a Fog volume (The eagle head looking sprite,). If there is anything else, delete it.

2b) Importing your model

Now that the basics are out of the way, we can move on to actually getting your model into the game engine, first you'll need to go to the Content Browser, this displays all of the game content, and every possible actor you can place in-game, including lights, materials, textures, static and skeletal meshes, sound, literally every asset of the game is displayed here. If you closed it, or it wasn't open when you started UDK, press the content browser button it should be here on the workspace:


Once it's open, you'll notice a lot of assets that you won't need, and probably don't understand, don't worry about them. What we'll be needing is your assets, so to import them, you'll need to press the aptly named "Import" button on the bottom of the content browser window, it should be under the treeview, and beside "new". This will open a file browser dialogue, navigate to the folder you saved your model too, and then select EVERYTHING, and press "Open".

Now, this is the delicate part, if you get this wrong, you'll have to reimport and start again, otherwise you risk corrupting your save, and wasting a lot of time.
You should see this:

The parts with green arrows can be changed to whatever and they decide where the assets will be stored in UDK's treeview, The package name is a title for all of your Assets, followed by Grouping, which is really just a way of sorting assets in your package, for example, separating textures, and models (Static Meshes) just be careful to use only basic characters and no spaces.
You will NEED to have Static Meshes selected for this particular model, and "Combine Meshes" must be ticked, otherwise the geosets of the model will import as separate meshes, and assembling them every single time you want to use them in the game world is inefficient and quite silly.
Justification for importing as a Static Mesh rather than a Skeletal Mesh is quite simply because my model is a game object, Skeletal Meshes are best used for High-Poly Character Meshes, and anything which is animated with a bone hierarchy. Static Meshes are usually mid-poly world objects which are as stated "Static" they can't move in real-time unless converted to a low poly Mover Mesh.

Now that the model is ready to be imported, press OK.

Textures are a little bit simpler, you can just press OK and they'll import fine, however due to the way WoW stores files with Alpha transparency, you may need to remove the full stop in the name of the texture, but there are settings for specific textures you can look at, these aren't important, but it might be a good thing to learn about how UDK compresses textures in the future. I will be using "Textures" as my grouping.

Once all textures and the model are imported, your content browser should look like this:


If you've made it this far without problems, congratulations, This is where it gets complex.

[axel0099]

ohh.. the tut seems nice... ill take a look at it tommorow morning

[samgartell]

3. Compiling Material Shaders

Material shaders are a wonderful, complicated, horrible thing to the new user. Luckily, we'll be making relatively simple ones, using around 2-3 texture samples for each.

To understand Materials, you've got to understand that UDK doesn't display textures directly, it uses textures inside Materials to create more complicated "textures", rather than just flat boring ones.
To make one, hold ctrl + select the diffuse map textures (if you're new, a Diffuse map is just the "texture color") then right click, and press "Create new Material"
Like this:


Change the grouping of the material to "Materials" and press OK on the dialogue that appears, every time.
Now you'll have three new assets in the Content browser, either entirely black or with a checker icon, right click  "Grizzlyhills_trunk256_Mat" and press "Edit using Material Editor"

The Material Editor will now open. The material editor is a brilliant tool, which can compile shaders using links, rather than complex code.
The basic material layout for what we're doing is this:


Now to explain what's going on: the Diffuse maps colour channel is connected to "Diffuse" to display the colours of the texture, the colour channel is the black node sticking out of the Texture Sample. I've then used the Green channel for the Specular (Which gives it the "shiny" highlight effect, which along with the Normal, gives a 3D effect) because there wasn't much Green on the texture and because of that, the "shine" will be minimal, but still noticeable. And lastly, I dragged the Normal Map (Grizzlyhills_trunk256_normal) into the material editor from the content browser, and then connected it to the Normal node, using the Normal maps colour node. Normal maps tell the engine where to render shadows and highlights, making the material appear 3D in-game as opposed to flat.

*To move texture samples, select them, hold ctrl and drag

Now that you're done, press the compile button, , and we're done with our trunk material. The other materials use alpha channels, so they're a bit more complicated; for a start we need to decide if we're going to be using the Diffuse' alpha channel, or our own mask. For quick and simple, stick to the Diffuse' alpha channel, for a better effect, do the following -
1. Open your diffuse in a picture editor
2. Add a new layer, and fill with black
3. Go to your diffuse' layer, and turn the brightness up until it's entirely white, no grey showing at all.
4. Save as "filenamegoeshere_mask"
5. Import into the engine as directed in the importing section.

I'll be using this method, but if you don't want too, replace the node where I attach the mask texture with the alpha channel (white node on diffuse texture) of the diffuse, this can leave white areas in-game, so I don't recommend it.

Ok, now open your leaf material (grizzlyhills_leaves256alpha_mat) in the material editor, and attach the Colour to the Diffuse node, and like the trunk material, drag the corresponding normal map into the material editor, and then the same with the new Mask texture you just created (If you did). Connect them like you did the trunk, except this time, connect the mask (Or diffuse' alpha channel) to the "Opacity Mask" node. The shader still won't display the transparent parts though, because it's not set up to display them. To do this, look just below the material shader viewport, you'll see the materials properties, change these two to look like this:

And then check the viewport is displaying transparency. If it is, compile, and then exit the material editor, and do the same for any other textures.

Congratulations, you've finished the materials.

[samgartell]

4. Applying Material to Mesh

This is a quick and easy part of the tutorial, just right click on the static mesh, and choose "Edit using Static Mesh Editor", this opens the Unreal Static Mesh Editor, an easy versatile tool for setting up which materials are displayed on the model, what collisions it has, and even destructibility, using the fracture tool.

We'll just be using collisions, and material LOD's.

First, look at the side of the Static Mesh Editor, you'll see the properties of the model, go to this:


Click on the "material: None" area of an element and it will highlight the places where the material will be applied, for example, in the picture it's highlighted the leaves of the tree's mesh.
To apply the material, select the material you want in the Content browser and then press the green arrow next to the Material field of the element.

Do the same with the rest of the materials, and it should look like this:


Materials now applied, let's move on to how it reacts with the world, specifically, the player colliding with it.

First, press "Show Collision", , and notice nothing happens, this is because it has no collision, if the player walks at it, they'll just walk right through it. To fix this, we'll need to generate a collision. There are two types of collision, simple box collision, and per poly collision, for basic objects you can use box collision, it'll stop players passing through it, end of. However for more complex models, per poly works better because it uses the model itself to calculate where the player can and can't walk through. As this is just a tree, we don't need this, and box will work fine, and is a lot more efficient, too many per poly calculations will slow your FPS to a crawl.

To add a box collision, simply press "collision" in the toolbar and select "6DOP Simplified Collision", this will add a box around the tree, which you can see if you have show collision, , enabled. The box acts as the "bounds" of the model, a players cannot walk through the box. You may notice higher numbers of DOP simplified collision, these will increase the complexity of the bounds, but only to a certain point.

Per Poly can be achieved by going to the bottom of the models properties and unticking the three options
- Use Simple box collision
- Use Simple line collision
- Use Simple Rigid Body collision

That's it, collisions and model materials done.

[samgartell]

5. Terrain Nodes, Tilesets, and Painting Landscape

This is my favourite part, mainly because nobody does it the same, everyone paints and shapes Terrain in their own way, it's almost like your own personal style.

To get started, go to the main UDK window, and go to "Tools > New Terrain" in the toolbar, it'll open a menu, and the menu will ask you how many patches you want in X and Y, this will be the size of your map in Unreal Units, just estimate how big you're going to make your scene, and then press Next. (DO NOT OVERDO IT, I REPEAT DO NOT; Any bigger than 1024*1024 is pushing it, so be careful.), press Finish and you'll notice a checkered plane appear in the viewport, typically, I move the centre to the centre of the map, but it's not necessary.
Now you're gonna want to shape it, and paint it, to do this, open the terrain editor, , on the left hand side of the UDK window. The terrain editor is another great tool in UDK, it allows you to paint the heightmap and materials in real time. To get materials for your terrain open Machinima Studio, and go to this filepath in the treeview


And then select a texture you want, you'll preferably need four textures:
- Dirt
- Rock
- Grass
- Grass Detail (Flowers etc.)

I'll be using these:

- tilesetexpansion02grizzlyhillsgh_dirtd
- tilesetexpansion02sholazarbasinsb_rockya
- tilesetexpansion02grizzlyhillsgh_bushya
- tilesetexpansion02grizzlyhillsgh_flowers2

To use them, do exactly as you did with the previous materials, import, make shader (don't use normal maps, terrain can only have 12 texture samples total, so use them wisely), and compile. To get them onto the terrain though, Select your dirt material in the Content Browser, and then go to the terrain editor, , and then just below where it says "Heightmap" right click and press "New Terrain Setup Layer from Material (Auto-Create)" and it will load your texture as a "layer", seeing as it's your first, it'll cover the terrain with it, then do this for the rest of your materials.

*If your Materials are being displayed too big, increase the tessellation.

Now, to painting, select the layer you want to paint, and press the paint tool, and then choose the size of your brush, and then hold ctrl, and right/left click to add/subtract materials. If you have the dirt layer or the heightmap layer select, it will raise and lower the ground, allowing for mountain etc.

Experiment with this a lot, you will eventually develop an idea, and build onto it. You'll eventually make yourself pleasantly surprised, and then you'll stick to that method of painting terrain. Like I said, nobody is the same.

Here's some random squiggles, just for reference to what it should look like.

* If you're getting trippy rainbow material, you've either got an outdated CPU, or are using too many Texture Samples in your materials.

[samgartell]

6. Building a Scene

Things should be winding down now, the more complicated things are out of the way for now, and after this, Matinee, Kismet, Particles and Cascade and Lighting are totally optional, and are only used for adding a bit of life to your scene.

To add objects to your scene, simply drag a static mesh from the Content Browser into the viewport and onto the terrain node, there you have it, you're done. That's it. Honestly. You've ported a WoW Model into UDK and used it inside the engine.

You can use the transform tools, , to scale, rotate, and move the objects.

To add more objects, use the processes above, and it should always work. If it doesn't, leave a reply, and I'll try to get back to you on it. If you're not interested in the optional stuff, head to "Building/Compiling Scene" and then you're done. For anybody leaving, thanks for reading, for the rest of you, good luck.

[samgartell]

7. Dynamic and Static Lighting

For the rest of this tutorial, I'll be using an island I made earlier.

7a) Static Lighting

For the static lighting section, I'll be concentrating on an Iron Dwarf town on the Island, as the static lighting here is more dense than most areas on the island.

First, what is a static light?
A static light is a light which will have it's colour and shadows baked into a lightmap, and therefore, cannot be moved, or edited in real-time with Matinee and Kismet. It is for the most basic lights on your level, but done right, can look incredible.

Now a quick warning, never go overboard with lighting, not only will it take a hell of a long time to compile, but it'll look extremely bad, and honestly, it's not worth risking it.

Right, onto adding a light;
Go to anywhere in your scene, and right click, Add actor, Light (Point). Done.
Now, you can use the transform tools to move, scale, and rotate the light (useful for spotlights, not so much pointlights)

But one thing most tutorials skip is lighting colour, this is extremely important and atmospheric, and totally makes the scene more lively.



As you can see, there are blue lanterns which give off a blue glow, this is done by right clicking your pointlight, going to properties and doing the following



Anddd done.

7b) Dynamic Lights

This is actually an introduction for the Matinee and Kismet section, as what I'll be doing in that will include dynamic lights.
Dynamic lights are movable, editable lights that Matinee and Kismet can use.
To make one, create a pointlight like above, but then right click, and press "Toggle Dynamic Channel"
Then open it's properties, go down to Movement, open it, and set it's Physics to "PHYS_Interpolating"
When an object has interpolating physics it means it will update dynamically, for example, a flickering light will update in real-time. Static lights can't be used to do this.

Extra info: Moving the Sun/Moon
The dominant directional light (The one that was already in the level when you made it) control the colour, location and all settings of the sun/moon and the light the sun/moon gives off, to move the sun/moon, rotate the dominant directional light, to change the colour and brightness, edit the properties like any other light.

[samgartell]

8. Kismet and Matinee

This is slightly complicated, but the format of Kismet is very similar to the Material Editor, and many other tools in UDK, so it's best to get used to the environment early on. If you've ever used any animating software what-so-ever, you already know how to use Matinee.

Right, to begin with, we need an objective, for example, a flickering light, as mentioned above.
I'll be using a campfire for my flickering light, I'm using an orange dynamic light.



As you can see, it's lighting up the area around it, but for extra atmosphere a flicker would be nice. So What I'm going to do is open Kismet, , next to the content browser, and you'll be presented with an interface. To begin with, Kismet uses conditions to start actions using variables.
We'll be using a basic condition/event, "Level Loaded" to get this, right click in the grey space of Kismet, New Event > Level Loaded
Once this is done, a node will appear, right click in the greyspace again and press "New matinee" connect either "Beginning of Level" or "Loaded and Visible" of Level Loaded to "Play" on your Matinee.
That's the Kismet done.

Now for the Matinee.
Open Matinee, , next to Kismet's button, and Matinee will open, or if you have multiple Matinee nodes in Kismet, it will ask you which one you want to edit.

When open, go back to the scene, select your dynamic light, and open Matinee again, this is important, do not skip this, or it will not work.

Now inside Matinee, right click where it shows, in this picture, and click "new lighting group"


Call the lighting group whatever you want, and press OK.

For the flickering effect, there are multiple ways to go about it, but I'll be using the Brightness track, to do this, just click the Brightness track in your new group and press the keyframe button, , now we have the first keyframe, each keyframe will hold the brightness value that the dynamic light has at the time of pressing the keyframe button, so open the dynamic lights properties like you did to change it's color, and just above the color picker setting, you'll find the Brightness value.

To make it flicker, do like so, following the order



1. Move time
2. Change brightness
3. Keyframe

Do this a couple of times, trying to be as random as possible with the brightness value and you'll end up with a flickering light.

Press loop section, to check it's working, if it's not, review the steps in this tutorial, and make sure you followed exactly.

[samgartell]

9. Building and Compiling the Scene

If you're finished with your scene, firstly, save it. Always save, you can never save your work too much. UDK is still in Beta, and therefore crashes a lot if you're not careful or don't know what you're doing.

And now, you'll want to build your geometry, lighting, and paths. If you're making a scene for a short film, or a picture, building lighting is a necessity, it looks better, and it's more resource efficient.

To do this, just press Build All (Marked green),   , and wait for it to complete.

Depending on your computer, this can take a while.

Once that's done, open your UDK folder, go into Binaries, and find UnrealFrontend.exe, and then run it.
When it's open, you'll want to make a profile for your "game" for convenience, and possible distribution, to do so, right click an existing profile (That isn't an iOS Profile) and choose "Clone profile" then right click again and Rename it. To get your map to load natively, first add it to the "Maps to Cook" list, and then remove any existing maps.

Now tick Override Default, and select your map again from the dropdown list.

Then press cook, and you're done.

[samgartell]

10. Finalising

You're now done. Start to finish, everything. Keep in mind, this tutorial applies to all UDK game creation, not just WoW related ones, so technically you can now use UDK to produce your own games.

To everyone who made it through all of this, well done, and thanks for reading. if you need any more help, be sure to ask, I'm currently studying Games Development, and I'm on my third year of experience with UDK so most questions will be answerable.

 - Sam

[fearless_wind]

Very nice tut. I have a question - can UDK be used for MMORPG creating? I was told there can be only 5 players per map...

[samgartell]

Very nice tut. I have a question - can UDK be used for MMORPG creating? I was told there can be only 5 players per map...

UDK can be used for nearly anything, there are Unreal Engine plugins such as Atlas that allow MMO support, but it's not easy, especially not alone. I'm in the process of doing it however, with a small team.

Natively, UDK supports 64 players, which isn't too bad

[Shruik]

great tutorial thank you

[samgartell]

great tutorial thank you

Any time

I'd love to see what people can do with this ^^