next »

[Dr. Büni]

Hello, everyone. I have the following questions:

1. When you create a pixel art game, you will generally choose a resolution (say, 400x240) and create tilesets to fit within that resolution. So perhaps 16x16 tilesets. But when creating a game with hand drawn assets, is there any need to work with such a small resolution, or should I work directly in 1920×1080 or even 3840 x 2160/4K? Sounds like a silly question, I know. I am thinking it is the same as drawing the sprites: Work it big, then resize it down in the actual game if needed. Right?

2. Are there any good tools for creating hand drawn tilesets? I use Photoshop and Medibang Pro for drawing characters but drawing straight lines in those two software is a real bitch. Tiles are naturally very square-y in nature.

I actually had more questions but they slipped my mind. So that is for now. Thank you

[Sir_Phobos]

Hello, everyone. I have the following questions:

1. When you create a pixel art game, you will generally choose a resolution (say, 400x240) and create tilesets to fit within that resolution. So perhaps 16x16 tilesets. But when creating a game with hand drawn assets, is there any need to work with such a small resolution, or should I work directly in 1920×1080 or even 3840 x 2160/4K? Sounds like a silly question, I know. I am thinking it is the same as drawing the sprites: Work it big, then resize it down in the actual game if needed. Right?

2. Are there any good tools for creating hand drawn tilesets? I use Photoshop and Medibang Pro for drawing characters but drawing straight lines in those two software is a real bitch. Tiles are naturally very square-y in nature.

I actually had more questions but they slipped my mind. So that is for now. Thank you

For your first question, I think the answer depends on what sort of art style you're aiming for. If you want to show linework, or have an outline around your character, your canvas will need to be a certain size, depending on how thick your lines are. Some of the games that tout their hand-drawn art have very high-resolution sprites that are scaled down at run-time to match the player's resolution settings. In my view, hand-drawn art is just going to look like pixel art if you're drawing at a very small resolution. Also, if you draw something at a very high resolution, and scale it down to a very tiny resolution, there's a good chance some details will be lost, and you'll have to do a second pass at the pixel art-level anyway. So, if you're going the hand-drawn route, I'd say to work with a larger canvas.

I'm afraid I don't have much to offer for your second question, but if I were hand-drawing tiles in Photoshop, I would either set up a grid of the tile size that I'm aiming for, or use guide lines.

Hope that helps!

[Dr. Büni]

For your first question, I think the answer depends on what sort of art style you're aiming for. If you want to show linework, or have an outline around your character, your canvas will need to be a certain size, depending on how thick your lines are. Some of the games that tout their hand-drawn art have very high-resolution sprites that are scaled down at run-time to match the player's resolution settings. In my view, hand-drawn art is just going to look like pixel art if you're drawing at a very small resolution. Also, if you draw something at a very high resolution, and scale it down to a very tiny resolution, there's a good chance some details will be lost, and you'll have to do a second pass at the pixel art-level anyway. So, if you're going the hand-drawn route, I'd say to work with a larger canvas.

I'm afraid I don't have much to offer for your second question, but if I were hand-drawing tiles in Photoshop, I would either set up a grid of the tile size that I'm aiming for, or use guide lines.

Hope that helps!

Gotcha! That certainly helps. I think considering my art do feature thick outlines and the designs for my game are, for the most part, very minimalistic, there is little reason not to work with a larger canvas and then resize it accordingly later. Though I believe I should come up with a few templates to make sure everything is consistent. Say, if there are two characters the same size, but I draw one in a 4K canvas and the other in a 1080p one, when resizing them, I believe stuff like the thickness of the outlines will look different between both sprites, right?

Since my project takes a lot from the old Game Boy Pokémon and Zelda games, I can start by multiplying the dimensions of the sprites in those games and using them as templates.

Thank you!

[-Ross]

When not doing pixel-perfect stuff, I always draw things at at least double the maximum final size. As long as it's not really small, this is personal preference though. Drawing/painting digitally doesn't work very well at very small sizes, since the brush anti-aliasing acts like a significant blur effect, and non-anti-aliased brushes are generally too harsh.

If you scale graphics at all, you're going to have some kind of slight change. Usually it's just slightly less crisp than if you show it 1-to-1 for your monitor (or enlarged to an integer multiple (2x, 3x, 4x, etc.)). You can see this in any image editor--compare what your image looks like at 100% zoom and 120% zoom. You could possibly use the "nearest" filter mode in your game engine, which will keep it crisp, but often looks worse because it still has to distort things, which is more noticeable with the edges sharp instead of anti-aliased. That's generally just used for pixel art.

Keeping everything at an integer zoom isn't very practical for non pixel-art games (the game would have to be shown very small on some screen sizes), so you don't have much choice about it. It'll look the way it looks, so don't worry about it.

If you're just scaling everything to be roughly the same for different screen resolutions & proportions then outlines should appear the same. This should be handled with your camera zoom, scaling all your objects individually would be a big hassle!

How is drawing straight lines in photoshop hard??? Do you know that you can hold Shift to draw straight lines?

If you haven't drawn many game graphics before, one of the biggest issues is keeping things clean and accurate. You should always use a clipping mask, a selection, or a layer with the opacity locked. Otherwise it's really easy to get stray pixels with really low opacity that are invisible in photoshop but show up in-game or cause havoc by messing up the size of your sprite. So for square tiles, start with a layer with a perfect, opaque square of the right size (use the shape tool, a selection, or a new file) and lock it's opacity. Either paint directly on that layer, or use layers on top that are clipped to it.

If you want seamless tiling textures, you can do this in photoshop with the offset filter (offset by half and then clean up the seam). I think other softwares may have better features to help with this, though I'm not sure which. Check out Krita maybe?

[Dr. Büni]

Hello and thanks for responding, Ross.

So the approach I am taking currently is drawing everything at the maximum target resolution, which is 4k. I realize most people still use 1080p screens or even those of lesser resolutions, but I am playing towards the future. The only issue is it might look fairly bad on small screens, like mobile screens, but it is what it is.

Regarding drawing straight lines, I am aware of holding shift, but it doesn't feel as natural as drawing regular lines. I have been practicing drawing straight lines without the shift button, but I am still ways to go.

I will give your approach to drawing tiles a try. I have been using Krita for the past few weeks, since I learned it has a setting that mimics the Photoshop key binds and stuff. Haven't touched Photoshop since. Thanks a lot.