Envision, Create, Share

Welcome to HBGames, a leading amateur game development forum and Discord server. All are welcome, and amongst our ranks you will find experts in their field from all aspects of video game design and development.

Mapping with arion: Woods

arion

Member

NOTICE!
Many of the images in this tutorial have been lost from my photobucket account due to difficulties.  Because of this, the tutorial is obsolete.  If you wish to read it anyway, it will be available below for reference.




When reading this, keep in mind that it is only my method, and my opinions on the details. If i happen to think that a tree on top of the water looks good, that doesn't mean anyone else does. ^.^

I suppose i have nothing to say, so i'll just jump right in:

Step one: ground details
Okay, beginning with our blank, grassy canvas, we will start by placing roads.
This time, i want to make 3 entrances to this small 20x15 map. So i will make a fork in a narrow path like so;
http://i81.photobucket.com/albums/j205/zanbatou-T-S/stepone.png[/img]
Sorry for the square =P
Now to mix that up abit, i'm going to take the grass tile once again, and break pieces of the road. This will make it look less perfect;
http://i81.photobucket.com/albums/j205/zanbatou-T-S/steponea.png[/img]
For now, that will handle the roads. However, on the second layer, you can choose to use the dirt outlined auto tile to create some more grass patches in it. But that will be covered later.
_
So we'll add a small amount of water. The regular square water auto tile is bland, unnatural, and all around ugly. So we're going to use the rounded water auto tile by Cos
http://img111.imageshack.us/img111/2324/rounderwater5go.png[/img]
So we'll just add in some water like so;
http://i81.photobucket.com/albums/j205/zanbatou-T-S/steponeb.png[/img]
Remember that nature is random. While some things grow, and run in patterns, natural rivers, and forests tend to be much more chaotic.

for now, thats all we'll do for the ground detailing. But we'll come back in a bit.
_
Step two: Trees
Trees in a forest are usually very compact, and quite hard to navigate. While iit appears to be one of those things that RMXP can't pull off, it's actually quite easily done.
There are other methods that others (and i) use, but this time, we'll start by taking the bottom 2 rows of the basic woods tree tile, and place them all over the second layer ONLY. As well as a few larger trees.
Taking care not to completely cover your road.
http://i81.photobucket.com/albums/j205/zanbatou-T-S/steptwo.png[/img]
you'll notice a few errors noted by a small red dot. These things happen when placing your trees. So you always want to look for errors after every single step. This way you won't have to do it at the end of your mapping sessions.
Just cover these up with the third layer, and replace the missing and over lapped second layer tree pieces.
_
Adding in the top 3 rows of the tree onto the 3rd layer, this will likely cause a small error or two every now and then aswell. Just repeat the same process, using the event layer if needed.
http://i81.photobucket.com/albums/j205/zanbatou-T-S/steptwoa.png[/img]
Also, notice that even after moving the two trees in the bottom right corner to the second layer, i still had to use the event layer to properly tile this small set of trees.
I see no errors. But there still isnt enough trees for a forest =/R
Repeating the last step, place more trees, keeping in mind whether or not they will cause errors when you add the tops of the trees.
http://i81.photobucket.com/albums/j205/zanbatou-T-S/steptwob.png[/img]
more red dots to show the events.
Now. Layering the trees so close together makes an error nearly every time you put down a tile. meaning you will switch between layers two and three almost constantly fixing them. So to cut back on time, and make it easier, try using the F6 and F7 keys to hop between the layers with ease.
At first layering your trees this way, and fixing the many errors as you go takes alot of time, and can get annoying. But once you've mapped for awhile like this, one map this size takes less than 7 minutes.

