[SOLVED] [Tileset] How do I correctly export/import HD png tileset ? (problem with scaling/offset)

Hello,

Actually, I created a tileset with Illustrator, with 300 DPI for Higher Definition.

In the workspace, each tile is 32x32 pixels.

The fact is, when I export, the pixel difference is ~4.16666667*higher than expected, obviously because there is a difference between 72dpi and 300dpi (300 / 72 = 4.16666667).

The first problem I saw was that I exported the tileset from Illustrator only, not the whole workspace so it deleted the transparent blank space all around and obviously generated an offset. Now, this problem is gone, but there is some other problems.

There is an offset appearing as you can see. It drives me crazy actually, I don't understand why it does this.

When I import the PNG into construct 3, how should I specify the grid x&y values below ?

You might be better off using different objects for things like rocks.

Tile Maps generally imply that you would have contiguous tiles.

You might be better off using different objects for things like rocks.

Tile Maps generally imply that you would have contiguous tiles.

Thanks for your fast reply.

For the rocks and other "small things", I was planning to overlay tilemaps (1 for the floor, with solid collision, 1 for the "background" with rocks, trees, flowers...). It will allows me to create huge maps way faster than drag'n'drop objects 1 by 1.

Actually I have 2 questions/notes.

1°) My map will be huge, and I read on this forum that put many sprites for the decor (like dozens and dozens of flowers, rocks, trees, bees...) will create performance issues. When you look on Kiwi Story demo from C3, they use the same things as me, except that there are in pixel art style, mine is more realistic + HD. So, I wonder what is the problem ?

2°) A tilemap SHOULD NOT have obligatorely contiguous tiles. A tilemap is commonly made like mine, as you can see when you search on Google or on assets big library like OGA or Unity asset store. I'm not saying it's the good way, but I assume that if there is so many like this, like the Kiwi Story forest Tilemap object, it means it's not that bad and should work, whatever the graphic style and pixel ratio ?

Thanks again for you time. :-)

A tilemap should be used for things that tile.

Remember that it's one atlus of objects in one texture, that usually covers the entire layout.

So you save cpu, and gpu by having one static thing that takes up a set amount of ram.

Multiple different Tilemap objects lower those ram savings.

Multiple objects work the same way.

A layout full of instances is not an issue, unless they are moving.

Also it looks like you have a lot of wasted space. Tilemaps usually have objects close together as in a minimum of 1 pixel apart to maximise ram saving.

You usually have to do that manually.

A tilemap should be used for things that tile.

Remember that it's one atlus of objects in one texture, that usually covers the entire layout.

So you save cpu, and gpu by having one static thing that takes up a set amount of ram.

Multiple different Tilemap objects lower those ram savings.

Multiple objects work the same way.

A layout full of instances is not an issue, unless they are moving.

Also it looks like you have a lot of wasted space. Tilemaps usually have objects close together as in a minimum of 1 pixel apart to maximise ram saving.

You usually have to do that manually.

Thanks again for the answer.

- I planned to have only 2 overlayed tilemap (floor + background)

- I understand the point of saving, thanks for the clarification :-)

- The wasted space is because my tilemap is a WIP. I assume it will not resolve my initial offset problem (see the screenshots for the rock overlay on the right tile of this rock) to put my different assets closer to remove some empty space.

Have you tried to edit the image in an image editor (ex. photoshop) and change the dpi from 300 to 72 while keeping the dimensions?

Have you tried to edit the image in an image editor (ex. photoshop) and change the dpi from 300 to 72 while keeping the dimensions?

I already did this with Illustrator, it ends with a lower quality like, you know, pixellised :/

How about keeping dpi at 72 and doubling the resolution ( double the pixel size ) then resize/scale down in Construct.

More RAM used, but maybe gets rid of the problem

> Have you tried to edit the image in an image editor (ex. photoshop) and change the dpi from 300 to 72 while keeping the dimensions?

I already did this with Illustrator, it ends with a lower quality like, you know, pixellised :/

I meant:

» open the exported Illustrator 300dpi image in photoshop,

» Go to change image size,

» write down original width and height,

» change de dpi to 72 (it will change the image width and height)

» change image width and height to the original values and apply

Save the image and try that in construct.

You are only changing the interpreted dpi for the image, not scaling it from 300 (usually for print) to 72 (usually for screen).

> > Have you tried to edit the image in an image editor (ex. photoshop) and change the dpi from 300 to 72 while keeping the dimensions?

>

> I already did this with Illustrator, it ends with a lower quality like, you know, pixellised :/

I meant:

» open the exported Illustrator 300dpi image in photoshop,

» Go to change image size,

» write down original width and height,

» change de dpi to 72 (it will change the image width and height)

» change image width and height to the original values and apply

Save the image and try that in construct.

You are only changing the interpreted dpi for the image, not scaling it from 300 (usually for print) to 72 (usually for screen).

Thanks for reply.

How about keeping dpi at 72 and doubling the resolution ( double the pixel size ) then resize/scale down in Construct.

More RAM used, but maybe gets rid of the problem

Thanks for reply.

Both of your idea was just tested now and it didn't change anything. I'm style having this problem.

32x32

128x128

Each small square on the screen below, from Illustrator, is 8x8. So for the first big square, it will be 32x32. So what's wrong ?

Ok, I figured out (I deleted the last two posts to avoid multi-posting spam...)

I found the solution with the tip from BadMario (thanks!):

I updated the tiles in my workspace from 32x32 to 256x256

Then I exported in 72dpi (no scaling)

It's all good ingame.

Thanks a lot !