Kitte~Wolf's FULL mapmaking tutorial! ~WIP~

[kithawthorne]

As the title says, this is a work in progress. :3 I'll be making a map to go with this tut, to be given away for free. But first.. If you read this, chu get cookies.

So, some things you'll need:

GIMP: http://www.gimp.org/downloads/ It's free. You'll need it.
FeralHeart (duh)
Permission to download custom objects
Creativity
Ability to understand and manipulate instructions


That's about the list of things you need.

[kithawthorne]

Creating the Heightmap
Using GIMP, in Kitte~Wolf's you-cant-steal-someones-work way.

First things first...
You need a basic knowledge of how to work GIMP. I'll run over a few things.

The pencil tool: True to it's name, it's icon in the left toolbar is a pencil. It makes solid, somewhat harsh lines.
The paintbrush tool: It creates smooth strokes. In the vegetation, texture etc brushes it actually works them like their are supposed to look. It looks like a paintbrush.
The airbrush tool: An accessory, somewhat unrequired. You can guess what it looks like.
The fillbucket tool: It looks exactly like it does in Paint, and does exactly the same thing.
The eraser tool: Pretty self explanatory. It looks like a pink eraser
The magnifying tool: allows you to zoom in and out. It looks like a magnifying glass
The blur tool: It looks like a drop of water, and it blurs things so that they're fuzzy.
The smudge tool: It looks like a hand with the index finger pointing out, it smudges things to create (when making Heightmaps) Smoother slopes

Take a little time, mess around, and get used to the feeling of GIMP. Take your time, and read everything several times. Don't be afraid to mess up, that's what they created edit>undo for.


...Do you have the feel for GIMP? Good. Now onto the technical stuff.

Creating the base size of your heaightmap.

FH mapmaker only takes 513x513 greyscale png images. I will assume you are working with GIMP 2.8.0, and I will treat this tutorial as such.

If you want to make a more detailed heightmap, feel free to make it bigger than that. 2000x2000 is a good size for details. I'll do 800x800 this time around.
Note: it must be square when you first create it, otherwise it WILL NOT scale right. So unless you want the heightmap to be distorted, make it square.

Now, you have your square image? Good. Now, go to the line of options on the upper edge of the main GIMP window (the one with your blank canvas). Go to the fifth option, it should be called "Image". Open that menus.
Move down to Mode(second option down) and hover over it. It should pop up a list of options. Your current mode is RGB. Make it so the mode is greyscale by clicking on that option.

Ta-da! Now no matter what color you draw in, it will come out greyscale! You've already learned more than I did when I started using GIMP.

So, your current color is black (color code: 000000). We want a nice, medium grey color to begin with, so we can work the terrain down into lower places and up into higher places.

Now, select the pencil tool. We will begin by making a river.

Using the pencil tool, draw two squiggly lines close together that are somewhat congruent. This will be using a darker color than your base color, but not black.


Now close off the end(s) so that they gradually get smaller.


You may have noticed that your lines are bigger than you will want most of the time. Go down to the tool options, and see where it says "size"? Make it so you can type a number in, and make it so the number displayed there is 5.00. Now test by drawing a branchoff stream from the river, only one line this time.


Notice that the original river isn't filled in? Use the fillbucket tool and fill it in.


Using a darker color than the color used in the river and stream, you can make deeper pools and dips.


In order to create a waterfall in your map, the heightmap area where the falls will be will look a little like the right-hand corner of this thingie:


Now let's add some hills. :3

To make the map more interesting, let's add some hills. Get a color lighter than your base color, then follow my lead.

With your lighter color, create a circle/squiggly/random shape somewhere on the image.


There, you have your hill. Now you can add dips in darker colors and higher parts in lighter colors.

Experiment with the image. In the end, try to make it a bit like this:


Now, were done, right? Wrong. We still have to name it and scale it!

To scale it, go to the upper menu "Image". Hit Scale image, and type in 513. The hit enter(on your keyboard) and then scale.

To make everything smooth, select the blur tool, make it so the rate (last adjustable menu) is 100 instead of 50. Then make the tool larger, and blur the entire heightmap so it's all smooth-like.

To save it as a png, go to the upper menu "File", click "Export" and a window should pop up. Now, in the side menu with different places than "My Pictures", click "Local Disk", then open the FeralHeart folder. The next folder is Media, then Terrains. Let's name our map... Practice. So, delete everything in the bar of text, then type in PracticeTerrain.png

Important! It HAS to be a png file, or else it will crash your FeralHeart!

After that, hit enter. Another window should pop up, and hit enter again. Ta-da! Onto the next post, making terrain alpha masks!

[kithawthorne]

Creating the Alpha Terrain Mask
Using GIMP, in a fairly precise way.

So you just exported your heightmap? Good. Now add a new layer. This is done by layer>new layer. After you add the new, transparent layer, change the mode of the picture back to RGB. If you need a repeat of how to do it, see the "Creating the Heightmap" post.

Now that you have your new layer, fill it entirely with red. The color code is: ff0000
After you do that, see the bar above the layer list that says "Opacity"? Make the opacity of that layer less than 100, enough so you can see the heightmap underneath fairly well.


Now, change the color to pure green. Color code: 00ff00

This green will be our grassy fields. The red was the sand, for paths and streams. The blue will be rocky stuff.

Now we want quite a bit of grass. Use the green, and color until it looks something like this:


Now, we'll use the blue for stone mountain things. Color in with pure blue (0000ff) Until it looks like mine:


Now, use the blur tool again and blur the mask. Then, right-click on the heightmap layer, and delete it. Make sure it's not the layer you just did, the one with red green and blue.

Slide the opacity level back up to 100, and export this image to "Terrains" as PracticeMask.png.

Now, let's test these in-game and make sure they work correctly. Start up FH, and in the menu, choose Tools>Mapmaker

Now, select the second menu (titled World) And in the first text place (the one titled Terrain Height Map) Backspace until defaultTerrain.png is gone and type in PracticeTerrain.png then click somewhere. The terrain should change. In the Terrain Alpha Map selection, delete defaultMask.png and type in PracticeMask.png and click somewhere. You should see black patches. Using the arrow button under the space for the alpha mask, click the right-pointing one and make the second and third terrains random terrains, then go back to the "Map" menu and save as Practice.

Now onto the next post, The basic controls in FH mapmaker!

[kithawthorne]

Basic controls in FH mapmaker
How to navigate Mapmaker

So, let's start with the first tab: Map

[kithawthorne]

Reserved

[kithawthorne]

reserved

[kithawthorne]

Reserved

[kithawthorne]

Reserved

(These reserved posts are in case I need them. I know I'll need three-ish)

[kithawthorne]

Reserved

(More? This is a project bigger than I thought it would be. So yea)