Skip to main content
floriank38625530
Known Participant
March 1, 2018
Question

Very big images sizes because of a "jpeg to png 32 bit to json" workflow?

  • March 1, 2018
  • 1 reply
  • 969 views

Hey guys,

I'm struggeling with an issue for a long time now, that causes very big file sizes for images.

My HTML5 course is 1280 x 720 pixels, and therefore I have some images I use for the background. They are also 1280 x 720 pixels big.

What I figured out:

  • The file size in the output is more than less indepented to the compression of the input jpeg image (for input png there is the same problem).
  • While exporting the course you can notice in the dr folder that captivate first produces a new png file (32 bit) of the jpeg image, after a while it produce the json file.

For example I created a new blank project with one slide and one big image (1280x720px):

Input file passing file in dr folderoutput file in dr folder
jpeg normal compression (0.2 MB) png (1,6 MB) in 32 bitjson (0,7 MB)
jpeg high compression (0.05 MB) png (1,3 MB) in 32 bitjson (0,6 MB)
jpeg high compression and small resolution + Rezise to 720p in Captivate (0.01 MB)png (1,1 MB) in 32 bitjson (0.5 MB)

In this example you can tell, no matter what you do, for a big image you get a big json file.

Is that because captivate produces this big png files with 32 bit first?

What is your strategies for this issue? Because I want to keep the file size as small as possible for mobile purposis.

Best wishes

Flo

This topic has been closed for replies.

1 reply

Erik Lord
Inspiring
March 2, 2018

Given no reply, how about an old method?

If you have photoshop, change your background image into an 'index' format with a custom palette, then save as a BMP.

Import that into CP as a background.

Does that retain the smaller size?

Does it render well in HTML output?

The palette may cause an issue but, maybe worth a shot.

floriank38625530
Known Participant
March 2, 2018

Hey Erik,

thank you for this tip. I have photoshop and tried the following formats:

  • bmp
  • gif
  • SmartShape filling up with an gif-image

Everytime it ends up with big json files. Another problem is that you can't compress those files and obtaining good quality. BMP for a 1280x720 pixel image is always around 1,5 MB and a GIF is 500 kB with bad Quality. My compressed jpeg is only 110 kB and looks better than that gif.

What about the following:

Compress the image and save it as jpeg (like normal), and after that upload it to a server and past the image via webobject?

The following code will work fine:

<img src="url of the image"  height="720" width="1280">

The only problem with that is, that web objects are always on top. But I want it as an background. You can manipulte the adobecaptivate.ini and set "UseWidget7 = 1", that would work, but the problem with that is that you loose the interactivity of web objects for the exported project.

With every solution there comes a new problem

Any other suggestion?

Thank you and greetings

Flo