tati light

Veteran
Veteran
Joined
Aug 15, 2015
Messages
160
Reaction score
110
First Language
English
Primarily Uses
Introduction

Hi. This is my first tutorial.

This is a simple guide, and my favorite method to resize tiles and tilesets from 32x32 to 48x48.

This guide can be useless, because I don't know if we will can use 32x32 tilesets in MV with a plugin, but in anycase, this may help if you plan to use only 48x48 tiles.

This may be not the best method, but I think the results are not so bad. And obviously, crafting the tile in 48x48 from scratch (or manually editing) will be always better. ^.^

If you are like me, lazy to re-craft all of your tiles, this guide can help. Check if you like the results of the conversion below:

(please note that these tiles are property of Ayene-chan @ DeviantArt, I'm only showing them here for the purpose of teaching the guide, if you want to use them in your project, make sure you read her terms of use)

Preview

Preview with dark background: https://veuwer.com/i/38e4,38e5,38e6,38e7

38e5.png


38e4.png


38e7.png


38e6.png
To do this, I will teach you with Photoshop. Any version of Photoshop will probably work with this guide, if you don't have Photoshop you can either download a trial version or use another program, however, the automation part of the guide maybe is not easy to reproduce in other programs.

Procedure

Let's start the procedure. The procedure to resize is very simple, it involves logic, math and experience.

The Logic tells me that any image can resize better with perfect numbers like 2x, 4x, 0.5x etc. If you use "Nearest Neighbor (preserve hard edges)" you can have a good result with 3x as well, but not if you want to raise to 1.5x.

The Math tells me the MMC (minimum multiple common) of 32 and 48 is 96, therefore a good approach would be to raise a tile from 32 to 96 then reducing it to 48, but we need to use the correct filters, otherwise the result will look ugly.

The Experience with image manipulation tells me that to raise this type of pixel art from 32 to 96, we should go with a 300% Nearest Neighbor, and after that reducing the result to 50% Bilinear, which is the best filter to shrink images to half their size. Never use Bicubic for this type of art, it won't work.

The process is simply this... set the image to 300% with Nearest Neighbor, then again to 50% with Bilinear filter.

Automating / Batching

Now, I imagine you are lazy like me and don't want to make even that. I understand you, and I have the solution. We will apply a simple automation here with Photoshop. Open up the Actions window in Photoshop (you can find this in the Window menu or through ALT+F9). Now you should create a new action and record the steps of resizing a single file.

Start recording, open any image, go through the steps, save as PNG "as a copy" in a desired folder and close the file (without saving), then stop the recording and it's done. Your action should be something like this:

38er.jpg

Alternatively, you can use just one resize (to 300% Nearest Neighbor) then jump to Save for Web, PNG/24 with Bilinear 50%, but for the purposes of simplicity and automation, I recommend the steps above.

To run a batch running through a folder or subfolders, go to File > Automate > Batch, then select the Action you saved, and choose the folder with the image files you want to convert. Below is a screenshot with my own preferences for the batch:

38ew.jpg

The "Log Errors to File" may be a useful choice if you are like me and want to debug any possible errors later, instead of having your batch interrupted by annoying dialog popups.

Extension - Applying Filters

Other cool trick you may like, is to add a filter before you save your file. This can be also applied to your Action, so you can have two or more Actions with your desired filters/choices.

I recommend two useful filters for you. The Smart Sharpen:

38es.jpg
 ​
And the Unsharp Mask (highly recommended):

38et.jpg
 ​
The values in the screenshots above are just my personal preference, feel free to adjust as you prefer.

If you prefer using a filter like these ones, I highly recommend you insert the filter between the two resizes, after the size up to 300% and before the size down to 50%, because the Bilinear filter will reduce it more beautifully for you, and the result can look more natural, without an aggressive sharpening or filter. I recommend you use only one filter, but you may want to use more depending on your needs.

Feel free to ask me anything or to add suggestions ^.^
 
Last edited by a moderator:

Nimacamo

Kuchenliebhaber~
Member
Joined
Sep 23, 2014
Messages
12
Reaction score
4
First Language
German
Thanks for this guide. It really helps a bunch and the results are looking pretty good. 
 

taarna23

Marshmallow Princess
Global Mod
Joined
Jul 20, 2012
Messages
2,433
Reaction score
5,237
First Language
English
Primarily Uses
RMMZ
So many suggestions all over for resizing! Given that I really want some XP graphics in MV (relatively realistic and also giant-sized trees? Yes please!), I keep an eye out for a good way to resize. This qualifies! I also tweaked it a bit and got some good results:

  • Resize to 300% using none (GIMP)/nearest neighbor (Photoshop)
  • Use the Median filter (Photoshop, settings unsure - lowest that offer a difference?)/Despeckle (GIMP - No checkboxes checked, 1 radius, -1 black level, 256 white level)
  • Resize by 50% using Lanczos (GIMP), unknown in Photoshop...
The result was actually rather sharp and clear! I look forward to experimenting further. Thank you for posting this!
 

lazhiral

Villager
Member
Joined
Mar 13, 2013
Messages
25
Reaction score
36
First Language
Portuguese
Oh, so fast! Thanks a lot for this tutorial, it will surely help a lot of people :)
 

