Spherical forums

General Discussion => Off-Topic Discussions => Topic started by: DaVince on August 13, 2017, 02:41:16 am

Title: Pixel size consistency in video games
Post by: DaVince on August 13, 2017, 02:41:16 am
(As a response to Miscreant's project ZeC screenshots) It looks neat, but if you'll permit me a bit of criticism, the resolution of some of the elements doesn't really match up. ThatsNoLink, as well as the GUI, are shown at a 1x pixel size compared to anything else on the screen, which is 2x pixel size. This basically destroys the illusion that this could be a game running on an old system, and is just a little inconsistent in general.

That said, I very much like the progress you are making with this, all the ideas you have for it, and I'm looking forward to the moment you release something. :)
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 13, 2017, 04:35:46 am
ThatsNoLink, as well as the GUI, are shown at a 1x pixel size compared to anything else on the screen, which is 2x pixel size.

Considering this is my first ever Sphere project, I welcome thoughts and input. If you wouldn't mind would you explain a little further what you mean by 1x/2x pixel size?
Title: Re: Pixel size consistency in video games
Post by: DaVince on August 13, 2017, 05:35:23 am
Hmm, I would say this is more of a game design thing rather than specific to Sphere.

What I mean, though, is that the map is scaled up 2:1 whereas the sprites, text and window border all use 1:1 pixel sizing. The result is that some of the elements look too detailed or small compared to others, and inconsistent.

If everything were scaled at the same scale, you would get something like the attached picture (everything 2x size). Note that the player sprite got resized to be twice less detailed too though, since you're using a large sprite on a resized map.

A bonus to this is that you could then actually scale everything back to 1x size, which means that in this case the map would be 16x16 tiles rather than 32x32 tiles with scaled up graphics. The game would run in a smaller window (320x240) but this would be scaled back up by the game engine.

Edit: I just noticed, but the map itself isn't sized exactly 2x its original size either, creating some further visual descrepancies. I guess you were just trying to fit the sprite into the map?
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 13, 2017, 03:07:44 pm
As a stepping stone into javascript coding, which I have not done this extensively before, the most Javascript I had ever done was tiny little scriptlets here and there for web page development and certainly nothing as extensive and as in depth as Sphere. Most of the games I developed in the past were static images. Everything was from the perspective of the player, much like Dungeon Master or the Wizardry series of games.

When I discovered Sphere and started this project I had never used tiles or sprites before. My first draft was at 16x16 but it strained my eyes to create with such a size. With ZeC, everything is custom at 40x40. That was before I read a bunch of different articles and tutorials about sprites and tiles.

While I create ZeC, I also have a 2nd undisclosed project (The Character model I posted in 'Script Support') I've been developing in the style of Final Fantasy that uses 32x32 sized tiles. I have 2 spriteset for each character. A map and a town spriteset, sized 32x32 and 32x48 respectively.
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 13, 2017, 07:42:05 pm
@DaVince I did some resampling and recoding to compare the 2 side by side. I have not recoded the inventory screen yet but is this more along the lines of what you were talking about?
Title: Re: Pixel size consistency in video games
Post by: DaVince on August 14, 2017, 06:04:35 am
Hmm, you seem to have addressed a different issue entirely, and that is that the map was sized at a non-integer scale. I guess I'll address that first.

About that though: the map in question has been scaled at a non-integer size. When resizing graphics, it's recommended to use exact size increases. For the Zelda map tiles, this would entail taking the original graphics and scaling them up *exactly* 2 (or 3, or 4...) times.

If you scale it up by, say, 2.5x the size, this creates a visual inconcistency and will look "ugly". What happens there is that one original pixel will take up 2x2 pixels in the resized version, but the one next to it may take up 2x3 pixels, then the next one 2x2 again and it creates an inconsistent effect on the end result.

In the example  shown, I zoom into a bit of your map to show how each original pixel is now a different size, and also an example of resizing a 1x1 scale map to be exactly 2x2, which means every single original pixel is always the exact same size.
Title: Re: Pixel size consistency in video games
Post by: DaVince on August 14, 2017, 06:36:17 am
As for the issue I was originally getting at, it's that you're resizing the map graphics at all while not also resizing the things like sprites, windows and text accordingly. This creates a different kind of inconsistency where small, crisp elements are overlaid onto a large low resolution map. In the mockup I made, I made everything the same size (2x scale) to demonstrate this.

You could be using Zelda's original graphics just fine without resizing them, although it would require you to scale the player sprite done, making it lose some details. But maybe it'd be better to find a sprite with the right size (around 16x16 pixels) rather than the large one you're using anyway. :)
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 14, 2017, 09:45:23 pm
@DaVince I've spent a few hours doing scaling tests. I brought the whole project back down to the original 16x16 tiles, had to eliminate my font due to it's size and the custom Link sprite has been reset to the sprite from the original LoZ.

As you can see from the attached screencaps, when scaled up the image of Edward (The Spoony Bard) has a good amount of loss of quality to it.
Title: Re: Pixel size consistency in video games
Post by: DaVince on August 15, 2017, 08:54:38 am
Aw, I thought the original font was the perfect size for those text boxes... In fact, isn't it even smaller than the default font? I guess it's too wide, but you seem to have enough space for three lines of text. Well, this is all up to you of course.

I can see why the character image would be suffering from making it smaller than it's supposed to be though. Perhaps you can just use the original image and have it shown on the entire left side of the text box. That worked pretty well for, well, FF4 itself actually. :)

By the way, a tip: you can press F12 to make a screenshot of the game too! It'll be saved in the screenshots subfolder of the Sphere engine folder, or for miniSphere, in Documents\MiniSphere\Screenshots.
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 15, 2017, 02:45:11 pm
When I get a few moments I'll change the font back and screencap it for you to see. I did like the original font i was using as well. It just seemed too large in the smaller screen.
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 15, 2017, 09:00:51 pm
@DaVince

The original font readded.
Title: Re: Pixel size consistency in video games
Post by: DaVince on August 16, 2017, 04:37:07 am
Well, have you played around a little more with textbox size and the line height? (There seems to be a good amount of space wasted between the lines.) There's a lot you could be doing here since nothing is fixed after all; it's all up to you. ;)
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 16, 2017, 04:37:57 pm
Yeah, I've been trying to make variables less absolute. It's the algebra. I've been adjusting it on and off for days.

