Captivate 9 HTML5 Output issue

[CuriousMax]

Hi,

I create a my storyboards on Powerpoint and then import it in to captivate to add interactivity, navigation features, audio, TOC, etc. It works fine when I publish in Standard HTML output. However, I am facing issues when publishing in HTML5 output. Every element that I built in Powerpoint is getting reshaped and distorted, while all the captivate elements stay in-tact. For example; images, text boxes, animation is getting disturbed.

Is this a common problem or am I missing something here? Is there a way to fix this issue?

Regards,

Max

[RodWard]

When you import a PPT into Captivate, the PPT slides get pretty much turned into static graphics.  If you publish to HTM/SWF, then the PPT slides become SWF backgrounds for the Captivate slides.  When you publish to HTML5, they become static PNGs.

If you want better control, DON'T start with PPT at all.  Build your storyboards straight onto Captivate slides and leave PPT behind.

[CuriousMax]

Are you saying that the only we can have proper HTML5 output is by making the course entirely on Captivate?

[RodWard]

The term "proper HTML5" is highly subjective.

You can certainly import a PPT deck into Captivate and then publish out as HTML5.  But doing so does not allow you to leverage all of the power and creative options that would have been available to you if you had instead built the same project from the ground up in Captivate using native objects.

You need to remember that PowerPoint is essentially a presentation tool, not an e-learning authoring tool.  Captivate (and many other apps) provide a way to use PPT files as a starting point for projects.  However, that doesn't mean this is the BEST way to author e-learning.  It's usually provided because so many people that work in training are addicted to PowerPoint and reluctant to move away from it.

If you want fewer limitations on creative scope when you author "proper HTML5", just bite the bullet and learn how to use Captivate to do everything.

[Erik Lord]

Do you have 'scalable' selected in the publish settings?

If scalable, then the distortion may be a result of the piece trying to size to the browser window size, which will almost surely result in some distortion.

Is this a Responsive project?

[rebecca_mogollon]

How has this issue not been resolved? I am having the same issue today, and cannot find a solution to save my life. Everything once published in HTML5 is cropped/distorted and sized improperly.

[RodWard]

Could you please provide us a little more information about the issue?  Perhaps even show some screenshots so that we can see what you are seeing?  We don't know what OS you are on, what Captivate version, whether responsive or not, are you also starting with PPT like the original poster?

[rebecca_mogollon]

I am on the move so I cannot provide screenshots, but I can give you everything else. I’m on windows 10 64-bit. The latest Captivate Version. Yes we imported from PowerPoint, and I do not know the circumstances surrounding what settings were chosen when imported. I tried re-scaling, and it did not fix the issue. No matter what, when we published HTML5, even when we preview to HTML5, everything is cropped off on the bottom. For example, the stage itself is cropped and just has a white strip. And all the graphics inside the also are cropped off separately… for example, I have a circle logo at the top right corner of the stage, and as a separate object it to is cropped into a semi circle. It's very weird  As far as I can tell, the settings chosen when imported have impacted this project, and I will have to re-import in order to fix it. That is not an option since it’s 75 hours of training, with interactive elements, quizzes, audio, etc. If this can’t be fixed I would have to start from scratch. Thanks for your quick reply!

[RodWard]

Are any of the original objects in the PowerPoint deck animated in any way?  E.g. are they set to fly in or fly out, fade in or fade out, etc?  Animated objects in PowerPoint sometimes show as being cut off because previously those animations were created in Captivate as SWF animations in years gone by.  But with Flash/SWF no longer supported, HTML5 doesn't offer any similar equivalent.  The PPT slide ends up as a static image.

Was the PPT imported into an existing Captivate project file of a given size, or did you simply create a new project directly from the PowerPoint deck?  If you imported the PPT deck into an existing project file, but the aspect ratios of the PPT and the CPTX are different, that could explain why you have things cropped.  Another reason could also be that you may have the playbar set to overlay the slide area rather than sit underneath it.

There are lots of possible reasons, which is why I asked for screenshots.  But maybe when you are not travelling you can supply them and we can offer more suggestions.

I know you don't want to hear this but...most experts on this forum would advise against ever using PowerPoint as the starting point for a Captivate project.  It takes away too much control over the end results.  You are usually better off starting from scratch in Captivate.

[rebecca_mogollon]

Hello Rod Ward, thank you so much for your thoughtful reply! Very few things in original PPT were animated, so I don't think it's related. The PPT was created first, and then someone from my team (before I was hired) created a project from PPT in Captivate. I totally agree with you that if I had controlled this project from the start, I would have very quickly learned not to use PowerPoint 🙂 Unfortunately I was only hired 2 weeks ago so I am getting in there to help fix it.

And now I'm sitting, I can provide screenshots! 

Screenshot 1: how the project looks when you are working on the project in Captivate

Screenshot 2: how the project looks when you go to Preview --> From this slide

Screenshot 3: how the project looks when you go to Preview --> HTML5 in Browser

I am going to try deleting all the "quiz" slides (made originally in Captivate, not PPT) and see if that changes anything, and then, barring any ideas you can provide, I think I will abandon all hope. Thank you kindly!