Skip to main content
M
mark-zajac
Inspiring
June 4, 2019
Answered

Misalignment Issue: mp4 resolution in HTML5?

  • June 4, 2019
  • 2 replies
  • 748 views

Ahoy!

I have multiple Captivate projects with shapes and text superimposed on imported videos.  I should note that these projects solicit user input.

When exported as SWF, the video and superimposed items maintain proper alignment.

My problem is with the HTML5 format.

During the export process, Adobe Media Converter automatically reduces the video resolution from 758 x 504 to 320 x 240, resulting in misalignment of the video and superimposed items.

I have 81 projects that I would like to export in the HTML5 format, without too much manual intervention on each project.

What can I do?

[:-)] Mark

    This topic has been closed for replies.
    Correct answer mark-zajac

    In brief, there is no simple answer.  A project that exports perfectly from Captivate to SWF format may develop multiple issues when exporting to HTML5 format, even if previewing the project in Captivate reveals no problems.  This thread provides some helpful though potentially labor-intensive work-arounds.

    [:-)] Mark

    2 replies

    M
    mark-zajacAuthorCorrect answer
    Inspiring
    June 6, 2019

    In brief, there is no simple answer.  A project that exports perfectly from Captivate to SWF format may develop multiple issues when exporting to HTML5 format, even if previewing the project in Captivate reveals no problems.  This thread provides some helpful though potentially labor-intensive work-arounds.

    [:-)] Mark

    Lilybiri
    Lilybiri
    Legend
    June 6, 2019

    I didn't answer anymore since Rod took over.  CP2019 improved the workflow to create interactive video's a lot, without the syncrronizing issues that existed in older workflows.  I have also created interactive videos to be published to SWF. Problem may be that you want to stay with the old workflow you are used to for SWF. There wa snot a reaction to my proposition for interactive video in my first answer.

    Just for the sake of other users watching this thread, here is a link to an example of an interactive video, in this case based on a Video Demo mp4:

    Custom Play/Pause button

    One video slide with overlay slides which can have all interactivity you want, and there is a Knowledge Check slide as well.

    M
    mark-zajacAuthor
    Inspiring
    June 6, 2019

    You wrote: "Problem may be that you want to stay with the old workflow you are used to for SWF."

    I am happy to adopt a new, more modern work-flow for future projects.  I will certainly take your advice for future projects.  My problem is that I have 81 existing projects that work perfectly when exported in SWF format.  I was hoping that exporting the projects to HTML5 would be possible without fundamentally redesigning all 81 projects.  I was hoping to leverage the many hours of work that were already invested, rather than starting again, with a new approach.

    You wrote: "There was not a reaction to my proposition for interactive video in my first answer."

    It may be that I misunderstood your suggestion about editing the videos.  In my current projects I have added buttons to the videos that accept feedback from viewers, to make the videos interactive.  The feedback from those buttons is reported to my LMS when the SWF presentation terminates.  Are you suggesting that video editing software can give me that sort of interactivity?  I would be surprised if this is so.

    You wrote: "CP2019 improved the workflow to create interactive video's a lot, without the syncrronizing issues that existed in older workflows."

    I am a teacher.  I have a limited budget.  My initial purchase of Captivate 9 was a major investment for me.  Upgrading to a new version or -- your other suggestion -- some sort of video editing software may be expenses that I can't afford.  Even with an upgrade, I will still need to redo my original 81 projects.  Those took about four months the first time.

    [:-)] Mark

    Lilybiri
    Lilybiri
    Legend
    June 5, 2019

    Always a bad idea to insert static objects on top of video.  That should be done in a video editor, or, use overaly slides in an interactive video if you use CP2019.  Since you are publishing to HTML5, that is perfectly possible

    Do you insert the video as syncrhonized video?  In that case I use AME manually to have a video with exact the resolution of the project, never had this reduced later on.

    M
    mark-zajacAuthor
    Inspiring
    June 5, 2019

    Thank you for your response.

    You wrote: "Always a bad idea to insert static objects on top of video."

    The objects in question are not static.  The objects in question are shapes that act as buttons, to make the video interactive.

    You wrote: "Do you insert the video as syncrhonized video?"

    Yes.

    You wrote: "I use AME manually to have a video with exact the resolution of the project."

    The raw materials for my project are a preexisting collection of MP4 videos.  At the very beginning, I deliberately chose the resolution of my Captivate project to match the resolution of my source videos.  As each video was imported to the project, for synchronization with my slides, AME automatically converted each video to the FLV format.  The resolution of the FLV videos matched the resolution of the MP4 originals and, hence, the resolution of my project.  In extensive testing with the SWF format this all worked well.  At the time, it was not obvious that migration to HTML5 might be imperative.

    When exporting my project in SWF format, the resolution of the FLV videos is not a problem.  However, if I try to export in HTML5 format, Captivate launches AME automatically and converts the FLV video back into MP4 video, which seems horribly inefficient!  At this point, AME changes the resolution of the video.  It does not seem to give me any choice in the matter.  I am not given the option of converting the video manually.

    I have the original MP4 videos at the correct resolution.  How can I get Captivate to incorporate those videos into the directory structure that is created by HTML5 export?

    [:-)] Mark

    RodWard
    Community Expert
    RodWardCommunity Expert
    Community Expert
    June 5, 2019

    You do not need to use FLV in Captivate.

    If the MP4 videos at the correct height and width in pixels and correctly encoded you should be able to insert them on Captivate slides without any issue.

    If Captivate refuses to accept the original MP4s then you can open AME on its own and try re-encoding them to be compatible format.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices