Image (.PNG) Sharpness

HelpXplain is the exciting new animated infographics and screencast tool that integrates with Help+Manual.

Moderators: Alexander Halser, Tim Green

Image (.PNG) Sharpness

Unread postby alanmcd » Sun Jul 14, 2019 1:08 pm

I have tried several different settings, all trying to match the image size when recorded to the image size when played.
But I get some. if not all, images int eh slide set appearing less than optimally sharp.
When I play the screencats in HelpXplain they appear sharp but not when compiled into either CHM or Webhelp
Sometimes adding the Play Button makes the first image sharp but subsequent images are blurry.

Here's are a few examples:
http://www.meta.com.au/apphelp/pcc/inde ... nversi.htm
http://www.meta.com.au/apphelp/pcc/inde ... -sales.htm
http://www.meta.com.au/apphelp/pcc/inde ... rkflow.htm

Can you assist with what I can try to make them all clearer?
Alan
alanmcd
 
Posts: 89
Joined: Thu Jan 06, 2005 3:02 pm

Re: Image (.PNG) Sharpness

Unread postby alanmcd » Sun Jul 14, 2019 1:31 pm

Actually the CHM output is quite sharp (other than the one which is set to 100% which varies in clarity - to be expected).
So it's surprising that the CHM fixed size is sharp and the Webhelp output is blurry
Alan
alanmcd
 
Posts: 89
Joined: Thu Jan 06, 2005 3:02 pm

Re: Image (.PNG) Sharpness

Unread postby Alexander Halser » Sun Jul 14, 2019 9:27 pm

Different browser perhaps?

Untitled.png
You do not have the required permissions to view the files attached to this post. This may mean that you can't view them at all, or it may just mean that you need to log into the forum to view them.
Alexander Halser
Senior Software Architect, EC Software GmbH
User avatar
Alexander Halser
EC-Software Support
 
Posts: 3940
Joined: Mon Jun 24, 2002 7:24 pm
Location: Salzburg, Austria

Re: Image (.PNG) Sharpness

Unread postby alanmcd » Mon Jul 15, 2019 12:33 am

hmm, yes - you're right. Do we know why? I've never had the impression before that Chrome was poor in this regard but I can see that Edge is sharper. IE is sharper as well.
Alan
alanmcd
 
Posts: 89
Joined: Thu Jan 06, 2005 3:02 pm

Re: Image (.PNG) Sharpness

Unread postby Alexander Halser » Mon Jul 15, 2019 1:43 am

We are going to check if this can be improved for Chrome. But the effects will be very limited. The reason is that Chrome renders sub-pixels, whereas Firefox and Edge/IE round the pixels to integer numbers, then render it. Most Xplains will be displayed either in a lightbox or in a responsive iFrame. In those cases, you always end up with sub-pixel values, it's a floating point math.

If we made sure that all slides and objects are placed on integer positions, it would work in Chrome if...

1) The screencast is displayed inline
2) The screencast iFrame has a fixed size (not responsive)
3) No slide has been resized, scaled or rotated
4) The screencast width and height can be devided by 2 (no sub-pixel center)
5) The customer's system must run on 96 DPI (not scaled for high-res) and Chrome's zoom must be set to 100%

If any of the 5 points above is not true, Chrome will display sub-pixels and possibly render a somewhat blurry image.

Practically speaking, we've got to get used it, because high resolution is the norm already and responsive web pages are paramount.

I did a quick test with your Xplain and manually edited the slide positions to integer values. Looks pretty good on the first sight:
chrome-edge1.png


But this clarity is gone if the browser zooms in, which it does by default on system scaled higher than 96 DPI:
chrome-edge2.png
You do not have the required permissions to view the files attached to this post. This may mean that you can't view them at all, or it may just mean that you need to log into the forum to view them.
Alexander Halser
Senior Software Architect, EC Software GmbH
User avatar
Alexander Halser
EC-Software Support
 
Posts: 3940
Joined: Mon Jun 24, 2002 7:24 pm
Location: Salzburg, Austria


Return to HelpXplain Infographics Tool

Who is online

Users browsing this forum: No registered users and 1 guest

cron