Edit: As you can see in the 3rd image, the system font gives less of an issue with the message boxes than the font I was using. The only problematic message box with the system font is Tellah. It is too wide and goes off the screen.
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 16, 2017, 07:17:00 pm
Last of the screencaps for a little while...

Scaled Vs Non-Scaled versions.
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 17, 2017, 11:05:55 pm
On a more personal note: In the process of doing these scaling tests, having to bring all of the spritesets back to the ones from the original LoZ, the project is feeling less and less original. Sure, the map is different but I'm starting to feel as if the other elements that I've had planned out won't mesh well together because Zelda is 16x16, Final Fantasy is 32x32 or 32x48 (depending on the sptite used) and those are just two among some other inconsistences that are developing.

Just like in writing, there is always a rough draft that comes first. Then it goes through several revisions before it might even be close to feeling as if it is complete. It would be unfair to judge based upon a first draft. Would we have ever had Star Wars if someone looked at the rough draft and said "George, this is crap?"

Now, please don't get me wrong. No one here has said that about ZeC. Everyone has actually been very encouraging. I understand that I'm still learning about the pixel consistencies and the such. After all, this is first attempt with a development engine that uses tiles and sprites. I, also, understand that this topic is a learning tool and that is after all why I joined the forum, to learn more about Sphere and all it can do.
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 18, 2017, 06:02:55 am
Scaled back to the original 16x16 tiles...

Still need to make adjustments to image locations, add the life meter, triforce segments area, and an area for the number of keys, bombs & coinage (rupees).
Title: Re: Pixel size consistency in video games
Post by: DaVince on August 21, 2017, 07:49:56 am
On a more personal note: In the process of doing these scaling tests, having to bring all of the spritesets back to the ones from the original LoZ, the project is feeling less and less original. Sure, the map is different but I'm starting to feel as if the other elements that I've had planned out won't mesh well together because Zelda is 16x16, Final Fantasy is 32x32 or 32x48 (depending on the sptite used) and those are just two among some other inconsistences that are developing.

