Bring your next website project to life with Popcorn: a responsive, full-screen background video widget for Adobe Muse. It's great for drawing attention to a new product, giving a sneak preview to your showreel and much more!
Simply add the widget to the page, select your video files in mp4 or webm format and you're away. You have full control of playback, with options to autoplay, loop, mute or unmute the sound, as well as display an on-screen control widget.
Please note: due to the unpredictable size of video files, the widget is disabled when the page is viewed on a mobile device; the poster image is displayed in its place.
Browse to the location where you downloaded the widget file. Extract the contents of the file. Double-click the .mulib file to import it into the Library. This will launch Muse if it's not already open.
Alternatively, once you’ve unarchived the file, you can import the widget into the library by clicking the Import Muse Library icon at the base of the Library Panel.
Once it's imported the new widget will appear in the Library panel as a folder containing one or more items..
Start by dragging the Popcorn widget from its folder in the Library Panel onto the design canvas. The banner image won't be displayed when the site is previewed or published.
The first section of the widget settings is File Selection.
We'll leave the majority of the settings at their defaults for the example - information about the options can be found in the Quick Start section above.
As the video we're using is black and white, we can use the overlay to add a tint. We've set the Colour to the same as the browser fill. We'll also lower the Opacity setting to 0.3.
With the settings in place, we can test the page. All being well, we should see the video running behind the page content.
Click here for a demo of the Popcorn widget using the example settings.
Notes: the widget has been tested using the major browsers. There are, however, a couple of minor issues when previewing locally: Safari only shows the poster image. Chrome plays the video but does not loop with some video files. It's recommended that you test the page using one of your temporary sites to be certain that your settings are OK