Title Sceen WIP

[Mathcong]

Hiya,

worked a bit on the opening screen for a game,

looking for any tips to improve clarity, design/composition

Added a grey layer to get more of a background/foreground feel



without grey layer:



was also thinking of doing a small animation like this:



thx for reading

[eishiya]

The grey layer is so faint that it doesn't help, the background is still very bright/contrasty. Also, when you want to reduce the contrast of something, quick-fix adjustments like this are usually a bad idea, because they can make the whole piece look dull, often without fixing the fundamental contrast issues. Manual colour adjustments (e.g. making the colours closer to the ambient colour, which would probably be the sky blue in this scene) and reducing the number of colours used for distant objects (because distant details are harder to make out) are the more effective techniques.

I think the character animation would be great! Some subtle animation in the background would also be nice.

I was going to suggest having the character cast a shadow, but I think they already are...? it's hard to tell whether it's a shadow from them, or from the shape of the rocks. The rocks themselves feel more like a pile of rocks than a cohesive surface that could form an overhang/cliff the character could stand on, because they're all uniform in size and shape and have a lot of shadows (=separation) between them. Overhangs like this are typically a single rock (or a single tight blob of dirt), perhaps with some smaller/debris rocks on it (or embedded into the dirt).

[Mathcong]

dang, someone already told me about shifting the colours to the ambient color before, guess i just completely forgot lol

here's an attempt, maybe i need to push it further:



some other rock ideas:





as for background animations, do you mean the clouds moving? or smaller things like birds flying up

edit: 3d-ish letters

[Mathcong]

another update, more "oriental"  looking font and cloud scrolling in unity



the little select arrow isnt pixel perfect but thats some unity stuff :p

[eishiya]

I like where you're going with the animations, but the animation happening on a different pixel grid to the "pixels" in the art looks strange, and makes the various tangents in the art more obvious.

On a similar note, mixing different pixel sizes like you are with the art and text doesn't look great IMHO.
Will the actual gameplay have the same resolution as this title screen? If not, I recommend making the two match. Then, chances are you'll have plenty of space for text and smooth animations without mixing scales.

That said, mixing scales is a taste thing, so if you really like the look of it, keep doing it.


I like the rocks you chose. Consider making some of the lines between them implied/broken, they don't all need to be solid. That might help the surface feel more cohesive while still looking rocky.

[Mathias]

Hey, Mathcong. Good effort. Here's my quick take -

Mismatched pixel grid issue aside (that's a tough one) -

---Game is called "Slashy Ninja", which sounds pretty action-oriented and violent, but the title screen couldn't be more calm and tranquil, featuring a generic but solid mountain/sky horizon scene. [insert any Bob Ross quote]
I feel this title screen concept and the game's apparent concept clash. (Based on the name I'd guess it's a bloody Ninja Gaiden-like platformer.)

---I think title screens are super important. Gotta be good. Especially the game's title text.
Think of your game's title screen like a book cover - What do you assume about a book if even the cover is boring and unappealing?
A book cover's job is to grab attention and make you want to open it. For small indy games, the title screen often doubles as the primary key marketing/promotional art.

---Here's a super fast edit mainly addressing foreground/background separation:


I'll let it speak for itself, might give you a few ideaz.
Definitely do animate it. I love the bandana blowing in the wind.

[Mathcong]

I like where you're going with the animations, but the animation happening on a different pixel grid to the "pixels" in the art looks strange, and makes the various tangents in the art more obvious.

On a similar note, mixing different pixel sizes like you are with the art and text doesn't look great IMHO.
Will the actual gameplay have the same resolution as this title screen? If not, I recommend making the two match. Then, chances are you'll have plenty of space for text and smooth animations without mixing scales.

That said, mixing scales is a taste thing, so if you really like the look of it, keep doing it.


I like the rocks you chose. Consider making some of the lines between them implied/broken, they don't all need to be solid. That might help the surface feel more cohesive while still looking rocky.

how important do you think it is for the menu to be the same resolution as the gameplay?

the menu is like 120x64 and the game 480x256 so like 4 times the pixel count, and im not sure i can make it look good.

I had a little try at it with varying results lol:



i will make sure the text and animation are the same grid/ scale though, thx

Hey, Mathcong. Good effort. Here's my quick take -

Mismatched pixel grid issue aside (that's a tough one) -

---Game is called "Slashy Ninja", which sounds pretty action-oriented and violent, but the title screen couldn't be more calm and tranquil, featuring a generic but solid mountain/sky horizon scene. [insert any Bob Ross quote]
I feel this title screen concept and the game's apparent concept clash. (Based on the name I'd guess it's a bloody Ninja Gaiden-like platformer.)

---I think title screens are super important. Gotta be good. Especially the game's title text.
Think of your game's title screen like a book cover - What do you assume about a book if even the cover is boring and unappealing?
A book cover's job is to grab attention and make you want to open it. For small indy games, the title screen often doubles as the primary key marketing/promotional art.

---Here's a super fast edit mainly addressing foreground/background separation:


I'll let it speak for itself, might give you a few ideaz.
Definitely do animate it. I love the bandana blowing in the wind.

i guess i din't give much info about the game itself, but it is gonna be a more laid back, adventure platformer.

Thats also why i changed the font in my last update, the previous one for sure looks more action/ street fighter oriented.

your edit is very helpful though, i will add some reflections to the lake and make the mountains more blue-ish

[Mathias]

480x256? I think you might be after 480x270. A lot of modern pixel games run at 480x270, including Enter the Gungeon and Hyperlight Drifter. Maybe you're not accounting for HUD in those dims.

I would settle on a pixel size for all graphics and just stick to it.
The menu being significantly lower res than the rest of the game seems strange. If filling a large 480px wide screen with a nice title screen graphic seems too challenging, try coming up with a simpler concept.

[Mathcong]

480x256? I think you might be after 480x270. A lot of modern pixel games run at 480x270, including Enter the Gungeon and Hyperlight Drifter. Maybe you're not accounting for HUD in those dims.

I would settle on a pixel size for all graphics and just stick to it.
The menu being significantly lower res than the rest of the game seems strange. If filling a large 480px wide screen with a nice title screen graphic seems too challenging, try coming up with a simpler concept.

I guess the main challenge for me would be the character in the title screen.

i feel like i can't use the same cartoony/simplified shapes i would use for a 32x32 character, and would have to go near human-anatomy :



the background i could handle, made a few of that size for the game.

here is some in-game footage, maybe that will clarify:

[eishiya]

Treat your title screen as an opportunity to fill in the details that the game has to simplify away for the sake of simplicity and readability. What do you want to tell the player?

Think about the composition as well. With a larger canvas, you're not as limited as you were with the older version. Having a huge character like that comes across as the character has or will conquer this world, that the world is meant to feel insignificant compared to their (=the player's) skill. If, instead, you want to communicate the world being vast and something to explore, then it's good to have a much smaller character, perhaps even as small as the original sprite.

Edit: Minor nitpick about the gif you posted: It looks good, but the style of the lights is inconsistent. The light halo around the character has soft edges, but the environmental lights have hard edges. IMO the hard edges suit the art style better, I think the character would look better with similarly hard-edged lighting.