Script not executed will stop foreign frames and can collapse sub headings.

Hârnic Maps


By clicking on the headings you can collapse or expand the associated section.

Introduction

The GIMP is an image manipulation tool that can be used for the creation of (bitmap) images. It is available for many operating systems, so almost everybody can use it with little effort. Installation is simple. (For the sake of accuracy only, I shall be using version 2.4.5 on Ubuntu Linux in the tutorial below.)

Before going into the details of creating a map, please be advised that image creation and manipulation is driven by memory. The more MB you plug into your system the smoother it works and the bigger the images may get. While the GIMP uses memory rather efficient and can even be customized with respect to that, I would not recommend to work with less than 512MB. But it is free, so you can try; maybe you get away creating only smaller images.

After you have installed the GIMP, get accustomed to it. Work through the basic tutorials and learn to understand the basic tools such as selection, pens and fillings. An hour or two should be enough, probably less. You can then start on the course below and whenever you find a concept below that you do not understand, refer to the GIMP references you know by now. Internet search engines will turn up sufficient material. Remember that currently, we are dealing with local scale maps only.

Install the Package of brushes and patterns into the directory where they belong. This is different for each OS and if you install multiple versions of the GIMP, so please read the documentation of the GIMP. After that start up the GIMP (or reload the patterns and brushes).

I have a used a localized version of the GIMP. The names for filters and such have been retranslated into english, so the names may not match exactly to the ones you will see on your tool.

Layers

When creating maps, you first need to consider the scale. How many pixel per foot? This decision must be made first. Usually this falls somewhat short of 1 pixel per foot. To keep things simple, we will discuss maps with 1 pixel = 1 foot. Measure a few of your local maps and you should get an image size of about 1600×2200 pixels.

A note on printing. Paper sizes are various and commercial publishers may have very high quality standards, say 300dpi. At about 12in = 30cm, these 300dpi that would equate 3600 pixels on the long side. For our purposes we are closer to 200dpi. If you feel like the former, you need to consider a factor of 1.5 in most of the below.

From top to bottom create layers called "Text", "Elevation", "Houses", "Brush", "Fields", "Woods", "Gardens", "Roads", "Water", and "Beach". All proposed values during creation are okay. The layer "Background" should already be available and at the bottom. At various times in the creation process, new layers will come up. It is a good idea to keep these layers as long as possible, because you cannot really undo a merge of layers without creating both all over again. On the other hand, too many layers will make the layers dialog unwieldy. Try out the process below and you will find your personal preference.

One note on the bucket fill tool. Make sure the radiobutton with "Fill all of selection" is ticked. Sometimes it defaults differently.

Background

Make "Background" the active layer and choose the (green) color value "1ab71a" as your foreground color. (You can change the color value by double-clicking on the foreground color in the main dialogue. There are a number of ways to choose the correct value.) Select the whole layer (Ctrl-A) and bucket fill all of it. This is your background. At this point I'd like to take an artistic "detour", since applying it it still rather simple. Some of it you might want to apply to all of your image, some only to certain layers.

A simple green is quite dull, even though it will be overlayed by a houses, garden, roads, etc. Therefore you may want to give some structure to the background. There are several ways to do so. Go ahead and experiment, I will only show three variants. (To apply filters, popup the context menu on the image; filters should be the last item).

Apply Filters>Artistic>Apply Canvas and choose a depth of 2. Apply Filters>Noise>RGB-Noise with all parameter 0.2. Then apply Filters>Blur>Gaussian Blur with radius 5. Create a new layer on top of "Background". Fill it with the "Paper" pattern. Select the layer mode "Extract Grain" (this is found in the top section of the layers dialog). Reduce Opacity to 60. Merge the new layer (down) unto "Background".

You can come back to this "detour" later, when you have some experience with the other parts. On the other hand, this layer is extremely easy to produce, so use it for experiments.

Water

