Use what you have to make a costum and nice titlescreen

[Avery]

First impressions count. And when you wrapped up your game you probably don’t want it to look like this

when your players start it.

Nothing bad about the default titles, but do they really grasp what your game is about? And always consider that an avid player of maker games might already have seen this specific screen at the start of other games…

What you put on your title highly depends on your game and it’s content and there is no “this is the perfect and only way”, but there are many roads you can take.

So let us imagine our example game Project1 (because our main hero is the chosen 1) is your basic medieval fantasy adventure with a cast of four heroes looking out to slay the evil red dragon.

So my first idea might be: I want this epic showdown to be my title screen, it is the whole point of the game and I want it to be the first thing the players see!

And the clue: I get what I want with (nearly) no drawing!

But wait. I might not be able to draw that.

Shall I scrap this idea now?

Of course not!

Step one for every title screen is:

Gather what you have

For each character you usually have a face, a SV battler and a charset (I skipped the static battler and the picture, as those are less common and I want it to be as approachable as possible! So I only used what the generator would have provided me with.) Look through every folder and be generous, above you can see what I collected for this example here. Some are just “possible skies”, others are “nice rock structure”, and I included everything from tileset over battlebacks to default title screens.

Tip: copy everything that seems even slightly usable into one folder so you have a good overview over the parts you have at hand

Now it is time for a small analysis of the default layout, if we want to stick with what the engine hands us:

The titles are always displayed in the same font and style by default, and for the selection you can adjust it in the database.

Tip: Test out where title and selection are placed and make a screenshot of a version with your final title and desired selection placement, those are the places where you don’t want important stuff to be, as those would be covered!

With that in mind, we can do a quick sketch of what we want for our title:

I envision my heroes to stand in the foreground, maybe on some kind of cliff, with a rocky or lava covered gap and in the background smoke and mountains with my evil dragon, with a flame behind the title. This is also as far as your drawing skills have to go to get a proper title screen done this way!

This is only a rough composition, and now we can compare our sketch to the graphics we gathered and see if my idea is doable.

And hey hey hey, look at the Mountain title screen, a nice cliff in the front!

We roughly chop it out, copy it onto a new layer of our screen and keep searching!

EVERYTHING STAYS ON A SEPARATE LAYER AS LONG AS IT CAN
Merging layers too early can make further editing very difficult!

And we keep doing that for all parts of the screen, for example:

• the battler of the dragon

• cliffs from the wasteland battleback

• the lava battleback

• and the other lava battleback

We now make a mental note that we will use the SV battlers for this type of composition, as those are the largest full body graphics we have for our characters. Also, we switch off the dragon layer for now and focus on the background first.

Tip: You will probably not 100% meet your wishes, but you can probably find a compromise that matches your game. Also keep in mind that I stuck to the default MZ files ONLY here, if you add all the (free) resources out there, there is a good chance you can get a really nice result!

Of course, for now, this looks super messy and weird:

Now we start going through the image layer by layer and erase the parts that we need to get rid off around the objects we want to keep.
Tip: Start with the foreground, as for the background you only need to clean up the parts that are not covered by a front object!

You can try “select by color”, but as you can see, this does not really work well for everything:

For this example, I used only the eraser (the branches are visible in this step, but later I “shaved them off” with the eraser as well), a harder one for the tops and a soft one for the bottom of the wasteland rocks to blend in.

This already looks pretty nice, right? Well, besides the cactus and the grass…
By copy and pasting parts from the same wasteland mountains onto those areas and blending them in with a soft eraser, they become history:

This was also the time I rechecked my folder with gathered resources and decided to drop in the smoke battleback:

At this point, everything looked nice, but the colors were waaay off. So now we first check the brightness and contrast of our screen by adding a gray layer that we set to “HSV Saturation” as layer mode:

This way we can identify differences in brightness and contrast and can adjust the layers in regards of both:

After this adjustment we switch that layer off and do the color adjustment. Often a simple hue-saturation command will do the job:

After adjusting all the layers we have some nice dark lava mountains…

…and that was the part where I and the branches broke up and the most drawing of this full screen happened. I erased them and simply drew them back in with a 1px brush:

I felt like I wanted a slight orange shine on my foreground, so I selected everything that was not foreground by select by color on the transparent part of it, made a new layer and filled the selection orange and added a slight gaussian blur to it:

After that I used the “create layer mask from alpha channel” command on the foreground, copied that layer mask and pasted it into the layer mask of the orange layer:

Another option would be to copy the layer, as I did for the mountains here, recolor that to orange…

And then give it an all black layer mask and use a very low opacity white brush to place some highlights:

With the background good as is, time to place my characters and the dragon:

To make the dragon fit in better, it was rescaled and “oilified”. The filters might look odd, but especially with low settings they can help you adjust things to match each other.

Take your time until you are happy with the result, and try around!

You might also want to place highlights on the character, again, drawing them in on a separate layer…

… and treating it with gaussian blur and lower opacity setting.

For the heroes, the annoying part of making SV battlers are all the different frames. The good parts are having all the different frames to choose from!

Make sure to treat them with color adjustments as well, and this is the one time where I found blurring out the pixel art with the “noise reduction” filter helped make it blend in better!

And after placing some additional tiles (rubble on the foreground and the dragon skeleton, both color adjusted, with noise reduction and the skeleton with a “perspective” command adjusted, we are good to go!

 

[Kes]

Done in your usual thorough but accessible way. I am sure that this will help a lot of people.

 

[nbgamemaker]

thanks for the advice

 

[eomereolsson]

This already looks pretty nice, right? Well, besides the cactus and the grass…
By copy and pasting parts from the same wasteland mountains onto those areas and blending them in with a soft eraser, they become history:

Every time I attempted something like this it looked absolutely horrible. In contrast with your example I can't really tell where you removed something even though I know exactly where to look.

I would be very happy if you could break this step down a bit further. Maybe show a screenshot of what you copied pre-blending and a few sentences what your approach to blending is (apart from using a soft eraser).

 

[Avery]

Sure!

I don't have the exact file in that state around anymore, but here is a recreration of the method:

Basically, our starting patch was this part of the default Wasteland battleback, just mirrored and later "cleaned up" from the surrounding, that is where that step started.

Roughly like that:

Now I have basically two possible sources for "patches" to place over the plants: this piece, but also the original unedited battleback I started with. You see on the left side a whole mountain that is not part of my compositing at all and therefore has "unused stone patterns".

So... I can copy this piece with the free select:


And slap it onto my edit on a new layer.

But that chunk is waaaay to large, so I set this piece to semi transparent to see which part really needs to stay and use a soft eraser to blend it in:
Before:


After:


I trimmed the bottom with a hard eraser, but all other sides with a very soft one so that it blends in well, which for such structures usually works. Here is the piece as is:


And that is what I do for all plants, I look for a thing that works as patch, copy and paste it (it might also have to be flipped and/or turned) and then blend it in. Sometimes you need a little extra recolor on a patch, it all depends what you are working with.

Good luck with your edits!

 

[eomereolsson]

Thank you so much

 

[TheAM-Dol]

Avery; Goddess Savior of RTP rep.