Last active 2 years ago
The imported scale of your dropped images depends on the Pixel Density setting in the Project tab. Set the multiplier to @2x for 2048x1536px if preparing work for iPad retina screens.
What happens when you turn on "Use Original Image" in PubCoder for the images? Still the same effect? And when it is exported as html or epub - with that option still the same issue?
I found PubCoder's PNG compression rather lacking and not very effective (but the same can be said of just about any other design software). I always use ColorQuantizer to optimize transparent assets (PNGs) which does a brilliant job.
It is free, and in my opinion the best PNG optimizer out there. But unfortunately not available for Macs. Mac users have access to a reasonable effective optimizer in the shape of ImageOptim:
You have two optional workflows:
1) optimize the image assets before importing these into PubCoder (or replacing the existing ones with new optimized versions). Then ensure that for each image in the Selection tab --> Image Options the "Use Original Image" option is checked.
This will instruct PubCoder to export the project with the original optimized assets intact.
Alternatively 2) export your current project as-is, use the unarchiver tool to unzip all the epub files, and replace the images with optimized versions. Drag and drop all the images into ImageOptim, and have at it! Possible that the files sizes will be reduced quite a bit.
As for the animations: one option is to replace your animations with APNG files. While PubCoder will not play these in the preview, as long as the Use Original Image option is used, these APNG files will play in Thorium reader (Windows/Mac/Linux) and the Apple reader.
Here is a simple example. I took a small animation of a fox running consisting of 12 frames, and each frame is around 7~8kb at 153 by 139 px. The background is transparent, with some edge anti-aliasing. Thus, PNG is the only option here.
Importing these in PubCoder and using the animation object to re-create the animation results in PubCoder saving new version at ~25kb per frame! That means Pubcoder increased the overall size of the originals from ~83kb to a whopping ~290kb!
So I turned on the Zopfli PNG compression in the Project settings and exported once more (this is much slower, and only suggested for final testing and release versions). No difference, though.
To tell PubCoder to use the original images, all assets used for the animations must be attached in the Assets panel. Then PubCoder will use the optimized versions.
The full animation with separate frames then resulted in ~83kb. Not bad.
Next, I converted the animation to an Animated PNG file. On a Mac you can use APNGb: https://github.com/shgodoroja/APNGb
On WIndows, APNG Assembler:
The result: ~63kb. To import these APNG files in PubCoder, remamber to activate the Use Original Image option.
Now, you must also understand that an APNG does not require any code to be run or added, which means you will save a bit on epub xhtml and css code as well. It means in overall probably around 20~25% smaller files. Also, don't forget that if elements are animated across the screen without seeing a static version, then the resolution of said asset can be reduced as well. Readers cannot focus well on moving objects, and we can get away with lower resolution assets, providing another opportunity to reduce file sizes.
Movies are effective IF and WHEN no transpareny is required. Great for animated backgrounds, for example. But useless for transparent animated elements. (It is also possible to render the entire animation to a movie file, of course - but that would exclude any interactions. If your page is merely a static animation, converting the entire thing to a movie file is probably a good option depending on how much of the screen is animated.)
My basic workflow consists of optimizing static PNG files with Color Quantizer, and importing those with the "Using original image" option activated for each. I do not rely on Pubcoder (or other design software) to prep my PNG images (or my JPG images, for that matter).
For animations: it depends. While APNG is a good option, because these are non-lossy compressed frames, the resulting animation file size is quite heavy compared to movie files (which have lossy compression). So for full-screen background animations a movie file is the way to go.
But for animated characters/foreground elements there are other options.
Ideally (2) is used for larger characters, for example. Animate CC or Spine (two animation apps) can export to html. The approach here is to segment a character's limbs into parts that can be separately animated in an animation app. Then export an html5 version with a transparent background. The character parts are then compressed in a "texture atlas" (one image that contains all character parts).
The animation files are then imported in PubCoder, and the html file placed in a smart object with an iframe tag.
The main advantage here is that very complex animation sequences can be introduced, at little extra overhead, because only one or two texture atlasses will be used. This technique is often used in games as well, because the results speak for themselves, and the file sizes remain manageable.
This option, however, is somewhat more complex to deal with, of course ;-)
Sorry for the long write-up.
Currently for Windows and Linux the only epub reader that handles FXL interactive epubs well is Thorium. Thorium is a revival of Readium.
Adobe Digital Editions is a mess, and has terrible support for FXL epubs. Thorium is the way to go at this point.
After a bit more research, I am going to answer my own question :-)
YES, it is possible to maintain the original assets! I discovered a simple option which controls this in the properties:
The preview in PubCoder does not seem to support Animated PNG files, though. Perhaps an improvement for the next release?
Hi, I am a new user of PubCoder. I am very much enjoying the software, but I do encounter a few issues related to how PubCoder treats assets during export.
First, the exported PNG files are pretty badly unoptimized. Now, I don't mind this too much, because most design apps are truly abysmal in this regard, so I am accustomed to this.
Which is why I always optimize PNG assets in an external tool (ColorQuantizer). In InDesign, for example, I just tell it to never touch the original asset, and export the original asset "as-is" to an epub. I do the same in Godot (a game engine), and other apps.
However, I cannot seem to find an option in PubCoder to tell it to maintain the original PNG files. PubCoder recompresses the images during export, ruining my carefully prepared images.
Secondly, this also poses a problem for Animated PNG files: the animated PNG files no longer work after export.
Which means I have to open the exported epub or html folder, and replace all the assets with optimized versions and the animated PNGs with the original APNGs. And while this works for a smaller project, it is FAR too much work on a semi-bigger project with many PNG files.
So my question is: does an option exist to force PubCoder to maintain the original assets during the export? And if not, could you please add a simple checkbox option in the Project settings to maintain the original assets?
Also, animated PNG files do not seem to work in the preview, or do not seem to be supported at all. This is an oversight, since all browsers now support these files, and both the Apple reader as well as Thorium (for Windows, Mac, and Linux) play these without issues.
A dedicated epub unzip/zip utility is eCanCrusher. Works on both mac and windows. Just drop an epub on the program icon, and it will create a folder of files to inspect and edit. Dragging that folder on the program icon once more creates an epub.
I am a new user of PubCoder, and I noticed that the compression of PNG files in PubCoder is not that great, so I use an external tool to recompress the files, and replace the old ones.