We'll leave the trees like that. Now we'll finish in some details to the map.
_
Step 3: Ground details part two; tall grass.
Since the edges of tall grass are on layer two and above only, it can get rather hard layering the trees and the grass. As a quick fix solution, i've wipped this up:
http://i81.photobucket.com/albums/j205/zanbatou-T-S/grassytallgrass.png[/img]
I used this when i first started mapping. it can be placed on the first layer, so it makes tall grass easier. Though there are some annoyances when using the bush setting for it. Thats why after getting used to it, you should start using, or continue using the regular tile.
Placing small patches of this grass everywhere, it creates another little extra touch to the map.
http://i81.photobucket.com/albums/j205/zanbatou-T-S/step3.png[/img]
The red dot indicates where i used the regular grass tile. It can be used to over lap the road, and where the road once was.
_
Step four: small details
Now, the easiest part. Tiny little details.
Placing flowers, crab grass, stumps, rocks, leaves, and anything else your heart desires can easily fill up a map. Using a combined exterior pack, leaves countless options to fill up space,  even though the trees do a mighty fine job of that already.
So we'll start by placing a few rocks, stumps, flowers, and logs.
Then we'll add other details such as tall grass clumps, crab grass, pebbles and small rocks, holes, and anything else on the tile set. It's all there for you to use, so theres no reason not to use any of it.
http://i81.photobucket.com/albums/j205/zanbatou-T-S/stepfour.png[/img]
Lots of smaller details.
_
Step five: Road details
This part is simple aswell. Placing crab grass, clovers, passable flowers, roots, pebbles, and tall grass over the path, we can add interest to these untraveled forest paths. I usually start with the dirt outline auto tile to patch the path when needed. In this case it wasnt really needed.
So moving on to pebbles, and crab grass.
but first, a quick note on crab grass. While it is merely a space taker, the crab grass works quite well in many nature maps. Do to the naturallity of it, placing it in many large patches is okay. Think back to the time when your lawn hadn't been mowed for 3 weeks during the summer. All that tall crab grass sprouting everywhere. It grows alot out in the woods too.
Now, we'll add the road details, while leaving it to be what it is, a road.
http://i81.photobucket.com/albums/j205/zanbatou-T-S/stepfive.png[/img]
Since i left very little pathway to detail, there wasnt much to do with this map.
In the woods, and on mountains, the paths are often narrow, and hard to navigate. But for simplicity, it's best to avoid to many impassable objects on the trail. While the forested area is fair game.
_
Step six: Final details [optional]
This step is simply to look over your map for empty spots, cramped spots, things that stand out to much, rabid dino-ewok creatures, and errors.
If you see something you don't like, fix it. Usually, i just place a few flowers, and remove some road details if i've overdone it. But as it says, this step is optional, so i'm skipping it.
_
Step seven: Finishing touches
We'll be adding a tint, and a fog to the map now. Starting with the fog. Oh, and to make it easy, we'll only use a paralell process event.
Starting with the fog, we'll use the sandstorm 1 fog, set to 55 opacity, and sub blending. This will give the effect of sun shining through the tree tops.
http://i81.photobucket.com/albums/j205/zanbatou-T-S/stepseven.png[/img]
Now, we'll add a tint. I want it to be a warm summer afternoon. Just past supper time, heading toward the evening.
So for my tint i'll use these settings:
http://i81.photobucket.com/albums/j205/zanbatou-T-S/stepsevena.png[/img]
Now, i personally dont add animals to my maps untill i actually implement them. But if your never planning to, go ahead and add animals to your map if you wish. Weather effects, a nice calm background music, some birds chirping, all of this builds atmosphere. Which for me, is very important.

Also, for more about the fog, and tints, view the mapping academies tutorial section. (sorry, its down now, so no link)
_
The final product
http://i81.photobucket.com/albums/j205/zanbatou-T-S/finallayerone.png[/img]
apparently my least favorite layer
http://i81.photobucket.com/albums/j205/zanbatou-T-S/finallayertwo.png[/img]
And my favorite?
http://i81.photobucket.com/albums/j205/zanbatou-T-S/finallayerthree.png[/img]
http://i81.photobucket.com/albums/j205/zanbatou-T-S/finallayeringame.png[/img]
Not the best map ever, but its enough to show how i do it.
It's also important to remember to alway place things on the lowest layer possible. However, it helps to plan ahead with trees, and place half on layer 3 to begin with.


______
Coming soon...
Iceland mapping.
Desert mapping.
Island and Beach mapping.
Cave mapping.
Arions atmosphere theory. (maybe)

