- 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
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:
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:
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:
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 ^.^
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
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:
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:
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:
And the Unsharp Mask (highly recommended):
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:
