Slow loading videos, how to fix?

Report · Feb 07, 2014

I have a captivate course that has a 25 minute video as the bulk of the course (followed by a quiz)

When uploaded as a MP4 (about 300 mb), it takes about 10 minutes for the video to start playing.. which is unacepptable!

I tried cutting up the video at logical points till I had 8 videos (15 - 30 mbs average) on 8 consecutive slides; preloader was set to 10%.. i figured the first video would take about a minute to load but the rest should pre-load... but NO, the project stops at each video and loads for 2-3 minutes... still not acceptable!

What can I do?

Surely, someone out there has made a video heavy e-course, what's the fix?

P.S. I also tried using the youtube interaction; and while it does load almost instantly since it's youtube, the widget is incredibly limiting (doesn't pause with the project, won't scale properly, etc...

Report · Feb 07, 2014

I'm working on a similar setup with a project. I've uploaded my files to a server and tested out with IE 11 and it starts playing my 20-40 mb videos within 1-2 second. Watching the Task Manager network info, it's still downloading for 3-4 seconds while playing, so it appears to start before the enitire file is downloaded.

Using H.264 to encode. How are you encoding your mp4?

Report · Feb 07, 2014

I am also using H.264 to encode; my videos are upload to my GoDaddy server but my videos take about 2-3 minutes to load; they don't seem to play at all before file is fully downloaded (tested on Safari).

any ideas why that is?

Report · Feb 07, 2014

We have created several courses now which rely heavily on videos. Each course has a video which is about an hour long followed by a quiz.

To make this happen, we took several steps.

First , we found a video hosting site which lets us do video streaming using ABR (Adaptive Bit Rate). This lets the video start playing within a few seconds of the webpage being presented. You can put a video file on a standard web server, but it will only do "Progressive" downloading where almost the entire video must be downloaded before it will start playing. You will have to pay some money for this type of Video Hosting site (the "big dogs" of video hosting are Brightcove.com and Ooyala.com). Once you upload your video to them, they re-encode it to the correct formats that it needs to play to the various devices. They also give you the HTML to put on your web page so the video plays back correctly and it knows how much data to "feed" the device which is playing the video.

Next we broke up our video into Chapter or parts which last between 5 and ten minutes. We didn't want the student to get to minute 58 of a 60 minute video, cancel out and then have to watch the entire 60 minutes again the next time they started the course.

We then took the HTML that we got from our video provider and loaded it onto some web pages which we serve up on our servers. We created a different web page for each video chapter.

Then using Captivate 7, we used their web object widget and pointed each slide to a different web page (one for each chapter). We ended up with between 8 and 10 video slides per course, followed by a random 25 question quiz.

We just published our 2nd course using this technique and the end-users really seem to like it.

Report · Feb 07, 2014

Interesting, that helps quite a bit!

Now if I understand you correctly, you're using a the Captivate web ocject widget to place your video (from a web page) onto your captivate slide.

Could this same process be done using a embedded youtube video? That would save me from using an expensive video streaming service

thanks!

Report · Feb 07, 2014

Yes, BUT....

There are 2 reasons why we didn't go with youtube videos.

First, many of the people who will be taking our courses work in offices which automatically block youtube videos. They are not our employees so we do not control what type of environment they will be working from.

Second, youtube videos use a Progressive download, not streaming. Often times the quality was not very good.

Don't know if it is true or not, but at one time I had heard that if your youtube video was over a certain time duration (it might have been 10 or 15 minutes), then youtube would automatically play a commercial (of their choosing) before your video played.

There is also a question of who owns your video once you load it on youtube?

Also, if you want your students to be able to take your course on mobile devices, check to make sure that the Captivate youtube widget is HTML5 compatible. We were not using youtube so I never checked to see if it was HTML5 compatable.

If those things don't concern you, then go for it and save a few dollars.

Report · Feb 10, 2014

Thanks, you make good points!

I tried this method with YouTube and I like the results.. however!

How do you pause Captivate while the "web object" video page plays? the Captivate progress bar just keeps going. My first instinct was to make the slide the length of the video but then what if a student pauses the project at some point? They will then be cut off prematurely and move on the next slide

Report · Feb 10, 2014

You don't automatically go to the next slide after certain amount of time. You use a "pause" button to go to the next slide.

But you probably don't want them to click on the Next slide button until the video is over (or the audio part of the video may keep playing in the background even after they can no longer see the video - I haven't tried this with the youtube widget to see if this happens here like it does with the web object interface).

But you do set up the slide to last for the length of the video that you want to display.

If you don't want them to go to the next slide until the video is almost over, you can hide the Continue button (with a pause until the button is clicked) until the video is scheduled to be over. Then when when the button is clicked, the button sends them to the next slide (or wherever you want them to go).

The length of the video and the timer to hide the continue button are on 2 separate timers, so it does no good for the student to fast-forward through the video (another reason for keeping the "chapters" relatively short) so they cannot just fast-forward through one hour-long video.

Report · Feb 11, 2014

My issue still remains with buttons.. my "web object" video is the size of the slide 1280x720 so it takes up the whole slide. It seems that you cannot place objects such as buttons or smart objects ON TOP of a web interaction so I cannot get the student to click forward to the next slide

any help?

Report · Feb 11, 2014

We had the same problem initially (the buttons hide behind the web widget when the course was played).

Don't know if you can do it or not, but our solution was to use a smaller video size so that it didn't take up the entire slide.

We also made the slide taller than the video area so that we had about 1/2 inch of extra space below the video. On the bottom left corner of the slide we put "Chapter x of y" so the student knew how far the were in the videos. It also helped with debugging problems when students had issues. We reserved the bottom right corner for the continue button.

Another reason for not using the 1280x720 video size is that we wanted for students to be able to take the course on an iPad, and the suggested size for videos on the iPad is less than 1000 pixels wide.

Report · Feb 11, 2014

does the web interaction widget even work on iPad?

I thought it would only render to Flash

Report · Feb 11, 2014

We are using Captivate 7.01. It works fine on the iPad, as long as you publish to both flash and HTML5 and set up your course on your LMS so that it uses the HTML5 version for mobile devices and Flash for everything else.

In Captivate, have you ever looked at (on the menu bar) Window / HTML5 Tracker?

Report · Feb 10, 2014

Your server has to be set up to stream video. GoDaddy does NOT support streaming video. It should be able to accomodate progressive download. That should be the option checked when you import the video to Captivate.

If you are using streaming or progressive download, there is nothing to preload.

You could also try using a preload script, but it will not work in IE.

<video controls="controls" preload="auto">
<source src="sample.mp4" type="video/mp4" />
...
Your browser does not support the video tag.
</video>