______
Hopefully that worked. This was made because of two people who asked me in PM, about how i map it all out.
However, it is still my first mapping tutorial, so comments,, and feedback are appreciated. Again, this is only my style, others may disagree with it. And there ARE other ways that are better, easier, and provide a better product.
 
This is a pretty good forest tutorial. Unfortunately I just happened to read this a couple hours AFTER I made my forest map. It's actually a pretty big forest, but here's a snapshot of it.

http://i38.photobucket.com/albums/e127/ ... orest2.jpg[/IMG]

I don't think it's anywhere near as detailed as yours is. Do you think I should add a lot more?

EDIT: I just changed my fog from shade01 to sandstorm01 with sub blending like you recommended, and it looks much better. I should really experiment with add and sub more often...I'm still not really sure what they even do.
 

ccoa

Member

Demystifying the Game Process":3kk476u0 said:
Blending effects the colors of the picture, how it "blends" with the layers behind it. Normal will show the picture normally. If you're familiar with any graphics program like Photoshop, you're probably familiar with Addition and Subtraction blending modes.

The Addition blending mode works as follows: Given a foreground and background pixel, represented by the RGB vectors F=[r1,g1,b1] and B=[r2,g2,b2], the pixel obtained from the Addition blending mode is R=F+B=[r1+r2,g1+g2,b1+b2]. Or, in other words, if a pixel in the background is color 100, 100, 100 in RGB values, and a pixel that will overlap it in the picture is 25, 50, 135, then the resulting color in the image is 125, 150, 235.

The Subtract blending mode works as follows: Given a foreground and background pixel, we'll again represent each as an RGB vector F=[r1,g1,b1] and B=[r2,g22,b2]. The pixel obtained from the Subtract blending mode is R=B?F=[r2?r1,g2?g1,b2?b1]. If the result of the subtraction is less than 0, 0 is used instead. So, using the above example, the same pixel would be 75, 50, 0 in Subtract blending mode.

Hope that isn't too technical.
 

arion

Member

Alright, the add and sub options do what they say. Add, adds to the color (using the graphic ofcourse) and sub, reduces the color. Basicly mixing the colours of the background, and the sprite. These can be used to make some pretty nifty lighting effects.

Your map is fine the way it is. It's mostly a matter of opinion. The fog you used, imo, should've never been created. But you caught yourself, and made the opacity really low, which makes it much more bearable.
While the small details are fine, you could try adding in a small creak, or even a hardly visible puddle of water. Aswell as a log or two. ^_^

I try to make my maps cramped, so i tend to add alot of details. But to fight that, i have never put my maps into a project and played as if i were an actual player, so it may be hard and annoying to traverse mine.
 
Small problem.

If you look closely at the final screenshot, there's a rabid dino-ewok creature near the bottom left.
 
Hey thanks I am not the greatest at mapping, especially forests :S This helped a lot :D

One problem I have I noticed is the large tree. It's shadow has a higher priority and when you step into it it cuts goes over top of the player, I was just wondering if you have done something to fix it?
 

arion

Member

I'm not sure if i understand your question.
I usually just allow the shadow to pass over the player. The only problem i ever have with the large tree, is that it sometimes over-writes the passabilities for smaller tiles underneath it.
 

arion

Member

that is likely the case.
This what my big tree's priorities are.
http://i81.photobucket.com/albums/j205/ ... /hellp.png[/IMG]
Try setting yours like that, and making the shadow less opaque.
If its not the priority, then having a lightly covering shadow will atleast make that less noticeable.

(also, this wont allow for the player to walk under it. Despite what i said earlier, i was thinking of something abit different at the time. I'm still resetting the priorities to test a over the head shadow for the trees.)
 
Yea that is how I have my priorities set. I will try making them less opaque and maybe try the shadow over head thing.
Thanks for the help.
 
This is an excellent tutorial. You could learn just by looking through the pictures. Thanks for posting this, I learned a lot.
 

Thank you for viewing

HBGames is a leading amateur video game development forum and Discord server open to all ability levels. Feel free to have a nosey around!

Discord

Join our growing and active Discord server to discuss all aspects of game making in a relaxed environment. Join Us

Content

  • Our Games
  • Games in Development
  • Emoji by Twemoji.
    Top