1080p Game with Large Assets- Running into issues

[SpunkyWunky]

I've been trying to make a game that is automatically fullscreen at 1080p or 720p at a minimum. I want the game to be close up, so everything from the background tiles to the sprites are all larger than 48 x 48. I've been running into a series of issues though that are all kind of interconnected.
My first issue is that I have a game that looks like this:


because everything is at a tiny 48 pixels, as opposed to this:


which would have the images take up more pixels on the screen like I want.

I've been messing around with custom assets (I want every asset in the game to be original) but without knowing how large images would work within the constraints of RPG Maker, it's hard for me to even make placeholders.

I've been trying to make larger images work in the tilesets, but it really doesn't work well with images so large. I'm seeing pieces of information about parallax mapping which is looking more like my better option. However, the tutorials that I've been finding seem to be aimed at people who are already well versed in RPG Maker and all it's plugins, or they only go into creating the map in photoshop and not how to turn it into a workable map in RPG Maker.

I kept trying though. I figured first things first, get my game to show in full screen.

I went into the Community Basic plugin and changed the resolution to 1920x1080p. This allowed my game to play over my whole screen (albeit still windowed), however the game was still a tiny square in the middle.


The only way I could think of fixing this is by changing the map dimensions. So, figuring that each tile is 48p, I changed the map size to 40 squares x 23 squares to try and get it as close to 1920x1080 as I can. But doing this has added black bars unless I force the game to open in fullscreen mode.


Also, it has a scroll top and bottom because 1080p = 22.5 48p squares, which I couldn't in fact punch into the settings.

How do I get around this issue?
I want all the assets in the game to be large, but it seems like this is not something that is commonly done and there seems to be less tutorials about it.
I want my sprites and animations to be large (Extremely large in some cases) and it seems counterintuitive to try and map these all out in 48 pixel squares. Am I missing something? Can you create all the images in the game like you would a parallax map image?

I've read through nearly all the beginner tutorials I could find. I'm at a point where I'm guessing what I want to do falls more into an intermediate category, yet most tutorials seem either beginner or advanced.

I have some learning difficulties and was hoping for some intermediate guidance explained simply. A little embarrassed about that.. but it is what it is.

 

[bgillisp]

First thing is you will have to make all maps larger than your screen. So if you want 1920 x 1080, since the grid size is 48 tiles, that is 1920 / 48 = 40 by 1080 / 48 = 22.5. Since you can't use a half tile, you will have to use 40 x 23 minimum for all maps. Anything else will look funky due to you not using up all of the screenspace.

Though...you might want to try using a 720p resolution instead. 1080 doesn't divide nicely by 48, which is some of the problem. But 720 / 48 = 15. You'll have to find some nice value to use for the width though that divides nicely by 48 (I think 960 will work?).

 

[Amarok]

i would consider using parallax mapping for the kind of look you want at that resolution. Modifying how the default mapping works to fit a new resolution is probably a lot more effort than its really worth.
Another approach would be using a plugin that lets you zoom the camera, maybe something like that exist already.
About making placeholders, to see how a graphic is going to look in game just look at it at 100% zoom in whatever graphical software you use.
You can also overlap a grid (in your case it should be 48x48px) in most graphical softwares to help you with the mapping.

 

[SpunkyWunky]

First thing is you will have to make all maps larger than your screen. So if you want 1920 x 1080, since the grid size is 48 tiles, that is 1920 / 48 = 40 by 1080 / 48 = 22.5. Since you can't use a half tile, you will have to use 40 x 23 minimum for all maps. Anything else will look funky due to you not using up all of the screenspace.

Though...you might want to try using a 720p resolution instead. 1080 doesn't divide nicely by 48, which is some of the problem. But 720 / 48 = 15. You'll have to find some nice value to use for the width though that divides nicely by 48 (I think 960 will work?).

I tried the figures that you suggested, however when I open the game, the game window is very small- and when I fullscreen it, it has black bars on either side? Fixed the scrolling issue though

 

[Andar]

you couldn't find it in the beginner tutorials because this is anything but easy and most people don't bother with it.