Now select the water layer. Use the lasso select tool to select the bigger areas and fill them with the (blue) foreground color value "0588fb". To create a stream, choose a circle pen of the appropriate size (remember that 1 pixel = 1 foot) and draw an appropriate line. (Consider holding down the Shift-key, so you can draw straight lines.) Use a pencil not a brush for this. Pencils leave a sharp line as opposed to brushes. When using the color selection tool (which we will), this makes things a lot simpler.

You may feel that the straight line drawings are too straight. Remove any selection still active (only the ant lines should be removed, not the contents). Apply Filter>Noise>Spread and increase both spreads to 10. Color Select the blue. Increase your selection by 1 pixel and then decrease it by 2. Make sure you deselect the checkbox, which causes a decrease from the image border, when you decrease. Paint all the selection blue, invert it (Ctrl-I) and then delete the remaining pixels (Del).

The images show before and after for a straight line with the green background.

We will use this technique for other borders as well. It can also be used to give borders a common kind of irregularity, if the original irregularities do not differ too much in their "randomness". For handdrawing it is quite good.

Sometimes it is useful to distinguish between deep and shallow water. For shallow water use the color value "84ccf3" and proceed with this value like before. After doing so, select all water, decrease the selection by a number of pixels (feet) which you deem likely for shallow water at the shore. Again, don't reduce this from the image border. Now, create a new layer and activate it. Fill the selection in this layer with the darker blue form the above paragraphs. Make sure this layer is placed directly on top of the original water layer. You should now have dark deep water overlaying the light shallow water. Modify the selection by adding or subtracting with the lasso to model your underwater elevation. Create wobbly curves again as before. Once you are satisfied, merge the layers into one, by choosing "merge downward" on the context menu for the dark water layer. Otherwise you can keep it as a secondary water level, and later modify this when new situations arise. For instance a ford. You should probably rename the layer then.

Some people like to have a thin black borderline around water. For that select everything (for instance by color selecting all of them with a threshold of 255). Then choose Selection>Border with a width of 1. This you fill with black.

Beach

I color my beaches with "d8d911". Use the water process as described for the sand. You will find that the sand area needs to be bigger than the water, because it will show underneath. To make up for this, you can leave the area beneath the water uncolored.

To create some peebles we need a basic technique we haven't used before. First create a helper layer direct on top of the beach. Fill it or rather the part you wish to have pebbles on with black Apply Filter>Noise>RGB-Noise with Non-correlation, Non-independent channels, no Alpha noise, and all other sliders set to 0.4. Now select all white pixels with a threshold of 160 in the selection tool. Paint them all black and clear the inverse selection. Now remove the selection (not the contents) and select the area for the pebbles again. Apply Filter>Blur>Gaussian Blur with a value of 1.

You can experiment with the threshold of 160 to get more or less pebbles. Modifying other parameters will not give you more degrees of freedom, i. e. you can achieve everything you need with just one parameter.

If you merge this layers with the beach below, make sure that you are done with your "artistics" as described in the background section. Because any artistry that involves blurring will probably destroy your pebbles. As always, you can keep the layers and need not merge them yet.

Houses

On this layer select a rectangular piece of the size a cottage should be, say 20×30 feet. Fill this black. Decrease the selection by 3 pixels. Fill this white. This is your first house. If you have several cottages of the same size, select all of it and copy (Ctrl-C) and paste (Ctrl-V) at the places you would like to have them.

After you have placed all the cottages, you need to rotate them somewhat, because aligning all cottages isn't natural. Select the cottage to rotate and use the rotation tool on it. After that you need to anchor the selection: click any Select tool and then click outside the selection again. When selecting a cottage, you don't need to have a tight selection. Just don't select parts of another house.

This is what my sample result looks like. I rotated a copy of the original house. Manors and keeps are usually shown as solid black and don't have white interior. The same principles apply to non-rectangular houses and shacks, millwheels, etc.

