DOCSEARCHbyAlgolia
Submit Docs

VizVid Multimedia Player for VRChat

repository·develop·Indexed 41 days ago

https://github.com/jlchntoz/vvmw

A versatile multimedia player frontend for VRChat supporting video, audio, and image playback. Features include low latency streaming, AudioLink and LTCGI integration, modular UI architecture, and support for custom shaders and playlists. Compatible with VRChat Creator Companion (VCC) and vrc-get for installation.

Tokens
14.7K
Snippets
4
Records
73
Agent score
49%

What's inside VizVid

  1. Access VizVid documentation and API references

    develop

    VizVid provides comprehensive documentation and API references in multiple languages. Use the following links to access the manual or technical specifications:

  2. Explore VizVid Features

    develop

    VizVid is a multimedia player frontend for VRChat with the following key capabilities:

    • Playback: Basic controls, seeking, playback speed adjustment, and low latency mode (tested with RTSP/RTMP).
    • Content Management: Pre-defined playlists, user queue lists, and playback history for user-inputted URLs.
    • Visuals: PNG/JPEG Image Viewer, custom shaders with modes like Stretch, Contain, Cover, and Stereographic, and luminance adjustment.
    • Architecture: Modular screen, audio, and UI; supports multiple instances, both on-screen and separated interfaces, and local pickupable/scaleable screens.
    • Integrations:
      • AudioLink: Auto-switches audio sources and reports player state (progress, volume, loop, etc.).
      • LTCGI: Provides CustomRenderTexture for integration.
      • Udon Auth: Supports locked UI.
      • VRC Light Volumes: Includes a dedicated updater.
      • YTTL: Modified version to display video titles.
    • User Experience: Localization (English, Chinese, Japanese, Korean), auto-play via region detection, and easy UI color customization.

  3. Understand the difference between Prefabs and Components in VizVid

    develop

    VizVid uses two primary abstractions to build its functionality within Unity:

    1. Prefab: These are objects found in the Unity Hierarchy. They are pre-configured objects that contain one or more components ready for use. You can find them by right-clicking in the Hierarchy and navigating to VizVid > Modules.
    2. Component: These are the building blocks found in the Inspector. They define the logic and settings for specific features (e.g., Core, Screen Configurator).

    To build a custom VizVid setup, you typically place a Prefab into your scene or add specific Components to existing objects.

  4. Understand VizVid Prefabs and Components

    develop

    VizVid is built using two primary building blocks:

    1. Prefabs: Pre-configured objects containing multiple components that you place in the Unity Hierarchy. You can find available module prefabs by right-clicking in the Hierarchy and navigating to VizVid > Modules.
    2. Components: The individual functional units that appear in the Inspector and drive the behavior of VizVid objects.

    To create a functional player, you must include at least one VizVid Core component.

  5. Enable VRC Light Volume (VRCLV) for VizVid

    develop

    To enable VRC Light Volume:

    1. Right-click the VizVid screen object in the Hierarchy.
    2. Follow the configuration settings in the context menu to enable VRCLV.

    Note: VRCLV requires compatible shaders to display effects correctly.

  6. Implement Localization with Language Manager

    develop

    The Language Manager (located in the Locale object) manages translations for VizVid and other Text Mesh Pro UI elements.

    Customizing Translations

    1. Create a custom .json file following the project's JSON format.
    2. Define your Language Key and the corresponding translated text.
    3. Add the JSON file to the Language Manager (you can import multiple files to avoid overwriting built-in lists).

    Applying Translations to UI

    1. Select the Text Mesh Pro UI object you want to translate.
    2. Add the Language Reciver component to that object.
    3. Enter the corresponding Language Key in the component.

  7. Use VizVid Prefabs to quickly add modules

    develop

    You can add pre-configured module sets by right-clicking in the Unity Hierarchy and selecting from the VizVid > Modules menu. Available Prefabs include:

    Core & Control

    • VizVid Core: The essential core required for any VizVid instance to function. The default Core Prefab includes: AVPro Module, Builtin Module, Image Module, Playlist Queue Handler, Locale, Rate Limit Resolver, and Default Audio Source.
    • On-Screen Controls with Screen: A touch-screen style controller that includes a screen object.
    • Separated Controls: Independent controllers that can be placed away from the screen. Available in standard, Narrow (for small spaces), and Narrow with Alt. URL Input (for mobile platform compatibility) versions.
    • Overlay Controls: Controllers that follow the user, providing extra control methods for Desktop and VR modes.

    Screen & Interaction

    • Pickupable Screen: A movable and scalable screen. By default, it is set to Local, meaning only the holder can see it.
    • Screen: A standalone screen that can be separated from its controller.
    • Resync Button: A standalone button used to trigger re-syncing, useful for audio-visual performances.
    • Stream Key Assigner: Automatically generates stream keys and can be configured for services like TopazChat.

    Audio & Environment

    • Audio Source (Mono/Stereo/5.1 Surround): Adds specific audio source configurations for VizVid.
    • Auto Play on Near (Local Only): Automatically plays default videos when a user approaches and stops when they leave. (Supports Local mode only).
    • Light Volume for Screen: Enables VizVid screens to support VRC Light Volumes (VRCLV). This option only appears when a screen object is selected.
    • Active Region: Defines a physical area in the world that triggers specific functions when players enter.

    Utility

    • Stream Key Assigner: Automatically generates stream keys and can be configured for services like TopazChat.

  8. Edit VizVid Playlists

    develop

    The playlist editor allows you to manage media content through several interface components:

    Playlist Management (Left Panel)

    • Use <kbd>＋</kbd> or <kbd>ー</kbd> to add or remove entire playlists.
    • Drag and drop using the <kbd>＝</kbd> handle to reorder playlists.

    Media Content Management (Right Panel)

    • Use <kbd>＋</kbd> or <kbd>ー</kbd> to add or remove media links.
    • Title: Can be set manually or automatically via the <kbd>タイトルを取得</kbd> (Get Title) button using a YouTube URL.
    • Platform URLs: Entering a PC URL will automatically populate the Quest URL. You can set different URLs for URL (PC) and URL (Quest) to support platform-specific content (useful for live streams).
    • Backend: Select the backend for the media (default is AVProPlayer).
    • Reorder media by dragging the <kbd>＝</kbd> handle.

    Toolbar Functions

    • Top Toolbar:
      • リロード (Reload): Loads the last saved playlist.
      • 保存 (Save): Saves the current playlist to VizVid.
      • 全てエクスポート (Export All): Exports all playlists to a JSON file.
      • 選択したものをエクスポート (Export Selected): Exports the currently selected playlist to a JSON file.
      • JSON からインポート (Import from JSON): Imports a playlist from an external JSON file.
      • YT-DLP のダウンロード/更新 (Download/Update yt-dlp): Installs or updates the yt-dlp tool used for title retrieval.
    • Bottom Toolbar:
      • YouTube からプレイリストを読み込む (Load Playlist from YouTube): Imports a YouTube playlist URL into the current list (supports public and unlisted, but not private lists).
      • タイトルを取得 (Get Title): Reads a YouTube link to automatically fill the title field.
      • プレイリストを反転 (Reverse Playlist): Reverses the order of the playlist.

  9. Set up 3D Stereo or 5.1ch Surround Audio

    develop

    VizVid supports directional stereo and 5.1ch surround sound (via AvPro backend) for immersive audio experiences.

    3D Stereo Setup

    1. Add Audio Source (Stereo) from the menu; it will be automatically linked to VizVid.
    2. Adjust the bounds (yellow lines) and position the Audio Source in the scene.
    3. Click <kbd>推定</kbd> (Estimate) to adjust attenuation settings.
    4. Click <kbd>適用</kbd> (Apply) to save settings to the Audio Source.

    5.1ch Surround Setup

    1. Add Audio Source (5.1 Surround) from the menu; it will be automatically linked to VizVid.
    2. Adjust the bounds (yellow lines) and position the Audio Source in the scene.
    3. Click <kbd>推定</kbd> (Estimate) to adjust attenuation settings.
    4. Click <kbd>適用</kbd> (Apply) to save settings to the Audio Source.

    Note: Due to technical limitations of the Builtin backend, it may not support multiple Audio Sources, which can cause audio to output only from the left side. Adjust Builtin backend settings if necessary.

  10. Control multiple VizVid instances with Overlay Control

    develop

    If your world has multiple VizVid installations, use Overlay Control to switch which one the player controls based on their position.

    1. Select the object containing the VizVid Core component where you want to add an active region.
    2. Right-click the object and select VizVid > Modules > Active Region.
    3. Select the newly created Active Region object and adjust its bounds to define the trigger area.
    4. When a player enters this area, the Overlay Control target will switch to this VizVid instance.

  11. Configure Stereo or 5.1 Surround Audio Sources

    develop

    VizVid supports spatial audio configurations for Stereo and 5.1 Surround sound.

    Stereo Configuration

    1. Add an Audio Source (Stereo) via the menu (this automatically maps to VizVid).
    2. Adjust the yellow line range in the Inspector to set the sound source position.
    3. Click Estimate to recalculate attenuation settings.
    4. Click Apply to commit settings to the audio source.

    5.1 Surround Configuration

    1. Add an Audio Source (5.1 Surround) via the menu (this automatically maps to VizVid).
    2. Adjust the yellow box range in the Inspector to set the sound source position.
    3. Click Estimate to recalculate attenuation settings.
    4. Click Apply to commit settings to the audio source.

    Note: The Builtin backend does not support multiple Audio Sources and may result in audio only playing from the left side. Adjust accordingly.

  12. Use Stream Key Assigner for low-latency streaming

    develop

    The Stream Key Assigner allows you to generate and issue stream keys that are automatically applied to VizVid. This is useful for external RTMP/RTSP services like TopazChat.

    Configuration Options:

    • Core: Link to the Core component. If it shows Missing (Core), click <kbd>自動検出</kbd> (Auto-detect) to find the object with the Core component in the scene.
    • Playlist Queue Handler: Link to the Frontend Handler component. If it shows Missing (Frontend Handler), click <kbd>自動検出</kbd> (Auto-detect).
    • Player Backend Type: Select the player backend. For streaming events, AvProPlayer is typically used.
    • Stream Key Template: Specify the format for the generated stream key. Use {0} to represent the unique ID generated for the key.
    • Stream URL Template: The main streaming URL (defaults to TopazChat).
    • Alt. Stream URL Template: The alternative URL for mobile platforms (should use the same server as the main URL).
    • Number of Keys: The number of stream keys to generate.
    • Unique ID Length: The character length of the generated unique ID.