Skip to main content

News

Topic: Pixel size consistency in video games (Read 712 times) previous topic - next topic - Topic derived from Project ZeC (My Zelda...

  • DaVince
  • [*][*][*][*][*]
  • Administrator
  • Used Sphere for, like, half my life
Pixel size consistency in video games
(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. :)
  • Last Edit: August 14, 2017, 06:53:27 am by DaVince

Re: Pixel size consistency in video games
Reply #1
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?
  • Last Edit: August 13, 2017, 04:38:02 am by Miscreant
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

  • DaVince
  • [*][*][*][*][*]
  • Administrator
  • Used Sphere for, like, half my life
Re: Pixel size consistency in video games
Reply #2
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?
  • Last Edit: August 13, 2017, 05:39:49 am by DaVince

Re: Pixel size consistency in video games
Reply #3
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.
  • Last Edit: August 13, 2017, 03:17:36 pm by Miscreant
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

Re: Pixel size consistency in video games
Reply #4
@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?
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

  • DaVince
  • [*][*][*][*][*]
  • Administrator
  • Used Sphere for, like, half my life
Re: Pixel size consistency in video games
Reply #5
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.

  • DaVince
  • [*][*][*][*][*]
  • Administrator
  • Used Sphere for, like, half my life
Re: Pixel size consistency in video games
Reply #6
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. :)

Re: Pixel size consistency in video games
Reply #7
@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.
  • Last Edit: August 15, 2017, 05:35:16 am by Miscreant
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

  • DaVince
  • [*][*][*][*][*]
  • Administrator
  • Used Sphere for, like, half my life
Re: Pixel size consistency in video games
Reply #8
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.

Re: Pixel size consistency in video games
Reply #9
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.
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

Re: Pixel size consistency in video games
Reply #10
@DaVince

The original font readded.
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

  • DaVince
  • [*][*][*][*][*]
  • Administrator
  • Used Sphere for, like, half my life
Re: Pixel size consistency in video games
Reply #11
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. ;)

Re: Pixel size consistency in video games
Reply #12
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.
  • Last Edit: August 16, 2017, 06:27:15 pm by Miscreant
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

Re: Pixel size consistency in video games
Reply #13
Last of the screencaps for a little while...

Scaled Vs Non-Scaled versions.
"I am to misbehave." - Malcom Renyolds, Captain of Serenity

Re: Pixel size consistency in video games
Reply #14
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.
  • Last Edit: August 17, 2017, 11:08:05 pm by Miscreant
"I am to misbehave." - Malcom Renyolds, Captain of Serenity