Sometimes the buildings or landmarks you want to place have odd shapes. Approximate them with the selection tool. Depending on whether they need an interior or not you can first make everything thing black, select it and then decrease the size of the selection by 3 pixels. I have added a mill wheel as I would draw it in the image above for your convenience. I use the zoom/magnify a lot in order to place the correct pixels on a piece of equipment. Once I have it right, I can copy it around the layer. Keep one original copy, if you need to rotate a lot. This is why I place all buildings before starting to rotate.

If you think you will need something really often, consider saving it as pattern or brush. Due to their inherent difference, "interior maps" will have a lot of these pattern and brushes for implements/items.

Roads

Roads basically work like streams. I use the colour value "9f4114" and a circular pen of radius 9. If you like to make the bounds of the road irregular as with the rivers, you want to choose a smaller random spread than 10, as roads are not as irregularly shaped as streams.

Gardens

Select the correct layer and select the bucket fill tool. There check the radio button for pattern fill and select the pattern "Harn local: Small fields". Now you can select patches of land to be filled with the lasso. After having selected and filled them, remove the selection itself (not its contents).

If you like all of your garden plots to be rectangular you need to remove all non-rectangular irregular patches. Otherwise leave things as they are. Whatever you choose, it usually is a good idea to apply the eraser or the select/delete to remove access garden area. Once you are satisfied, tilt the individual areas.

Select a connected area with the lasso and rotate and move it to your liking. Then do the same for the next patch until you are done. Sometimes you find that a patch needs some refinement to fit into place. I advise to refine the patch while still in aligned mode (when the pattern was aligned up/down and left/right), so undo the rotation and fix your patch and then rotate again.

I personally like to blur the gardens a bit through Filters>Blur>Gaussian Blur with a radius of 1, which you can see in the lower left patch in the above image. (The other one was just rotated!) There are other artistic possibilities, but consider the plot borders you want to keep intact.

Fields

First decide on the layout of the fields, provide for grassland etc. Sketch it on the Fields layer. Then create each field individually in the following manner.

Create a new layer, where you select an area appropriate for your field in vertical orientation. You will later rotate it. If in doubt, make it bigger than its final version. Fill it with the "Harn Local: fields" pattern. Rotate the selection such that the plow lines are in the intended direction. Then move the selection were it should go. At any time you can trim the edges with the eraser tool to fit into the surrounding. You can't add area, which is why you should be generous when originally creating the field. Don't worry that it lies on top of the other items you have created so far. Once the field is where you wanted it, anchor it and merge the layer downward with your other fields.

The same general remarks apply to fields as to gardens. Another warning that is particularly true for fields: Whenever you use a selection tool that fits tight around the object you wish to catch, such as the select-by-color, or the select-connected-region tool, you may get a fuzzy selection. This means that the border is only partially selected. When you rotate this selection or move it around, you will get a "dirty" trail. Look for this by creating a temporary white plane as backdrop below your field and look for hazy one-pixel wide debris. This can be avoided by un-selecting the options "smooth borders" with these selection tools. But this is not the default in the GIMP.

Brush

With the brush layer I categorize brush itself, i. e. bushes, and shrub; but it also applies to fences. The pattern fill we use has a "dual use". Consider that we also use a brush for drawing purposes. So read carefully, lest you tread in thorns.

Let's deal with wild growing brush first. Select your area for this undergrowth that is not hedged with your favorite tool. You can either use the lasso right away or draw a colored area approximating the desired area and then choose color select. Color it all black. Then choose the Filters>Noise>Spread function. Apply this filter and then select all black colored pixel with a threshold of 0. Check that threshold, since at times it is changed for other activities. Now increase the selection by 1 pixel and then descrease it by the same amount again (you need to check that the decrease-from-border checkbox is not selected). This should give you a well-connected, irregular region. (You have used this technic before for roads and water.) Delete everything on the outside (by inverting the selection, press Delete and invert again). Then fill everything with black. When filling, be sure to select "Fill whole selection". Annoyingly, this is often not the default. If you want more ragged brush, you should increase the spread slider in the Noise filter.

