Adobe Captivate – Converting to Responsive

I originally recorded an #eLearning #Livestream on this same topic but it felt sloppy so I didn’t publish it. Today I decided to record this live stream as a regular video tutorial. In this video tutorial, we review some best practices when converting non-responsive projects into a responsive project. In this video I decide to go with fluid boxes, however, you can also use breakpoints if you prefer that style of design.

I’d love to hear what others are experiencing with this process. Please share your best practices when converting older projects to responsive design using the comments below.

Learndash/Captivate quick and dirty and free integration

For anyone intending to use Cp with Learndash, here is a quick (and free) method for getting your projects on your site. Useful for previewing if nothing else, no xAPI/SCORM integration but there seem to be precious few ways of publishing Cp projects without the use of paid plugins.

Code needed:

[cap_iframe_loader type=’iframe’ width=’100%’ height=’600′ frameborder=’0′ src=’http://yoursite.wpengine.com/wp-content/uploads/adobe_captivate_uploads/project_name/index.html’]

Edit to match your details (yoursite.wpengine.com and everything after uploads/)

 

Gareth

End of Video Events with Vimeo

A few people asked how to create trigger an end video event with Vimeo, so here goes.

1. Create an html file (paste it into a notepad, and change the extension to .html)  with the following:

<!doctype html>

<html>

<head>

<meta charset=”utf-8″>

<title>Untitled Document</title>

</head>

<body>

//ENTER VIMEO EMBED HERE

<iframe src=”https://player.vimeo.com/video/XXXXXXXXXXX” width=”640″ height=”360″ frameborder=”0″ webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

<script src=”https://player.vimeo.com/api/player.js”></script>

<script>

    var iframe = document.querySelector(‘iframe’);

    var player = new Vimeo.Player(iframe);

    player.on(‘ended’, function() {

//ENTER END TRIGGER FUNCTION HERE

        alert(“Your Vimeo video has now ended”);

    });

</script>

</body>

</html>

2. Go to your Vimeo account, copy and paste the embed code into the html.  Also modify your ‘player.on ended’ function.  I just put in an alert to test it, but you can trigger virtually anything. I typically modify a captivate user variable so that the LMS will ‘remember’ if the video has finished or not each time a learner logs on.

3.  Zip your HTML file (use any compression program like WinRar)

4. In captivate, create a new HTML5 animation and select your newly created zip folder

5.  Test your Vimeo movie to make sure the end event is triggering.

Additional Notes

1. I typically turn off the playbar as an option from the vimeo website so that the user cannot fast forward the movie to trigger an end movie event. No cheating on my watch

Adobe Captivate Quicktip – Turn Bookmarking On / Off

In this Adobe Captivate video tutorial, I show you how you can turn bookmarking on or off for your eLearning course when you have an LMS and when you are simply storing your eLearning in the cloud.

Triggering a function when an Event Video ends

I wanted a ‘next’ button to appear AFTER an event video finished playing.  There might be a way of achieving this with the timeline, but I thought this method worked better.

1. Create a ‘next’ button and ID name it ‘nextBtn’.

2. Hide the button (press the eyeball)

3. Import your event video onto the frame (name does not matter)

4. Execute Javascript on the frame

5. Enter in the following code:

document.getElementsByTagName(“video”)[0].addEventListener(‘ended’,yourFunction,false);

function yourFunction(e) {

cp.show(“nextBtn”);

}

6. Watch and enjoy

Notes

You can add lots of other stuff to this trigger.  I update variables so that the LMS will store and ‘remember’ if a user watched the video or not. I also have a little check mark icon show next to the video.

If you have more than one video on the same frame, you change the array number.  Example – document.getElementsByTagName(“video”)[1]

It depends on which video you load onto the frame first.

Hope this will be helpful to someone.

 

 

#eLearning #LIVESTREAM 2017-11-27 16:00 EST/21:00 UTC

In this Adobe Captivate eLearning live stream, I will be answering your questions live on YouTube. You can send me your questions ahead of time, or use the chat function during the live stream. I will welcome questions about Adobe Captivate, eLearning in general, My office assistants Molly and Lucy, pretty much anything you want to ask.

Follow the link below at any time to set up a reminder to be notified when this event becomes live on November 27th at 4 PM Eastern Time.

If you enjoy my LIVE STREAMS, please share them with your colleagues and don’t forget to subscribe to my YouTube channel to make sure you’re notified of all my upcoming events. If you subscribe to my YouTube channel I will show you how you can get my Adobe Captivate 2017 Premium course at no additional cost to you.

Adobe Captivate – Video & Executable Publish Options

4f87f277f960be1b06bd871fc73efa7fad3908ae_3e73f2fb8d48b2678defdbba011114df0ff907e1_twitterIn this Adobe Captivate QuickTip, I will answer the question what happened to Captivate’s ability to publish your CPTX projects as either video or as a stand-alone executable for Mac or PC. This tutorial is for non-responsive projects only as these two publishing methods are not compatible with responsive projects.

Publish projects as MP4 files
https://helpx.adobe.com/captivate/using/publish-projects-mp4-files.html

Publish projects as executable files
https://helpx.adobe.com/captivate/using/publish-projects-executable-files.html