First a bit of technical background:
Resolution (in ppi = pixel per inch) = screen size (in pixel, for example your 1920x1080) divided by monitor size (in inch, the viewing screen on your physical monitor)

Because no one exchanges their monitor depending on which game they play (most people have only one monitor anyway), there is a direct association between resolution and screen size, and increasing the screen size will make the objects on the screen smaller. That is a technical and mathematical law.

What you can do to prevent that effect is to change the grid size for everything (that will require you to get all resources in the new sizes, but also enable you to get more details in) or to use a zoom plugin (which will distort the display a bit and cause quality loss due to the mathematical zoom formulae).
The advice about parallax mapping above will only be of limited help because parallaxing allows you to only change the optical display without changing the grid size that is the basic for most of the engine.

If you want to change the tilesize and gridsize, there is a plugin written by Shaz that does this.
I would suggest changing the grid size to 96 (2x48) and use Photoshop to resize all default resources by 200%, that will get you a better basics.
You'll need to work and playtest with different resources because the editor is still based on 48x48, but it should work.

 

[SpunkyWunky]

i would consider using parallax mapping for the kind of look you want at that resolution. Modifying how the default mapping works to fit a new resolution is probably a lot more effort than its really worth.
Another approach would be using a plugin that lets you zoom the camera, maybe something like that exist already.
About making placeholders, to see how a graphic is going to look in game just look at it at 100% zoom in whatever graphical software you use.
You can also overlap a grid (in your case it should be 48x48px) in most graphical softwares to help you with the mapping.

I checked out some zoom plugins and they seem to have more cons than pros (ie. pixelating the graphics and breaking the map). I'm not sure it's ideal for what I want to achieve?

 

[SpunkyWunky]

@Andar Thank you for breaking it down for me. From what I understand, most people have screens that present in 1080p, so games with lower resolution tend not to look as crispy? I'm just trying to future proof my game a bit, I think low res monitors are disappearing and people are enjoying HD more.
I took a look at changing the grid sizes of the images, but from what I understand- the events and the walking paths are still on a 48x48 grid, so sometimes there's weird clipping? Or does the Shaz plugin fix this? (I think it was the Shaz plugin I was investigating)

 

[Andar]

no, there is no clipping if its done correctly - and then the change includes the walking paths, which will then also be 96x96 based.
However, for this to work correctly everything needs to be changed correctly, and the change needs to fit into the autotile sequences (which is why I specified 96 and 200%, most other numbers will cause distortions due to the autotile structure) and a few other things like the screen size needs to be a multiply of the new grid size.

it requires some experimenting or a good knowledge of all involved aspects to get it done correctly.

 

[SpunkyWunky]

@Andar ok so my best option sounds like this Shaz plugin provided I can learn it properly. When you say that the screen size needs to multiply, what do you mean? Are you referring to how many squares are on the map?
Also, are the autotiles the entirety of the A tabs in the tilesets or just certain images on them? I'm not really sure what an autotile means (I'm guessing it has something to do with how it changes when you drag it over a large area as opposed to placing on one square). Auto tiles messed me up when I was trying to make a custom tileset earlier. I tried looking at the documentation in RPG Maker and just got more confused lol.

 

[bgillisp]

In all honestly, I'd just use the default resolution and grid size and tiles as a placeholder until more of the game is done. Changing the resolution can be done later once you know what graphics you need in full detail. Just a suggestion.

But also know that there is NO way to stop the black bars when you resize the game. That is because your game is still the resolution you specify, it is just stretched to fill the monitor. The only way around that is to force the monitor to change it's resolution to match yours, which is what I think is done by those big name games. Maybe there is a way to do it via a plug-in, but I'd worry about that when more of the game is done.

Basically...make the game first. THEN worry about making it look pretty.

 

[SpunkyWunky]

Basically...make the game first. THEN worry about making it look pretty.

I'm not really concerned about making it look pretty at the moment (the detail of the floorboards in the pictures above was purely because I was testing a tutorial on youtube). My main concern is, from what I understand, that before I know what method I'm going to use to do all the graphics, I can't start programming tiles with events (eg. If my event takes up 4 small tiles instead of 1 big one). I've got the story essentially mapped on paper, so now I'm at the programming point. However, I really don't want to be double handling too much as we're such a small team building this game.

 

[Andar]

OK, I don't have time for everything but I try to get you a list for the rules:

1) the internal display engine reacts badly to partial tiles. Which means that your screen size has to be the map size of your smallest map multiplied with the grid size. If your smallest map is for example 20x11 and your grid size is 96x96 pixel, then your screen size has to be 1920x1056. 1080 will not work flawlessly because it is not a multiple of 96.

2) the black borders are caused by the display driver of your graphics card when the selected screen size does not fit the screen size of the monitor. 1920x1056 on a display with 1920x1080 pixels means that there are 24 pixels missing, or a small black border of 12 pixel each left and right.
Some display drivers have the option to zoom instead of filling up, but that will distort your display.

3) autotiles are all on the A tab, but not all tiles on A are autotiles. The autotiles are those that change their borders when drawing a larger area. The engine does that by segmenting the displayed tile based on quartertiles, and if the resized tileset does not fit into that quartertile structure, the borders will no longer fit and the map gest pixel repeats.

4) the tilesets need to be exactly the size required for the structure of the slot. And the editor can only handle 48x48 sized tilesets, the plugin allows you to change that on playtest and deployment only.
That means you have to use a regular tileset for the editor and exchange that with a resized tileset only for playing the game.
Using the resized tilesheets in the editor will clip most of their parts away.

 

[SpunkyWunky]

Thanks so much for taking the time to respond. I'll try out that plugin and see if I can mess with it a bit

 

[Llareian]

I think there's an element here that you've all missed...MV games do NOT necessarily (or even USUALLY) run at the resolution specified! Try to set the resolution to something larger than your monitor size; the system will zoom it out to make it fit on your screen. This is a powerful and also sometimes hard to handle aspect of MV.

If you set the MV screen size to the same size as your monitor, it will get zoomed out. This is because it can't run at the same size as your monitor; there's the application's title bar at the top, and your taskbar at the bottom (or wherever your silly Mac taskbar is these days ) cutting into its height. So it zooms it out to however many pixels are left over, which means that the width gets reduced, too, and you get black bars on the sides.

If you know exactly which operating system you're deploying to (and which device, for mobile), you can (for some of them) figure out what size that leaves, and plug that in. However, that's not only extremely tedious and liable to fail for some cases, it just...isn't worth it! Your player will get used to the black bars very quickly, I promise. Not to mention the fact that unless you use a plugin (or rewrite your package.json file) to stop them from resizing the window, they can always change the window shape in some way that imposes black bars.

The other thing you need to remember is that this zooming capability means you can make your game at a smaller resolution than 1080p, and as long as the ASPECT RATIO is an HD ratio (or very close to it) it will look reasonably close to truly full-screen when the window is maximized (as mentioned, there will still be black bars on the sides). The aspect ratio for HD is 16:9. (This means your width/height = 16/9.)

Play around with some lower resolutions (as @bgillisp mentioned, 720p, which is 1280 x 720 px...I think MV looks really nice at this resolution). As I said, when you maximize the window it will zoom in...no need for a plugin.

 

[SpunkyWunky]

@Llareian, thanks for explaining further!
I tried messing with some aspect ratios. I think by changing what is commonly thought of as set aspect ratios (16:9 at 1920 x 1080) into something divisable by 48 (16:9 at 1536 x 864, map size 32x18 squares) I'm able to make it work. The windowed game has no black bars and the full screen game has no warping, pixelating, scrolling or anything, it just fits the screen.
Now I'm presuming that these pixels will work on most desktops (I'm intending it on just being a desktop release). I can half the pixels and squares I used, which zooms it in when fullscreen and achieves larger assets, but it also reduces the quality.

Ultimately, I understand that the RPG Maker community are pretty forgiving when it comes to things like the black bars or pixelating. But I want my game to look polished to those that aren't as forgiving. End goal is to get people who hate RPG Maker Games to play my game