Lars Ulrika

I punch Therefore I am Harvest the land Taking the
Veteran
Joined
Nov 7, 2012
Messages
1,363
Reaction score
405
First Language
French
Primarily Uses
N/A
I have a question, would it do the job for converting ace characters to mv size?
 

tati light

Veteran
Veteran
Joined
Aug 15, 2015
Messages
160
Reaction score
110
First Language
English
Primarily Uses
I have a question, would it do the job for converting ace characters to mv size?
This process is aimed for tiles/tilesets. When you mean character, if you are saying about the pixel art 32x32 sprites then yes, this method can help. If you are talking about faces of the characters, then no, waifu2x would be better for faces.
 
Last edited by a moderator:

GrandmaDeb

Modern Exteriors Posted!
Veteran
Joined
Apr 25, 2012
Messages
4,467
Reaction score
2,988
Primarily Uses
Thanks for posting this. I am not sure how much of this process I can reproduce in GIMP, but it looks great. Here are Ayene's Tiles mixed in with MV. I think it came out great.


ayene%20MV2_zpsrzszuhpx.png
 
Last edited by a moderator:

Lars Ulrika

I punch Therefore I am Harvest the land Taking the
Veteran
Joined
Nov 7, 2012
Messages
1,363
Reaction score
405
First Language
French
Primarily Uses
N/A
I have a problem with my resized tiles, I did as you said and everything is going out quite smoothly except this :

Bummer_zpssbckol3y.png
if you look at the bunch of trees on the right it makes some kind of horrible squares. How can I fix that?
 
Last edited by a moderator:

tati light

Veteran
Veteran
Joined
Aug 15, 2015
Messages
160
Reaction score
110
First Language
English
Primarily Uses
I have a problem with my resized tiles, I did as you said and everything is going out quite smoothly except this :

Bummer_zpssbckol3y.png
if you look at the bunch of trees on the right it makes some kind of horrible squares. How can I fix that?

That was expected because of the size of the trees. If you look at my guide it uses a multiple minimum common (MMC) formula to reach a better resize, and that tree is totally different size from 32x32. In the case of that tree in particular, you would need to treat it differently, either trying another method (for ex. Waifu2x) or another formula to resize. For bigger sprites than 32p, it will be more complicated to hidden the visual defects of the resize.Edit: if you don't find a better method for the tree, try to use bicubic (for enlargement) for the size up step, and check if it looks better.
 
Last edited by a moderator:

Lars Ulrika

I punch Therefore I am Harvest the land Taking the
Veteran
Joined
Nov 7, 2012
Messages
1,363
Reaction score
405
First Language
French
Primarily Uses
N/A
Thanks for the tip! I'll try that tomorrow (getting late there) and I'll tell you how it goes :)
 

Liak

Veteran
Veteran
Joined
Mar 13, 2012
Messages
1,788
Reaction score
270
First Language
German
Primarily Uses
This seems to be the method Yanfly used for resizing his VX Ace icons. :) So I guess icon-wise all of our problems are solved. Just take Avery's icons and do the same to them.
 

BCj

Veteran
Veteran
Joined
Jun 19, 2014
Messages
1,905
Reaction score
1,153
First Language
Dutch
Primarily Uses
N/A
I tried this method with icons, but my icons got blurry..
 

tati light

Veteran
Veteran
Joined
Aug 15, 2015
Messages
160
Reaction score
110
First Language
English
Primarily Uses
I tried this method with icons, but my icons got blurry..
What is the size of the icons? 32x32? If yes = This method maintains a good sharpness if you use the nearest neighbor + bilinear methods like I wrote. If you want even more sharpness you can apply one of those two filters mentioned between the two resizes steps.

Also, if you can provide an icon example or screenshot, I can better assist you.
 
Last edited by a moderator:

BCj

Veteran
Veteran
Joined
Jun 19, 2014
Messages
1,905
Reaction score
1,153
First Language
Dutch
Primarily Uses
N/A
What is the size of the icons? 32x32? If yes = This method maintains a good sharpness if you use the nearest neighbor + bilinear methods like I wrote. If you want even more sharpness you can apply one of those two filters mentioned between the two resizes steps.


Also, if you can provide an icon example or screenshot, I can better assist you.
Well I think the main problem is that icons went from 24x24 (ACE) to 32x32 (Right? MV). I think the MMC is 96, so I did resize 24x24 by 400%, but then when I downsize it, you can't get it to 32 pixels properly because 33.3% is as close as you can get.. so it's not nicely divided by 50%. It looks off, anyway.
 

tati light

Veteran
Veteran
Joined
Aug 15, 2015
Messages
160
Reaction score
110
First Language
English
Primarily Uses
Well I think the main problem is that icons went from 24x24 (ACE) to 32x32 (Right? MV). I think the MMC is 96, so I did resize 24x24 by 400%, but then when I downsize it, you can't get it to 32 pixels properly because 33.3% is as close as you can get.. so it's not nicely divided by 50%. It looks off, anyway.
Ah then the formula would need to be other, I believe... this guide is only for tiles/tilesets from 32p to 48p...

From 24p to 32p would need another method to better resize. Scaling down to 33.3% will never produce good results because it's not a perfect number.

Edit: If you can provide me one icon or two you want to resize, I can try some tests here on my end.
 
Last edited by a moderator:

BCj

Veteran
Veteran
Joined
Jun 19, 2014
Messages
1,905
Reaction score
1,153
First Language
Dutch
Primarily Uses
N/A
These icons are from Avery, just so you know. :)


Tried to resize for example, this shirt.


naamloos.png
 

tati light

Veteran
Veteran
Joined
Aug 15, 2015
Messages
160
Reaction score
110
First Language
English
Primarily Uses
These icons are from Avery, just so you know. :)

Tried to resize for example, this shirt.

attachicon.gif
naamloos.png
Bilinear reduction step:
3a32.png


Bicubic sharper (for reduction) reduction step:
3a33.png


In this case, if you want a sharper result, I recommend the Bicubic sharper for the reduction step (still using the nearest neighbor for the size up).

You can achieve a similar effect as well if you use a filter like in the first post, either between steps, or after the reduction step.
 

BCj

Veteran
Veteran
Joined
Jun 19, 2014
Messages
1,905
Reaction score
1,153
First Language
Dutch
Primarily Uses
N/A
But to how much did you upscale it, and by how much did you downscale it?
 

tati light

Veteran
Veteran
Joined
Aug 15, 2015
Messages
160
Reaction score
110
First Language
English
Primarily Uses
But to how much did you upscale it, and by how much did you downscale it?
I don't think it make any real difference since the reduction step will be always a non-perfect number, but in my test I made 10x up, then back to 32p (fixed pixel number / not %), using those two methods. You probably can achieve the same thing using 300% or 400% for the step up. Also, don't forget to use the filters from the first post if you want to further adjust the sharpness.
 

Liak

Veteran
Veteran
Joined
Mar 13, 2012
Messages
1,788
Reaction score
270
First Language
German
Primarily Uses
Just try the whole iconset from Avery, Yurixy. :p If it works, we're all very happy!
 

Latest Threads

Latest Profile Posts

Watch Studio Blue play Numina by starlit in our latest RPG Maker Games Critique stream starting NOW!

Wish me luck. One of the leading experts on certain false shuffle is going to check if my skill is good enough to be called "not total trash".
Not an RPG Maker Update but I'm happy to say that I finally passed my drivers written test. Which makes me a happy guy.
FWRu-cYXkAAAUbl
Have you ever been in such a luck streak you felt fear something was wrong?
I'm going to be adding in combat animations, revamping the UI and putting in a new cutscene this week, so this is your last chance to play the MC:RIS demo in its original form! Say you were there since the beginning! https://qos.itch.io/infinite-sadness

Forum statistics

Threads
123,120
Messages
1,154,119
Members
161,453
Latest member
arnedidden
Top