Graphics help required to figure out basic scaling

gilbot

Member
Hello all,

I am working on a basic platformer framework to produce a few "mini games" just to get my feet wet before moving off to a larger project.

I have followed multiple tutorials and have a few things working smoothly. Gravity, collision detection, jump height(s) based on jump button presses short shallow press = shorter jump long held button press max height jump, wall jumps figured out and now gamepad support is done.

Now I am moving away from the basic tutorials and planning to add my own art and to build a few levels. Once done I plan on uploading to opera gx.

I am going for a pixel art game following the mario 3 scale. Character @ 16 x 32px tiles @ 16 x 16. When creating my rooms what is the typical "math" one should use for such sizes? is there a formula? I am looking to have the finished products at full screen. I am lost when it comes down to scale.


Any and all help welcome.

Thank you all very much.

- gilbot

going half 1920 X 1080 = 960 X 540 looks decent designing levels and running at full screen. Now I will manipulate the width to extend the level(s) and possibly the height as well. Then use a viewport using 960 x 540 and see if that looks good.

Is there a process to this or is it more trial and error?

anyway, looking forward to any replies.

Cheers folks
 
Generally, you want your camera size to be integer multiples of your intended screen resolution, so your implementation of 960x540 is ok. The room size can literally be anything, although it's generally better if it rounds into your cell size (probably 16x16 if I'm understanding your post correctly) with no remainder. So some multiple of 16 for the width and some multiple of 16 for the height (though it doesn't have to be a multiple, it's just that if it's not a portion of a single cell will be cutoff on the right and/or bottom side). Doesn't matter if it's rectangular or square. Just divorce the room size from the camera size in your mind. The camera is just a little "portal" you are looking at the room through. I think that's all you're asking about?
 

gilbot

Member
Generally, you want your camera size to be integer multiples of your intended screen resolution, so your implementation of 960x540 is ok. The room size can literally be anything, although it's generally better if it rounds into your cell size (probably 16x16 if I'm understanding your post correctly) with no remainder. So some multiple of 16 for the width and some multiple of 16 for the height (though it doesn't have to be a multiple, it's just that if it's not a portion of a single cell will be cutoff on the right and/or bottom side). Doesn't matter if it's rectangular or square. Just divorce the room size from the camera size in your mind. The camera is just a little "portal" you are looking at the room through. I think that's all you're asking about?
Excellent thank you for clarification. This is exactly what I am trying to ask, but couldn't really form it into a decent enough question.

Cheers
 

Yal

šŸ§ *penguin noises*
GMC Elder
If you're curious, the NES and SNES both ran with a 256x224 resolution, so 640x360 is the closest dividend of 1920x1080 that doesn't give you less room to work than the retro consoles. 360 isn't evenly divisble by 16 so you'll "leak" half a tile at the bottom of rooms, but that usually actually looks good (giving the impression the world continues outside the level) so I wouldn't really care about it in your shoes.

When creating my rooms what is the typical "math" one should use for such sizes? is there a formula? I am looking to have the finished products at full screen. I am lost when it comes down to scale.
I'd say it's easiest if you start by deciding how many "screens" big you want to make your room, and then make a room that size. (E.g. a 10x1 screen room would be 6400 x 360 pixels).

There's four major types of level: horizontal with no vertical scrolling (Nx1), vertical with no horizontal scrolling (1xN), bidirectional scrolling (MxN) and single-screen (1x1). This probably sounds incredibly obvious to you, but it's worth keeping in mind they act differently in subtle ways! For instance, if there's vertical scrolling at all, you have the potential to have blind jumps ("leaps of faith") where the player can't see the platform they're supposed to land on, and this usually is really bad (especially if death has big consequences), and in single-screen levels, it's important to remember the HUD can obscure the player's vision so you can't use all the available space.

Most of the oldschool Mario games use pure horizontal scrolling because of this, it means you have full control over what the player can see at any given point in the level, so they will see the entire obstacle at once whenever it scrolls into view.
 

gilbot

Member
If you're curious, the NES and SNES both ran with a 256x224 resolution, so 640x360 is the closest dividend of 1920x1080 that doesn't give you less room to work than the retro consoles. 360 isn't evenly divisble by 16 so you'll "leak" half a tile at the bottom of rooms, but that usually actually looks good (giving the impression the world continues outside the level) so I wouldn't really care about it in your shoes.


I'd say it's easiest if you start by deciding how many "screens" big you want to make your room, and then make a room that size. (E.g. a 10x1 screen room would be 6400 x 360 pixels).

There's four major types of level: horizontal with no vertical scrolling (Nx1), vertical with no horizontal scrolling (1xN), bidirectional scrolling (MxN) and single-screen (1x1). This probably sounds incredibly obvious to you, but it's worth keeping in mind they act differently in subtle ways! For instance, if there's vertical scrolling at all, you have the potential to have blind jumps ("leaps of faith") where the player can't see the platform they're supposed to land on, and this usually is really bad (especially if death has big consequences), and in single-screen levels, it's important to remember the HUD can obscure the player's vision so you can't use all the available space.

Most of the oldschool Mario games use pure horizontal scrolling because of this, it means you have full control over what the player can see at any given point in the level, so they will see the entire obstacle at once whenever it scrolls into view.
Thank you for this. More info to chew on and stuff to test out.

I was initially just planning on pure horizontal scrolling, but now I have been incorporating vertical "travel" within the levels / rooms. Something now that would resemble metroidvania, I would guess (hollow knight, castlevania, axiom verge)... so Bi-Directional scrolling.

As you have mentioned I have noticed some tile leaks as you have said while designing the levels (tiles overlapping trying out different room sizes). This hasn't really bothered me, also I have incorporated blacked out tiles at the very bottom and top edges of the rooms to counter this and to frame it a bit.

I am trying out 32x32 tiles at the moment, just playing around getting a good feeling of what to finally commit to. I do like the additional details, 16x16 is obviously easier but I can resize all my tiles in Aseprite then add the additional detail with no worries.

Thank you once again for the reply. I will re-read it over and over then next few days while playing around. I feel that soon I will find something that works and feels right with bi-directional movements / scrolling.

-gilbot
 
Top