Zoomed Map Resampling

[CowWhisperer]

Hello!

I'm having trouble with a map I made of Trollskull Manor. When zoomed in, the resampling in Fantasy Grounds Unity blurs details together and makes it look bad.

I have attached two images showing the same door, wall and doorknobs. The first shows what the PNG looks like in Fantasy Grounds and the second was taken from Photoshop. The doorknobs are particularly indistinct in Fantasy Grounds Unity

47300
47301

The PNG file is 1.4 MB large, using the highest compression, 1350px by 1650px and is 50 DPI. I know that it would probably look better in Fantasy Grounds Unity if it were 100 DPI, but I am concerned about the file size getting too large. I have tested this PNG file in MapTools and it looks great there.

Is there a solution to this problem? I had quite a bit of fun learning Photoshop and creating the map, but it is discouraging to have it look so ugly in Fantasy Grounds Unity. It seems like if an open source project like MapTools is able to get this right, Fantasy Grounds Unity should be able to as well.

I have attached the map I created for reference.
47299

Thank you for your time.

[Zarestia]

Welcome to the forums. It's late, so just some fast bullet points from me, some points might seem harsh, don't take them pesonally :)

1. Maps should be jpg files. Tokens should be png files.
2. DPI is irrelevant for digital image quality, only neccessary for printing.
3. There is no right or wrong about zooming per se and it doesn't matter if a software is open source or not.
4. Do you really need to zoom in to see a sharp door knob with a width of 2px?
5. If 4 is yes: Make the map bigger in its dimensions. When making maps I reset zoom and then scroll one finger movement in. If that still looks good, it will very probably be fine for running games.

[CowWhisperer]

No worries. Thanks for the reply!

1. Thanks for the tip! I will use JPG in the future for maps. In this case, it reduces the file size by 12%, but still looks blurry in Fantasy Grounds Unity.
2. What I meant to say is that each 5 foot by 5 foot square is 50 pixels by 50 pixels. I have seen DPI used as a shorthand for this concept, especially when using Roll20 or Photoshop.
3. I guess right and wrong about any topic is subjective based on a person's values, but I thought we could just agree that "FG.JPG" looks worse than "PS.JPG". I value that the maps that I import into FGU look the same as the ones I create in Photoshop.
4. My understanding is that I need a map size less than 4 MB. Therefore, I need a resolution of about 80 pixels per 5 feet or less. I chose 50 pixels per 5 feet because it makes the math easier and because it is the default grid size in FGU. If I'm using 50 pixels per 5 feet, then a doorknob should be no wider than 6 pixels. If I draw a feature on the map in Photoshop, I need to be able to see that feature in the VTT.
5. I experimented and doubled the width and height of the map. The doorknobs look somewhat better in FGU, but still what I consider to be bad. The file size of the larger JPG is 4.75 MB.

I know a blurry doorknob seems trivial. However, I value creating large (in feet) maps and because of map file size limitations, pixel art seems necessary for doorknobs or stained glass windows or whatever else. I'm just starting out making my own maps and learning the limitations of various tools. If FGU is not able to do pixel art (and therefore large maps), it may not be the right tool for me.

[damned]

Welcome CowWhisperer

When say "pixel art" Im confused. a pixel is a square of unit on each edge and it matches the size of the screens pixels. When I grabbed your zoomed images they appear to be zoomed in somewhere between 800-1200%. That is no longer a pixel.

It does look like FG is applying compression to the images. If you require zero compression on your images then maybe its not the right tool for you.

In saying that - if you think the compression is the most important thing then you probably are not using FGs features effectively.

[Trenloe]

As you have mentioned, FG shows a resampled image - to try to smooth out individual pixels and produce a less blocky view. It's not designed to show individual pixels, like PhotoShop is as you need that level of detail in PS when changing individual pixels. In your images you're basically zooming in way beyond one image pixel = one screen pixel, and most image viewers (not pixel-by-pixel image editors like Photoshop) will resample and not show blocky pixels. here's an example of your image in Windows image view (left) and FGU (right):

47309

If you want this resampling in FGU to not appear as blurry then, as mentioned by @35Zarestia, you'll need more pixels. FGU can handle larger number of pixels than FGC, but don't go crazy. And a note about file size - this affects share time to players, the recommendation of 4MB or less is to keep sharing time to multiple players in game low, it's not a performance related recommendation.

In the end, if pixel art is the deciding factor for you over all of the other amazing VTT features of FGU, then maybe it isn't for you. That's fine, find the tool that matches your requirements.

[Trenloe]

And here's an example of another Trollskull Manor map (downloaded from Reddit (https://www.reddit.com/r/WaterdeepDragonHeist/comments/aqgoog/high_resolutionish_trollskull_manor_map_for_roll/)):

47310

Looks pretty amazing in FGU when zoomed in. This is 3.1MB, 3220x4200 pixels; so (of course) the detail comes from the number of pixels. I'm just using this map to illustrate that you can get amazing results in FGU with reasonable sized maps. In my games I'd probably reduce this file a little bit (2400x3100, 1.6MB), and it still looks good to me.

[CowWhisperer]

@Trenloe Thank you for the link to the Reddit Trollskull Manor map. I learned a few things from it.

As best as I can tell, it looks like that map uses some lossy compression to reduce the file size. The maps I made were using lossless compression. With lossy compression, I think I can justify 100px per 5ft.

The small details have high contrast. If I change my assets to have shadows or other high contrast boundaries, I think it will look better in FGU.

While this is still a problem that I have to work around, at least now I know the workaround: JPGs with lossy compression, 100px per 5ft and high contrast asset boundaries.

Thank you all!

[Zarestia]

I make most maps with 100px/grid and save them with 80-90% jpg quality. If you have rather small maps with many details (1-2 rooms for example) you can easily crank that up to 128-256px/grid. Test it out and see what works best for you. Keep in mind that most players probably don't like scrolling or panning too much :)

[lousilver]

While this is still a problem that I have to work around, at least now I know the workaround: JPGs with lossy compression, 100px per 5ft and high contrast asset boundaries.



this is a noob question, and i'm a little late to the thread, but.... how do you do lossy compression? i'm fiddling with CC3 rather than photoshop and then using windows paint to resize the image for file size.

[Moon Wizard]

The JPG format by design is a lossy compression format. In more advanced image editing software, you can choose the quality level when exporting JPG files to control the compression level, which reduces file size at the expense of detail.

Regards,
JPG

[rpbarrett111]

I make most maps with 100px/grid and save them with 80-90% jpg quality. If you have rather small maps with many details (1-2 rooms for example) you can easily crank that up to 128-256px/grid. Test it out and see what works best for you. Keep in mind that most players probably don't like scrolling or panning too much :)

Just checking out info about image zoom functionality . . . I found the quote above funny.

Nah, most players don't want to pan or zoom on the map. They want to pop out their character sheet, throw it to the map on the big screen, fight a vampire, collect the loot and xp, throw their character sheet back to their phone, and go hunt dragon eggs at the food court in the mall . . .

. . . then share an album of the entire experience with grandma on Tik Tok, so she can print it out at the public library from her Fitbit, or whatever.

They players I know are familiar with Roll20, D&D Beyond, and Talespire. They can pan and zoom a map in their sleep, and often literally do it with their noses. Hopefully not while driving, that's all.

Sorry, it just cracked me up. I thought, who's playing, Sir Patrick Stewart? No, he'd want to pan and zoom . . . Judy Dench? Nope - you know she's a panner and a zoomer . . . :D