Revisit Graphic Quality Options about cardmaker HOT 10 CLOSED

Note: I use Beyond Compare to help perform visual comparisons. It highlights differences per pixel to make them easier to recognize.

I exported again at 600 DPI. It made no difference to the visual result/comparison of the sample files I exported (300/600/1200 DPI). This makes sense as DPI should have no impact on the pixels produced by CardMaker.

I also compared with/without on a project with higher resolution files (825x1125). The resulting images had artifacts I definitely did not want (mostly like those previously described along with another that was unexpected).

No matter my experience, I'll look into making these settings optionally available app-wide in a future commit.

If someone is working with a very small font and resolution they may not want to use the new settings. Enabling these settings will need to be optional as existing users/projects may be forced to reconfigure their elements due to the text related differences (they'll want to make that choice if/when they are ready).

from cardmaker.

zSingleCardGraphics.CompositingQuality = System.Drawing.Drawing2D.CompositingQuality.GammaCorrected;
zSingleCardGraphics.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.HighQuality;

Added the ability to set these under Tools > Settings > Graphic Settings 7e9155a (will be in next pre release)

CardMaker already has this one on all calls to CardRenderer.DrawCard

zGraphics.SmoothingMode = SmoothingMode.AntiAlias;

from cardmaker.

Can confirm the changes work as designed, and I love the new functionality. Many thanks!

from cardmaker.

Do you have an example where it failed before? I would investigate it for you more rigorously, but on my sublayout version it does improve the way the fonts look and also everything seems crisper.

from cardmaker.

When I have a chance I'll post a set of side-by-side comparisons.

CardRenderer currently does these two:

zGraphics.TextRenderingHint = TextRenderingHint.AntiAliasGridFit;
zGraphics.SmoothingMode = SmoothingMode.AntiAlias;

from cardmaker.

Captured in win10 with 100% scaling on an nvidia 3080 on 4-11-2024

Comparing the original (current) vs. CompositingQuality.GammaCorrected vs. PixelOffsetMode.HighQuality
(click for full size)

CompositingQuality.GammaCorrected

• Has some interesting affects on fonts. They seem to be much more slender and lacking definition in some examples.
• The png alpha image (last one) is interesting because it dramatically affects how the butterfly by 75 looks.

PixelOffsetMode.HighQuality

• Also has some interesting affects on fonts. The file on the last line in the first image looks odd because the i character is much closer than in the other two samples (same with the word By with the y super close).
• Measurements end up different as seen in the second row of samples where the spacing ends up being measured very differently (FormattedText).

Recommendation

If people are interested I could make these settings that users can adjust and set in the application itself so they can decide what looks best for their context. I personally wouldn't use them based on the results I'm seeing.

from cardmaker.

Here's my test with real-world data.

The first image is low-quality settings, and the second one is higher quality. I down-sampled these to 15% of their original sizes. I find that the fonts actually look significantly better, and give much much more reliable sizing results with the high-quality settings. The blending is also much more accurate and matches the underlying assets much more closely. These are of course generated using the in-memory SubLayouts as well. In general, when looking at my underlying assets and the final results, the higher-quality ones with gamma correction give much more "correct" results to my trained eye (coming from a 3D graphics rendering background).

Might I request increasing your CardMaker output DPI to 600 (print quality) and re-run the tests? My font sizes are often in the 48-84 range, which will give excellent results when allowed to breathe across pixels. You can see in the text of the top left and bottom right units that they are different lengths, cause by the lower-quality of pixel offsetting.

For the PIxelOffsetMode, the letters are closer together because it more accurately represents the kerning of the letters, matching better font standards. I think you'll get drastically different/improved results if you increase your resolutions, as well. Right now you're pushing the limits of low-res. Also, if you load my two images in GIMP and do a subtraction on them, you can see that the HQ version has brightnesses in spots which you might not otherwise expect.

Another example where the blending looks better is the tiny red/green/blue/yellow icons on each unit card. They are brighter and blended more accurately in the second example, considering they're supposed to be at 80% opacity. Another example is the color fade wrapping around the commodities box: in the first one it looks like 2 parallel lines but in the second one it looks correct as a shaded area. This gradient is also much more pronounced in the white horizontal shaded area at the bottom of the unit boxes. It's almost impossible to see there's even a gradient there in the low-quality version.

Summary

Personally, if these were settings which were program-wide, I would leave them all toggled 100% of the time in my use cases.

from cardmaker.

The only code difference between the above images is in FileCardExporter:138-140

zSingleCardGraphics.CompositingQuality = System.Drawing.Drawing2D.CompositingQuality.GammaCorrected;
zSingleCardGraphics.PixelOffsetMode = System.Drawing.Drawing2D.PixelOffsetMode.HighQuality;
zSingleCardGraphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias;

from cardmaker.

Giving users option is best :) And even if you didn't want to make this change, there's always local forks :P

from cardmaker.

Supported in https://github.com/nhmkdev/cardmaker/releases/tag/v.1.4.0.0-unstable.v.a2

from cardmaker.