Just like in writing, there is always a rough draft that comes first. Then it goes through several revisions before it might even be close to feeling as if it is complete. It would be unfair to judge based upon a first draft. Would we have ever had Star Wars if someone looked at the rough draft and said "George, this is crap?"

Now, please don't get me wrong. No one here has said that about ZeC. Everyone has actually been very encouraging. I understand that I'm still learning about the pixel consistencies and the such. After all, this is first attempt with a development engine that uses tiles and sprites. I, also, understand that this topic is a learning tool and that is after all why I joined the forum, to learn more about Sphere and all it can do.
Oh, I understand. I wasn't sure what your plan was originally either - to use and keep the Zelda tileset or maybe you were going to replace it with your own eventually. I just noticed that in general, sizes of things didn't quite match up so I figured it'd be a good idea to mention things about this right away. I do think that your game is going in a good direction though. :)
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 21, 2017, 08:43:09 am
Update: Inventory

Still trying to postion the Triforce...
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 21, 2017, 01:13:31 pm
Update: Triforce Positioned, Map References in the lower left. Just need to add the number of keys, coins & bombs...
Title: Re: Pixel size consistency in video games
Post by: Rhuan on August 21, 2017, 01:36:01 pm
On a more personal note: In the process of doing these scaling tests, having to bring all of the spritesets back to the ones from the original LoZ, the project is feeling less and less original. Sure, the map is different but I'm starting to feel as if the other elements that I've had planned out won't mesh well together because Zelda is 16x16, Final Fantasy is 32x32 or 32x48 (depending on the sptite used) and those are just two among some other inconsistences that are developing.
There could be a different way to deal with the inconsistencies rather than ditching the sprites you had.

One possible answer would be to use SNES Zelda graphics rather than NES have you thought of that?

(Though considering how much mapping you've done this may be a bit late - it may be possible to use a script or some other quick method to swap the tiles you've used for different tiles whilst keeping the same layout if you can find tiles to swap on a 1 for 1 basis for each existing tile.)

Another idea would be to scale the maps and apply a filter to them something like super eagle or super 2xsai etc these filters scale and smooth graphics so they don't look so obviously scaled
Title: Re: Pixel size consistency in video games
Post by: Miscreant on August 21, 2017, 01:52:52 pm

One possible answer would be to use SNES Zelda graphics rather than NES have you thought of that?

Interesting fact is that there are some LoZ:LTTP sprites already mixed in to the maps in various locations. Doors, Door frames, A partial Master Sword pedestal, Hyrule Palace... and others.

Quote from: Rhuan
Though considering how much mapping you've done this may be a bit late

I spent a good amount of time recreating my tileset with the original 16x16. Took a lot of editing. Over 2000 tiles and a lot of that were custom edits. I'm still in the process of re-adding all the obstructions to them. There are some spots that I've missed making it possible for the player to walk on water. Last I knew, walk on water spells don't exist in Hyrule.

Quote from: Rhuan
Another idea would be to scale the maps and apply a filter to them something like super eagle or super 2xsai etc these filters scale and smooth graphics so they don't look so obviously scaled

The few new screencaps I've posted are of the maps scaled to 2x. Super Eagle or 2xsai? I'll have to research those filters...

Title: Re: Pixel size consistency in video games
Post by: DaVince on August 22, 2017, 06:40:20 am
A scaling filter could be good. A lot of emulators use them for nice upscaling. Something more modern like EPX/Scale2×/AdvMAME2× might be good here.
Title: Re: Pixel size consistency in video games
Post by: DaVince on August 22, 2017, 06:42:41 am
Update: Triforce Positioned, Map References in the lower left. Just need to add the number of keys, coins & bombs...
Cool! I should mention that this is a forked discussion about pixel sizes specifically though - the thread for your game project still exists so it's probably better to post progress updates and stuff there. ;)
Title: Re: Pixel size consistency in video games
Post by: Rhuan on August 22, 2017, 07:11:13 am
A scaling filter could be good. A lot of emulators use them for nice upscaling. Something more modern like EPX/Scale2×/AdvMAME2× might be good here.
Hmm... New planned feature for MEngine and SEngine :)