Solved: Re: Can you change the aspect ratio of student-rec... - Instructure Community - 114710

This discussion post is outdated and has been archived. Please use the Community question forums and official documentation for the most current and accurate information.

Most webcams students use to submit homework videos are capable of shooting in 16:9, but the video input recorded through Canvas is set at 4:3. Is there a way to tell Canvas to record in 16:9? Having students record in another program and upload their videos is not an ideal solution in terms of time and ease of use. From what I understand this isn't possible using custom JavaScript, CSS, or the API, and I haven't seen any other solutions. Any suggestions?

1 Solution

This question was asked a month ago Webcam format for an Assignment and unfortunately the only response there was "no" with a possible work-around that you've already rejected as being not ideal.

The problem, or better worded as lack of solution, is because the recorder uses Flash rather than HTML5

CSS is irrelevant because it's done through Flash, not HTML.

JavaScript might be able to accomplish something, but the content inside the DOM element #video_record that houses the invoked Flash object isn't on the page until someone clicks on the media upload button so you would need to add a MutationObserver or some other method to watch for it to appear. Even that doesn't guarantee that it will work. I changed the height and width to a different aspect ratio and the thing froze on me so I can't tell you for sure. It's more likely that the parameters are contained within the SWF file that is used to control the media recording.

The API doesn't help since it's done through the web interface. The video submission may occur through the API or it may be an AJAX call to a non-API page within the web-interface. I've seen that in at least one other place that made doing what I wanted to do nearly impossible.

You might be able to write an HTML5 implementation of a video capture, replace Canvas' Flash-based implementation with that by intercepting the JavaScript event handlers, upload it somewhere when done, and have it converted using Kaltura. Even if all that worked, there's no guarantee that the conversion process isn't hard-coded for a 4:3 ratio - you could probably upload a media file and see if it kept the proper aspect ratio. That's all hypothetical.

I'd have to go with there's currently no easy way to do it natively within Canvas that supports multiple browsers and multiple devices because some are still using Flash. If you truly need 16:9, you will have to look at recording it using something else and then uploading. Someone else may be able to provide a third-party solution.

That said, please excuse the following if it sounds stupid. I have limited experience recording with a webcam, so I'm not sure why you need 16:9. Are you saying that it won't record video at all if you use a 16:9 resolution? You may have to frame your shot differently, but my experience is that most people are taller than they are wide, so the need for 16:9 isn't apparent to me for a media recording through a webcam.

View solution in original post

7 Replies

This question was asked a month ago Webcam format for an Assignment and unfortunately the only response there was "no" with a possible work-around that you've already rejected as being not ideal.

The problem, or better worded as lack of solution, is because the recorder uses Flash rather than HTML5

CSS is irrelevant because it's done through Flash, not HTML.

JavaScript might be able to accomplish something, but the content inside the DOM element #video_record that houses the invoked Flash object isn't on the page until someone clicks on the media upload button so you would need to add a MutationObserver or some other method to watch for it to appear. Even that doesn't guarantee that it will work. I changed the height and width to a different aspect ratio and the thing froze on me so I can't tell you for sure. It's more likely that the parameters are contained within the SWF file that is used to control the media recording.

The API doesn't help since it's done through the web interface. The video submission may occur through the API or it may be an AJAX call to a non-API page within the web-interface. I've seen that in at least one other place that made doing what I wanted to do nearly impossible.

You might be able to write an HTML5 implementation of a video capture, replace Canvas' Flash-based implementation with that by intercepting the JavaScript event handlers, upload it somewhere when done, and have it converted using Kaltura. Even if all that worked, there's no guarantee that the conversion process isn't hard-coded for a 4:3 ratio - you could probably upload a media file and see if it kept the proper aspect ratio. That's all hypothetical.

I'd have to go with there's currently no easy way to do it natively within Canvas that supports multiple browsers and multiple devices because some are still using Flash. If you truly need 16:9, you will have to look at recording it using something else and then uploading. Someone else may be able to provide a third-party solution.

That said, please excuse the following if it sounds stupid. I have limited experience recording with a webcam, so I'm not sure why you need 16:9. Are you saying that it won't record video at all if you use a 16:9 resolution? You may have to frame your shot differently, but my experience is that most people are taller than they are wide, so the need for 16:9 isn't apparent to me for a media recording through a webcam.

Author

Thanks for your reply, James. One reason we were looking for 16:9 was that two students were/are going to be in the frame at once, so it would be better if they didn't have to be sitting right on top of each other or farther away from the camera and microphone. I'm not sure re-inventing the video capture system is our best option, but it may be the only one we have, unfortunately. Thanks again.

And that, John, is why I asked -- I hadn't thought of needing to put two students into the frame. Makes sense now.

@jhouder , you might be interested in presenting your use case and adding your upvote to the feature idea that just opened for voting today:

Author

Hi Stefanie. Thanks for bringing that to my attention. (That was actually posted by a coworker of mine, but I hadn't seen it yet.) I'm sure that functionality would be useful to a wide range of Canvas users, so I hope implementation is on its way.

You're welcome, @jhouder . I did notice that the verbiage of the feature idea was strikingly similar to yours, and I actually triple-checked to make sure you weren't the one who posted the feature idea.

ratio