Now, select the fenced brush. This need not be made irregular. So just fill everything. with black now. In case you prefer some irregularity even for fences, you need to to repeat the procedure above with less alpha, less threshold or use the eraser some. Be sure to conserve the more irregular brush from the previous step, if you have any. Now select everything black for the next steps.

Select Pattern-fill and choose the Pattern "Harn Local: brush". Note that there may be an "interior" of almost the same name, which you should not choose here. Fill the selection with it (after clearing out the black!) and you have brushes where you want them. This could be it. But I consider the boundaries to be too rough. Use Selection>Boundary and choose a width of 2. Now descrease the selection by 1 with Selection>Decrease. You might ask, why we didn't select a boundary selection of 1 in the first place? The GIMP has an inconsistency here. With 1 the boundary selection will be width 1, while with 2 and greater the selection will be 4 and greater, i. e. twice the entered value. But we want exactly 2. Now blur the selection with Filter>Blur>Gaussian Blur and a value of 1. This give a more appealing border to the brush fields.

Using a spread value of 0 for brushes Using a spread value of 10 for brushes Using a spread value of 25 for brushes Using a spread value of 50 for brushes

The images above have been used with various spread noise thresholds. As you can see, if you choose anything but 0, be aware that the "making contiguous" procedure above will increase the area. You have to experiment, but I think its almost equal to the spread value itself.

Woods

Select the woods layer and select the area you wish to cover. Be generous. Then choose the bucket fill tool. There check the radio button for pattern fill and select the pattern "Harn local: Woods". Fill the selection and then anchor it. Now use the eraser to get a line along the trees and not as it would appear straight through them. Some people prefer the "magic sissors" for that but I prefer erasing. Again, when satisfied move on to the next layer.

At times this may seem a lot of work, particularly if you have a lot of small patches. In that case you may select one of the patches and rotate them a bit, or take a mirror image, and place them were you want them. To make it look even more irregular, try adding a single tree or removing one.

The boundaries of the wood sometimes will appear to ragged after you erased the borders. Apply a Gaussian blur to the border only. I did in the above image with a radius of 2. Select all (e.g. by using a color select with threshold 255) and the choose Selection>Border and choose a width that matches your blur radius (in my case 2).

Elevation, Text

For elevation lines you decide how many lines you wish to draw. In very steep terrain, you want to draw more, but basically 2-3 lines will be all you need. Say, one of you lines is to be at 10ft elevation. Then select all the area to be above 10ft elevation. Select the border of your selection with 1 pixel width. Fill it with the color of the elevation lines. I choose "400000". You proceed in the same manner for all elevation lines. Another option is to draw the lines with a brush of 1 pixel width, if you have a sure hand. I need to correct my lines too often for this to work for me, a selection is easier to modify.

Text is pretty straight forward. Select the text tool and click at the place where you want the text to go. Type and then close the text box. You will find that you create a lot of text layers. I prefer to unite/merge them all into one and then select the individual text blocks and shift them around, in order to fit better into or next to a house and such. To do that, make all layers, except the text layers, invisible and then choose "merge all visible layers" from the layer menue.

Remarks

Don't be afraid to use the zoom tool. Take a look at the image at 400% zoom. It's easier to work at such scales sometimes, particularly when clearing woods at some border. Better control pays off in the end for better quality.

If you have a predrawn sketch you scanned in, you can us it as your background instead of the green one. Add the green one on top and keep it invisible until the map is completed.


Any Rights I hold to the material linked from this page are licensed under the BY-NC-SA Creative Commons license. The rights of third parties to this material need not be licensed like this. (Also see below.)

BY-NC-SA


Hârnworld and Hârnmaster are copyright by Kelestia and/or Columbia Games.
Copright 2009 Michael Jung < miju@phantasia.org >
Contents