November 10, 2011

Convert Your Cool Captivate Quizzes to HTML5 Format!

In September, we made the HTML5 Converter for Adobe Captivate available on Adobe Labs. With HTML5 Converter, you can easily convert Adobe Captivate generated SWF to HTML5 format and repurpose your countless hours of interactive trainings for mobile devices that do not support Flash content.

 

We received a lot of positive feedback from customers who were looking for an HTML5 solution and tons of requests for supporting more objects and functionalities, from which quiz and LMS support topped the charts. So here’s the second drop of HTML5 Converter which supports the three main question types: Multiple Choice, True/False and HotSpot. Don’t worry if this doesn’t include one of your favorite questions type — we are working on it! :)

 

You can also create SCORM 1.2 compliant HTML5 quizzes using the converter. Currently the reporting options for LMS are limited to:

Here’s an example of HTML5 Quiz for iPad created using the converter. If you are viewing the quiz on your desktop, open it in Chrome or Safari browser for best results.

 

Now let’s look at the steps to publish Adobe Captivate quizzes to HTML5 format:

  1. Create a quiz using Adobe Captivate 5.5. Make sure you include only Multiple Choice, True/False and HotSpot questions.
  2. Publish the quiz as SWF or as a zipped folder, if you wish to upload the quiz to LMS.
  3. Run the HTML5 Converter as an administrator.
  4. To load the SWF or zipped folder in the converter, click Load Captivate SWF.
  5. To select the destination folder for HTML5 output, click the Browse button.
  6. Select the Preset and click Convert.
  7. After conversion, click Launch to view the output. Ensure you view it in Chrome or Safari for best results.
  8. If you had loaded a zipped folder, click Publish to publish the HTML output in a zipped folder.

 

All set to convert your quizzes to HTML5 format? These release notes will help you understand what works best with this version of HTML5 Converter for Adobe Captivate 5.5.

Happy Captivating! :)

