Introduction to Media in Vatom Spaces

The Media Share Plugin is the universal system for playing Audio, Video, and HLS LiveStreams from objects in Vatom Spaces. 

Adding audio and video to your space is a great way to give your space some emotion. Music and sounds can be attached to an object that only those nearby can hear. Videos can be playing at all times or only activated when someone walks up to it. 

The Components included with the Media Plugin are:

• Media Source - Controller - Clicking the Object opens the Media Controller to Select and Control Media, Share Screen or Webcam, or Play an HLS Livestream. 
• Media Source - From URL - Play media from a specific URL. Intended for objects where the media will not regularly change.
• Media Source - Stream - Stream presenters' Webcam or Screen-Share to an in-world screen.
• Media Destination - Audio - Plays audio from the Object. Any Object or Zone can be used as a media destination.
• Media Destination - Video - Plays Video on the Object. Only Planes and Basic Shapes created in Vatom Spaces can properly display video on them.

Audio and Video files must be in the following formats:

• Audio: .mp3 
• Video: HLS (.m3u8), .mp4 and .webm

Too many media sources will cause performance issues. Limit your Media Source Proximity so that only 2-3 sources maximum are presented to your guests at any time.

How to create & import Transparent Video

Drag and Drop Media Into Spaces

Drag and Drop accomplishes all four steps for you automatically. Video and Audio files can be dragged directly into the Space from the Desktop file browser, and will create new Objects with the media attached. 

• mp4 Video - Dragging in mp4 videos automatically creates a new Rectangle and attaches the correct Media Plugin components for video & audio.
• mp3 Audio - Dragging in mp3 audio file creates a default 3D Cube and attaches the correct Media Plugin components for audio.

Create New Media Screen

With the Media Plugin installed, you should now have a new Object called 'Media Screen' in your Insert Menu. 

From the Insert Dropdown, choose Objects > Media Screen. A Rectangle with all three components will be added to your Scene. Use the "Place on Wall" or other tools to scale and place your screen in the desired position.

Using the Media Plugin

There are four steps to add your media into the space:

1. Upload your Media Files to Storage
2. Create or Add an Object
3. Add a Media Source to the Object
4. Add a Media Destination to the Object

Install the Media Plugin

If the Media plugin is not enabled, you will need to enable it first. In the Admin Bar go to Plugins, search for "Media" and click Install.

1. Upload Media Content to Storage

Upload video and audio files to Vatom Storage by going to File -> Storage and selecting Upload    in the top-right. Once your files are uploaded, click on your file in the list, and select "Copy URL".

By using "Upload a Media File" in the Media Controller Component, a 'Media' folder will be automatically created in your storage and the file will be added there.

2. Add Object to Play Media

Media can be played from/on any of the Default Shapes created in Vatom Spaces.

The default "Rectangle" shape creates a standard 16:9 Screen. From the Insert dropdown choose Shape > Rectangle. 

3. Add Media Components

Add the proper components to control and play your media. The Default Screen has three components: a Media Controller, Audio Destination, and Video Destination.

You can attach these components to different objects to create a custom A/V experience. 

1. Open the Object you'd like to play media from in the Scene Editor. Right click the Object and select "Properties", or open the scene editor and click the object to select it.
2. Select the Components tab in the bottom-right of the Object Properties
3. Select Add a Component
4. Add a Source Component
   
   1. Media Controller
   2. Media Source - From URL
5. Add Media Destination Component(s)
   1. Audio Destination
   2. Video Destination

Component: Media Controller

The Media Controller Component can be used without being an Admin, allowing anyone (or selected users) to control media being played in the space. 

When a file is selected or played, a Media Source (From URL) is created and added to the object.

• Who Can Modify: In the Component Properties, choose between
  • Nobody
  • Everyone
  • Admin Only
  • Presenter Only
  • Admins and Presenters. 
• Play/Pause/Stop: Control playback of the media
• Seek to Position: Start playback at a specific time in the media.
• Loop Enabled/Disabled: Loop playback of the media
• Stop & Remove Media: Stop media and remove the content.
• Play from URL: Enter the URL of source media
• Upload a Media File: Upload a new media file
• Select an Existing Media File: Choose from the "Media" folder in Vatom Storage
• Share your Webcam: Display your Webcam on the Video Destination
• Share your Screen: Share your Screen to the Video Destination. Microphone Audio is included if the object also has an Audio Destination component.
• Play an HLS Stream: Play a .m3u8 HLS Live Stream. Only HLS live streams are currently supported to ensure a high quality stream for all viewers. 

Component: Media Source - From URL

Play media from a specific source. This media source can only be changed by Admins.

Media Sources are created automatically by the Media Controller when a source is selected.

• Source (URL): Choose the URL to the media file. This is often the URL you copied from Vatom Storage.
• Loop: To continuously play the media, make sure this is selected. If you would only like to play the media once, make sure this is deselected.
• Autoplay: Automatically plays the media.
• Synchronized: If selected, all users' media will be synchronized to play at the same time.
• Click to play: If selected, the media will play or stop when you click on the object.
• Proximity (meters): Media loads when the user comes within this distance from the Media Source. When set to 0 the media will always load (not recommended).

Component: Media Destination - Audio

• Media Source ID: Object ID that has the Media Source component. If you leave this blank it will use the Media Source on this object.
• Mute: Mute destination Audio
• Allow Click: 
• Volume: Setting to define "Full Volume". Setting volume between 30-50 is generally recommended.
• Full volume radius: This is the distance around the object that it plays at full volume. For this example, set it to 10.
• Silence Radius: This is the distance where the audio can't be heard any more. Silence Radius must be larger than Full Volume Radius or sound will not play. For this example, set silence radius to 20. Keeping the Silence radius larger than the Full Volume radius creates a "fade" effect as guests walk towards and away from media destinations. 
• Visualize: With the source playing, you can turn this on to get a visual representation of the audio's Full Volume and Silence radiuses.

Component: Media Destination - Video

• Media Source ID: Object ID that has the Media Source component. If you leave this blank it will use the Media Source on this object.
• Allow Click: Allow users to start/stop the media by clicking the object
• Aspect Ratio: Define the Aspect Ratio for your video
• Scale Mode: Options for stretching video to fill the shape it is being presented on.
• Transparent: Check this box to enable Alpha Channel for Transparent Video

Setting Media Screen Distances

There are three distance settings that control how your screen is interacted with. If you have sound coming from your media screen, adjusting the Full Volume radius and Silent radius is important. 

Advanced Configuration

By default, playback and audio proximity is centered around the middle of the video screen object and projects in all directions. This may not be ideal if your screen is very large, or nearby other screens.

Media components can be separated in order to place specific audio or video loading zones. 

Mall of Media Examples

Visit the Mall of Media in our Examples Space to see a number of configuration scenarios. 

https://spaces.vatom.com/@examples?x=969&y=1&z=-1127&o=-144

Back-to-back screens

In the below situation, two screens are on opposite sides of a wall. By default users may hear both screens when they stand close because the opposite screen projects through the wall (right).

In order to prevent overlap, the Audio and Controller components are placed on a sphere (left), so only video is played back from the screen object. 

This allows the designer to separate and specifically place the "viewing area"