Hi!
Is there any chance to place a Poster Image in the Videoplayer 'till its play Button is pressed.
This is possible with the HTML 5 Video embedding - just by adding "poster="video-standbild.jpg" right after the path to the Video(s).
As I understand the json File there needs to be a 3rd media attribut - right?
THANKS!
Thomas
it was strange but i noticed IE showed the videos own poster image but firefox was just black when I was testing on different browsers the other day
Which version of IE were you using? If IE8 then it may have been that a Flash-based 'fallback' video player was being displayed instead...
Also, some (HTML-video-capable) browsers will preload some of the video and display the first frame when no poster image is specified - though I'd recommend disabling that preloading as I've found that if you have a lot of video on one page this can cause a problem where some of the video just won't load - so I'd recommend explicitly disabling preloading and always creating a poster image.
On a related note, Safari on iOS 7 seems to have an issue where it just abritrarily stops displaying poster images: https://stackoverflow.com/questions/18613470/why-does-safari-on-ios-not-show-my-html5-video-poster
Unlike the person who reported this, I'm not having to restart Safari to make it work again, just re-launch the course.
MediaElement.js is used in the backend, and it has the facility to add a poster image. So we can make change in the source and add the poster image in the HBS file and additionally set it in the JS as below--
{
"_id":"c-15",
"_parentId":"b-10",
"_type":"component",
"_component":"media",
"_classes":"",
"_layout":"left",
"poster":"course/assets/poster.jpg",
"title":"Title of the media component",
"media": {
"mp4": "course/assets/big_buck_bunny.mp4",
"ogv": "course/assets/big_buck_bunny.ogv"
},
"body": "This is optional body text. Select the play button to start the video."
}
Hi,
sad but true... Can't make it work... :-(
What do I have to add to the media.hbs file?
Thanks!
Thomas
Hi Thomas -
Please give me time until Wednesday will create a sample and add it up here. Hope that would work for you.
Thanks!
Regards,
Aniket
Hey,
Just a heads up before we start duplicating work. The develop branch of the Media component needed updating. It now has two new attributes: "poster", "_allowCompletionOnInview".
"poster" - takes in an image url (make sure this is the same dimensions as the video
"_allowCompletionOnInview" - enables video to be set to complete on inview. If set to false it completes on the video being played.
I still think this component needs more work - let's think of other features we might want to change.
Thanks,
Daryl
Thanks Daryl for the heads up. We will look into the new version of this component and get back to you if we need to add more features apart from which are already present.
There are few issues though on iOS and Andriod of video not loading that we will add once we finish checking with the updated component.
Regards,
Aniket
Hi Daryl,
I think perhaps more useful for video completion would be some _completionCriteria attribute, which can take the values 'inView' 'onPlay' or 'onEnd' - rather than making the assumption you either want it to be on inView or onPlay if that's not set. What do you think?
I think Kev's approach offers more flexibility because of the onEnd value.
Otherwise savvy learners may figure out that if they just hit Play (but don't watch the whole video) it will still boost their progress.
Hey Kev and Nicola,
I'm not sure I see the benefit of having completion on clicking play. Maybe I'm struggling to see from a learning point of view when this is necessary. In my mind I have two possible scenarios:
1- the video isn't that important so scrolling past it sets it to complete.
2 - Video needs to be viewed fully to be completed. (The current variable _allowCompletionOnInview if set to false will enable option 2 above.)
I'd like to know if people would use on clicking play. But like I said - maybe I'm missing something?
Thanks,
Daryl
We've had issues previously on completion when user doesn't view a video all the way to the end which isn't always necessary from a learning point of view depending on content, i.e. in my last flex course framework series I always had a videoEnd cuePoint which signalled completion when the most important parts had been viewed.
There are issues depending on streaming host, sometimes of video complete not actually being passed across
Hey Adam,
So far we have tested the media component across all the browsers in our spec and the video completes even on iOS devices using a native media player. However I do see the need to have an end point as the video might have credits or a title at the end - the learner might close/stop the video before the end.
But I wonder if we might hit problems with streaming videos on this? I know a lot of the browsers give an event that a video has finished so instead we'd have to find out when the user clicks stop and see if the video is after the end point and trigger completion.
I'd like to hear people's views on this.
Thanks,
Daryl
all the requests we've had so far from internal staff and clients are for completion on clicking play.
the problem with completion on end is that unless you hide the seek bar, it's kind of pointless since you can just skip to the end (it also makes testing more painful!)
"2 - Video needs to be viewed fully to be completed. (The current variable _allowCompletionOnInview if set to false will enable option 2 above.)"
I think from a programming standards viewpoint, that's too tightly coupling two things which are not opposite (i.e. inView and onEnd). It feels kind of a flimsy inference to say "video doesn't complete on inview" == "video completes once its finished playing".
I was also going to mention the key thing Matt's pointed out: the overwhelming majority of our client requests for this component have been to complete on play.
Hey,
I'm not asking about semantics or coding standards - my question was about the learning value of clicking play to complete the video? Surely this misses the point of having the video. Either you want a learner to watch the video or not?
Yeah it's easier for testing - but that's not why you would have video completion set to on clicking play.
I quite like the idea of a percentage based completion. Would be interesting to hear what some learning designers think about this?
thanks,
Daryl
Hey,
My two pennies worth (I’m sure we had this debate when we were adding this the first time around J )
Tracking to flag progress to the learner to show when they have accidentally missed something is obviously different from a step locked course where you’re requiring confirmation of everything being seen (not my favourite approach but we still get plenty of requests for it). If it’s the former then tracking complete on click is adequate. If it’s the latter, it’s not. However, the point Matt makes is true – they can scrub forward with the seek bar. The other issue we’ve had with setting as complete on 100% viewing is that when people navigate away at 95% (when the credits are rolling as it were) – there video isn’t set as complete, yet they’ve sat through all the important stuff. I don’t think either is perfect, so have a configurable option would be a good solution. If I had to pick one, I’d go for completion on click (or perhaps when at least 5% complete or something like that).
I know it’s a cliché but (in the main) we’re dealing with adult learners who are only ‘cheating themselves’ if they choose to click and move on and not watch the content. If the course is well designed and the course owner really wants to be checking comprehension of the LO’s then they shouldn't be reliant on the flagging of a vid component to judge learner comprehension, etc.
Hey Paul,
Get summary of issues. I've had a go at hiding the controls for browsers. So far all desktop browsers hide them (including iPad). iPhone however loads up a native media player so this is a not possible on iPhones. I haven't checked android devices. I was also able to just show the play/pause button and duration.
Maybe if a locked down course is needed we can mention that it's possible on desktop and some tablets. (I'd like to run it over some more tests).
I think you've got a good point about adult learners who are only 'cheating themselves' - and the real learning is based upon the questions/activities around the video.
I did a really nice course on MongoDB (which I've probably mentioned before) - completely video lead with questions. The questions really tested your understanding of the video. There was no need to complete the video or even watch it - the questions were so specific to the video that you needed to watch it unless you knew the answer. Sometimes I knew the answer before watching the video - I didn't need to click the play button yet by answering the question I completed it.
I started to think maybe percentage is a bit hard to work out when designing a course. It would be nice to give a list of valuable learning points in the video - once these are all watched (this would need to be a locked down course) the video sets to complete. However this could be quite intensive on the browsers to watch for these specific times - and not too sure how a mobile device native media player would track this.
Thanks,
Daryl
I think it's meaningless. I sat through a whole episode of the Kirstie Alsop programme with the missus this week, and I couldn't tell you a single thing about it.
My favourite request for a feature to ensure comprehension of the material was 'can you disable the back and next button for 30 seconds so they have to read the words?'.
Ultimately you have to trust your learners.They have to demonstrate the knowledge by applying it in some way.
I think we’re on the same page. Progress tracking is just an aid that show's the user what they have chosen to view (not necessarily learn anything from).
Besides, if you really need to check understanding before allowing progress then you place an MCQ next to the video and add a trickle to the block which is only revealed when the question is answered as correct.
Hi!
As I mentioned in another Threat here (New Interaction ideas) - it would be great when we could have some possibillities to trigger text or grahic events thru some certain keyframes in a video.
Lets say the learner watch a video with an example conversation or a speach. At some points I would like to show some Text / graphic which explains more or just catches the phrase and point out some important additional info.
Dont know if the is an additional component - or makes sense here... (?).
Cheers
Thomas
@Thomas due to the need to have different video formats for different devices it would be best not to rely on cuePoints/keyFrames and instead use perhaps timecode as an attribute on items?
Would probably need to be a different component as lets say you had the video on the left and text appearing on the right but what would happen when you where looking at it in portrait on a mobile? perhaps text appearing below the video? but in that case you would probably also need to disable full screen on that instance of the video component.
Just some thoughts
It also depends on the content itself. If the content displayed is text, would the video then pause to let the learner read it? Or would they be short and snappy like a key word?
I do like the idea of video triggering graphical events though. Developing on your example of a speech - maybe a recorded conference with a timed slide deck?
I'd also be interested in how this would work for mobile.
Interesting questions, Nicola. I think the option of having the video auto-pause at cue points and requiring the learner to click to continue would be very useful in a number of scenarios. It would ,however, be hard to accomplish this through timecodes as attributes in separate components. By, instead, building said functionality into the videoplayer, we would also avoid the issue of having to disable full screen on mobile.
Use popcorn.js?
Thanks Julian. I hadn't looked into popcorn.js... Looks like a viable option.
Hey,
Not to kill peoples ideas about an interactive video component - but, the media component is and probably will stay just a video and audio player.
In terms of an interactive video player - a different type of component could be built. Media components are hard enough to get right across browsers.
Would like to keep these ideas going but under the new interactions thread.
Thanks,
Daryl