Posted by poojajaisingh2:55 PM
  • IMS

    I have been having trouble getting the html5 converter to work. It would convert properly, it just wouldn’t be viewable except for the first page. I just installed the new release and whatever bug fixes you made solved my issues. I was able to publish a 15 page document and view it in chrome. I have not tested it on an ipad as of yet but will shortly. I will also test the quiz functionality soon. Thank you for starting my day off great.

  • Princeexpedition

    I am getting this following error (Error: 1067 Can not be converted or something) whenever i try to convert my swf (online quiz stuffs) file into html5…

    Need help

    Thanks in advance

    • http://www.adobe.com Chinmay Baid

      Hi,
      Can you please share your swf and .cptx files? My email-id : cbaid@adobe.com

      Thanks

  • IMS

    here is the results of my attempt as quizzes:
    I noticed that the page count variable is now working. Probably because you had to use the quiz counter. It shows the page number on some pages and others it shows the code. just thought you would like to know.(I forgot to take the variables out when I republished. It was a nice suprise to see it working) For the quiz, the questions and answers were not showing up in chrome for me, just the radio buttons, and it would not score, but when I tested on the ipad, they did show up most of the time. the scoring seems to be working well. Loading of the questions on the ipad is extremely slow. but it works. What is the proper resolution for the ipad. I have created my slides at 1024×768 and set the converter to the ipad setting. when viewing on the ipad, the bottom half of the screen is cut off . along with the question nav buttons. you can resize the screen , but it is still cut off at the bottom. Am I doing something wrong here?

    • http://www.adobe.com Chinmay Baid

      Please try with 980×660. I think this resolution fits the content in full screen mode in iPad-browser.

      • IMS

        will do thanks!

      • IMS

        This seemed to do the trick for the screen getting cut off. How would I go about “hiding” the standard nav buttons (back, play, forward). I noticed in your example that you use your own navigation. I also tested your example on an iPad and the submit buttons are getting cut off at the bottom. you can’t proceed to the next question. Works great in chrome though.

        • http://twitter.com/poojajaisingh Dr. Pooja Jaisingh

          Try accessing the quiz on iPad now. Hopefully it should work well. For removing the standard playbar, you can make changes to the HTML file to disable the playbar.

          • Christian

            How can I disable the playbar from the HTML5 file? I open the file in dreamweaver but I’m quite new to all this. I have navigation buttons inside the actual project. Would be nice if the project autoplayed instead of having to click the play button.

          • IMS

            search for these and comment them out:
            div id=’frameSlider’
            div id=’progressPercentage’
            div id=’prevButton’
            div id=’playPauseButton’
            div id=’nextButton’

            example:

            <!—->

          • Christian

            Thanks!
            But now the project won’t start. Normally one would have to click the play button to start, but since it’s now commented out there’s no way to start.

            Is there a way to handle this so that the project autostarts?

          • http://www.adobe.com Chinmay Baid

            Hi Christian,
            Instead of commenting out the above div items, just set the ‘display’ property in each of their style as ‘none’. There might be references to these objects in the other parts of the player. Commenting them out will cause javascript errors.
            Thanks,
            Chinmay

          • IMS

            your example now fits in the ipad well. everything is visible. Also commented out the div tags for the playbar. seemed to do the trick.

            thanks

  • Randy

    The first preview of this worked for me, but was very limited (obviously). Now when I try to convert a swf, I get error #1099 – some kind of actionscript error. When I look at the output folder, it seems to have created most (if not all) of the assets I need, but there’s no index.html file, or anything like that. I’ve tried this on both 32 and 64 bit Win7, running as admin, and with complicated, as well as simple, Captivate 5.5 output. Am I doing something wrong?

    • http://www.adobe.com Chinmay Baid

      Hi Randy,
      Can you please share your swf and .cptx files? My email-id : cbaid@adobe.com

      Thanks

    • Bob

      I am experiencing the same issue. May I email my files to you as well?

  • http://www.bestwatersuaritma.com SU ARITMA

    Thanks for sharing, please keep an update about this info. love to read it more. i like this site too much, Good theme.

  • Michael Greig

    Is there a mac version?

    • IMS

      As far as I know there is no MAC version as of yet

  • IMS

    step 5.To select the destination folder for HTML5 output, click the Browse button.
    I get an actionscript error when I click this: Some actionscript error has occured #2004.

    everything else seems to work ok.

  • Pingback: how to develop HTML5 elearnining | eLearning Developer

  • Dennis Dangelo

    When I open the converter, before loading any zip files, I get an actionscript error #2004, and if I try to open a zip it says I need a file called DumpUtils.exe. What might be happening? I’ve already updated Adobe AIR as recommended.
    Thanks,
    Dennis

    • http://www.adobe.com Chinmay Baid

      Are you opening the converter in Administrator mode?

      • Dennis Dangelo

        Yes, I am.

  • William Hudson
  • Anonymous

    When will html5 converter be available for Mac?

  • http://www.facebook.com/people/Zachary-Bauer/1364089900 Zachary Bauer

    I have had nothing but problems with this. I have a simple project with just slides and some quiz questions. I’m exporting for SCORM and I made sure to only use the settings pictured above.

    I render out the HTML5 and zip up the folder. I then log into my SCORM cloud and upload the project and then go to my iPad to launch.

    I have sizing issues (and yes I resized to 980×660 based on others having the same issue) with the bottom being cut off or huge margins on the top and left. When I attempt to move through the course, the screen of the iPad starts flashing in some epileptic seizure. The controls then lock up and its done.

    This needs a lot of work. I have a client who would love to use this. So many physicians today are using iPads and you know medical pro’s are constantly keeping up on educational course work.

    This will be great if Adobe can ever get it to work.

    • http://www.adobe.com Chinmay Baid

      Can you please share across your project (.cptx/.swf)?
      We would like to investigate it at our end to see the issue. You can share it to cbaid@adobe.com.

      • http://www.facebook.com/people/Zachary-Bauer/1364089900 Zachary Bauer

        Just sent it. Also I sent you an invite link to the course on my SCORM cloud so you can see the issues we are having.

        • http://www.adobe.com Chinmay Baid

          Hi,

          Few observations :
          1. Slides 2-6 are imported from PPT. Hence, those are converted into videos. Since these videos are covering the whole screen of iPad, you cannot interact with any of those objects till the video disappears. Workaround : Try removing the click-boxes from each of these slides. Due to this, the video will not pause and jump to next slide as soon as it finishes.
          2. Since PPT support was not promised in the release notes, I would recommend you to not to try PPT slides as of now.
          3. By re-sizing do you mean that you’ve resized the project after importing the PPT slides?

          Thanks,
          Chinmay

          • http://www.facebook.com/people/Zachary-Bauer/1364089900 Zachary Bauer

            I started the project at 980×660 because others who had the bottom cut off when the project was set to 1024×768.

            When I imported the PPT slides, I assume it resized to fit my project. It will take me longer but I can try to recreate the sildes from scratch in Captivate and see if that works.

            Can I insert buttons like “continue” from the standard objects menu without any errors? I’d like to remove the navigation from the HTML that it automatically generates so I’m assuming that you would need some sort of button to allow the user to continue on to the next slide or go back to a previous slide.

          • http://www.facebook.com/people/Zachary-Bauer/1364089900 Zachary Bauer

            I think my shop is kinda going to give up on this for now. We are really looking forward to using this after its included in a Captivate release. We are still having sizing issues when running the project in iPad with Safari. All of the quiz controls are cut off from the user. If you like, I can send you an invite to other versions of this project running in http://cloud.scorm.com so you can test internally and see the issues we are running into.

  • IMS

    any new progress?

  • Unykron

    will there ever be a mac version of this?

  • Escapepro

    Does anyone know if matching quizzes are compatible yet?

  • Wescravn

    Hi,
    Can you please share your swf and .cptx files? My email-id : wescravn@hotmail.com

    Thanks

  • Dede

    I can convert individual swfs but cannot convert ctpx zips without the error 2004 when I open the converter. I close that amd try to upload my 5.5 zip file and I get “DumpUtils.exe is not available.” Then when I copy the exe as instructed, I repeatedly get an Error 2007 as it is very, very slowly, converting. I have to actually restart my PC to make it stop and do anything else. Very frustrating. Can you help?

  • Martin Williams

    Make it work in IE please

  • Carol

    I’m following the conversion directions exactly to convert my scorn 1.2 Cap 5.5 project to a scorn compliant HTML5 package. The conversion is successful, but for some reason, upon conversion it is rendering the manifest file as SCORM2004 instead of SCORM 1.2 so it won’t run in my LMS that accepts only SCORM 1.2. Anyone have any suggestions? Any way to convert the manifest as 1.2?

    • Vish

      Hello Carol,

      Is it possible to share the project with me? You can email viswanat@adobe.com

      Thanks,
      Vish

  • Richard

    Please can you let us know if we will be able to publish Captivate to IOS in Captivate CS6? If not then I guess we’ll have to move away from Captivate.

    • http://blogs.adobe.com/captivate Shameer Ayyappan

      #AdobeCaptivate 6 (both Win and Mac versions) will have an in-built publish to HTML5 option. With the published content fully functional on an iOS device, and fully trackable on any SCORM or AICC compliant LMS. More details in this sneak peek: http://blogs.adobe.com/captivate/2012/05/adobecaptivate-6-sneak-peek-01-publish-to-html5.html

    • http://blogs.adobe.com/captivate/ Allen Partridge

      Yes, Richard. HTML5 is the preferred format for iOS devices. So you can definitely publish for iOS devices, like the iPad and iPhone using Captivate 6. (You could already publish for iOS using eLearning Suite 2 or 2.5 if you wanted to do so today, this new feature adds the ability to publish without having to become a licensed Apple Developer.

  • Subscribe to RSS feeds
  • Loading

  • Categories

  • Archives

  • Authors

  • Recent Comments

    • Chris: I’m experiencing the same issue with Cap 6.0 and no data being reported to Adobe dashboard. Any updates?
    • Soledad Gonzalez: I am also having problems downloading the zip file. It appears the file is missing.
    • ET: I’m an experienced editor but just started working on Premier. Easy program but the project crashed...
    • David Haskins: what is the latest version of Adobe Captivate? I have 6.01.240 but i don’t think that’s...
    • Els Vandenberghe: Is there a date set for the availability of the ACE Exam Captivate 6?

  • Captivate & eLearning Videos

    Subscribe to Adobe eLearning on YouTube.

    Check out the latest eLearning Videos on AdobeTV