BUILT FOR ELECTRON

Electron Live Streaming UI Kit

Build a desktop studio with Tencent RTC’s Electron Live Streaming UI Kit. Arrange camera, screen, and image sources, preview your layout, and start a broadcast.

DEVELOPER RESOURCES

Electron Live Streaming UI Kit Docs & Examples

Produce Live Events with Electron

Combine camera and screen sources in a desktop preview. Prepare the layout for a live presentation before starting the broadcast.

Connect Your Studio to Web Viewers

Pair the desktop broadcasting studio with an audience implementation. Keep production controls on the desktop and viewing controls in your audience app.

ELECTRON LIVE CAPABILITIES

Electron Live Broadcasting Features

Build the scene

  • Camera and screen sources
  • Image and window inputs

Prepare the show

  • Preview before broadcasting
  • Arrange source layouts

Go live

  • Desktop production workflow
  • Connect an audience client

Explore the Electron Live Studio

Prepare a desktop broadcast with media sources, scene layouts, and a preview before going live.

Studio project

Start with the official studio

Use the Electron sample as the foundation for a desktop broadcasting workflow.

Read the Documentation
Terminal
git clone https://github.com/Tencent-RTC/ultra-live-electron.git

CUSTOMIZATION

Customize Your Electron Broadcast Studio

Arrange camera, screen, and image sources in the desktop layout your broadcast needs.

Your visual identity

Adjust the visual presentation using the customization options available on your platform.

Read the Documentation

GET STARTED

Build Your Electron Live Streaming Studio

  1. 01

    Create your app

    Enable Live for your application and test users.

    Open Live Console
  2. 02

    Add the Electron Live Streaming UI Kit

    Follow the platform guide to connect your project.

    Follow the Integration Guide
  3. 03

    Connect your first room

    Configure the sample, add a source, and preview your broadcast.

    Set Up Authentication
Electron Live UI Kit
Terminal
git clone https://github.com/Tencent-RTC/ultra-live-electron.git
Terminal
cd ultra-live-electron
npm install
npm run start

Electron Live Streaming UI Kit FAQs

Is the Electron Live Streaming UI Kit a viewer app or a broadcasting studio?

The Electron Live Streaming UI Kit is a desktop broadcasting studio with multiple media sources and layout controls. Pair it with an audience implementation to watch the resulting live stream.

What do I need before trying the interface?

Enable the Live service and sign in with a valid UserSig. Complete the platform guide, including native permissions or browser HTTPS requirements, and test with separate host and audience accounts.

How do I authenticate users of the Electron Live Streaming UI Kit?

Create a UserSig on your server and pass it to the client after your own sign-in flow. Keep the application secret on your server.

Is the Electron Live Streaming UI Kit free to use?

The interface and the hosted Live service have different roles. Activate the service for your application and review the current plan, feature availability, and usage charges.

How do I integrate Electron Live Streaming UI Kit with Electron?

Follow the desktop package and native dependency requirements. Test device access, window changes and resource cleanup in your packaged desktop application.

How do I test Electron Live Streaming UI Kit before releasing my app?

Test the host and viewer roles, supported publishing or playback events and reconnect behavior.

How do I customize the interface for Electron Live Streaming UI Kit?

Customize the ultra-live-electron desktop studio source and its media-source layout. For example, place a screen capture behind a smaller camera view, then move, resize, rotate, or reorder the sources using the studio controls. The documented demo supports Windows 10 or later and provides broadcasting only. Build or integrate the viewer experience separately; React or Vue browser UI Kit theme props do not configure this Electron sample.

Electron Live Integration Support

Talk about your application

Discuss your product, expected usage, and integration needs.

Contact Sales

Create Your Electron Broadcast Studio

Start with the Electron Live Streaming UI Kit project and prepare your first broadcast.