(NEW Plugin) Screen, Camera and Audio Recorder

Hello fellow developers,

We have built a plugin that records your screen, camera and audio from the Chrome browser and saves it as a .webm video file.

We use it as part of one our applications to record changes and review back with clients. A lot easier than using a third party screen recording tool.

That said, I thought it would be useful to others, especially these days with most stuff being done from home, therefore recording a presentation with a narrative might be helpful to some.

It does not use any APIs, and is run directly from your application and browser. Its quite resource intensive while recording, so recommend testing on 10 FPS to 24 FPS and removing debug_mode in URL.

Screen, Camera and Audio Recorder demo/editor

Plugin

Kind Regards

Omar

Project Manager

2 Likes

Hey Omar,

Thanks for the plugin. I’ve Installed it to play with it. I am now developing a collaboration tool, where it could be very useful. I’ve got several questions if you wouldn’t mind:

  1. Is it possible to turn the camera recording on and off? I haven’t found it
  2. Is it possible to use it if safari? Didn’t work for me
  3. Is it possible for the component to display only the camera (not the whole screen + camera)? I think it is more logical for the user actually
  4. Is it possible to hide controls on the component while recording? Play button, volume control etc. They seem to have no value for the user.

And could you please share your contacts or drop me an email at oleg [at] meetclicker.com? I’d like to discuss making some improvements to the plugin or maybe building a custom one for us, if it is interesting for you.

Thanks a lot!

Hello @oleg.sobolev66 thank you for your message, we will respond directly to you via email.

But re question 3, for others reference, we also have a camera only plugin - https://wgd-plugin-camera-recorder.bubbleapps.io/

I am using the camera only plugin but I have the same questions for #2 & #4 above. Plus, I’m looking to use this for a mobile app - on android (using chrome) It only lets me use the selfie camera no matter the selected camera. I’d also like to see the video full screen while recording.

Any help? thoughts?

Hello Robert,

Thank you for reaching out. Currently, the plugin is built for desktop/chrome only as it uses the browsers native functions. Unfortunately, we cannot test or build on the desktop version of Safari, as Apple no longer update the Windows version of this browser.

We have though since updated it re Oleg’s post, so you can now turn on or off, various options like screen record, camera, pc audio or microphone audio.

We do offer sponsorship of new plugin features, but only for the desktop version. However, if you email info@wegetdesign.com, we will assign your ticket to the plugin and if this does change, we can update you accordingly.

Kind Regards
Omar

2 Likes

ok, understood. However in the settings there is one for front camera and one for back camera. In testing on chrome using android OS both options access the selfie camera (front).

Hello Robert,

We are more than happy to confirm and check this, but if you can PM your email address across or email info@wegetdesign.com, we can assign a ticket to the plugin and keep you aware of any changes / or further tests.

Kind Regards
Omar

Could someone download their recorded video in another file format like .mov or .mp4

Keeping it in this format for online playback and recording is fine. Doesn’t work for those who wish to download and keep a version though. Imagine this requires an export of some sort? If possible that is.

Hello @scottmaloff at the moment it saves the file as a .webm video file is generally well supported by most video players. Also as its a file, you will be able to download from Bubble.

But that said, great feedback.

We will pass this onto our developers to review different formats and if possible/viable, we will certainly consider it in the road map for the plugin.

Does this allow recording of system audio i.e a video playing on the screen. I am building a video annotation app, where some of the video has audio. I want to record the user annotating the video, which is custom to each client they annotate it for. I can then share this session with the client, with the video retaining its original audio.

Sorry for the delay - you can switch off screen and webcam, and just have audio, but the file still saves as a video.

Thanks, but I’d like to know if it captures the system audio as well rather than just the audio from the mic?

Hello @christo1,

We just tested and you can record audio from a computer. When pressing record, screen pop up appears, mark share audio, then select the screen you want to record.

1 Like

Thank you!

Great plugin! Thanks for your work.

Doing some testing, it looks like the screen recorder plugin doesn’t let me record a video > 6MB? Am I doing something wrong or is there some sort of limitation somewhere that I’m not aware of? :smiley:

@sim sorry for the delay, we are not sure with the uploading capacity, but we certainly recorded much larger files. We are releasing updates to the plugin in the next few weeks, post this, we will sure to test this further on various browsers and see where the restrictions may lie.

Hi, I tried your demo page again, clicked that box recorded a youtube video and toggled audio on and off (microphone off, so it doesn’t capture it through there). No system audio is being recorded unfortunately after several efforts and checking that little share audio tickbox each and every time. Try it for yourself to see.

Hi, Does this plugin work on mobile? I have a native app wrapped using the bdk framework.

Hello @christo1 - we have just deployed an update to this plugin, that prevents the user from unclicking mute option on the record screen. See settings:

Hello @abdul this implementation only supports modern web/desktop browsers like Chrome. Unfortunately we do not support mobile implementations.