Livestreams

Frontro provides professional-grade live streaming capabilities with complete encoder flexibility. Stream using any software or hardware encoder via RTMP, with WebRTC support coming soon.

Encoder Flexibility

Use Any Encoder You Want

Frontro supports any RTMP-compatible encoder, giving you complete freedom to use your preferred streaming setup:

Software Encoders

  • OBS Studio (Free, open-source)
  • Streamlabs Desktop
  • XSplit Broadcaster
  • Wirecast
  • NVIDIA Broadcast
  • Ecamm Live (macOS)
  • vMix
  • ManyCam

Hardware Encoders

  • Blackmagic ATEM Mini Series
  • LiveU Solo
  • Teradek VidiU
  • Pearl Series (Epiphan)
  • YoloBox Pro
  • Magewell Ultra Stream
  • Roland V-Series

Mobile Encoders

  • Larix Broadcaster
  • Streamlabs Mobile
  • Prism Live Studio
  • BeLive

Technical Specifications

RTMP Configuration

Connect to Frontro using these RTMP settings:

RTMP URL: rtmp://stream.frontro.com/live
Stream Key: [Your unique stream key from dashboard]

Advanced RTMP Parameters

# Full connection string format
rtmp://stream.frontro.com/live/{stream_key}

# With custom parameters
rtmp://stream.frontro.com/live/{stream_key}?backup=1&lowLatency=1

Supported Streaming Protocols

Currently Supported

  • RTMP (Real-Time Messaging Protocol)
  • RTMPS (Secure RTMP over TLS)
  • HLS (HTTP Live Streaming) for playback
  • DASH (Dynamic Adaptive Streaming) for playback

Coming Soon

  • WebRTC (Web Real-Time Communication) - Ultra-low latency streaming
  • SRT (Secure Reliable Transport) - Enhanced reliability
  • RIST (Reliable Internet Stream Transport) - Professional broadcast quality

Video Specifications

Supported Codecs

  • Video: H.264/AVC (recommended), H.265/HEVC, VP9
  • Audio: AAC-LC (recommended), MP3, Opus

Resolution Support

4K Ultra HD: 3840×2160 @ 30/60 fps
1440p: 2560×1440 @ 30/60 fps
1080p Full HD: 1920×1080 @ 30/60 fps
720p HD: 1280×720 @ 30/60 fps
480p SD: 854×480 @ 30 fps
360p: 640×360 @ 30 fps

Bitrate Recommendations

4K @ 60fps: 20,000-40,000 kbps
4K @ 30fps: 13,000-25,000 kbps
1080p @ 60fps: 4,500-9,000 kbps
1080p @ 30fps: 3,000-6,000 kbps
720p @ 60fps: 2,500-5,000 kbps
720p @ 30fps: 1,500-4,000 kbps

Audio Specifications

  • Sample Rate: 44.1 kHz or 48 kHz
  • Bitrate: 128-320 kbps
  • Channels: Mono, Stereo, 5.1 Surround

Setting Up Your Stream

Quick Start with OBS Studio

  1. Download OBS Studio from obsproject.com

  2. Configure Stream Settings

Settings > Stream
Service: Custom
Server: rtmp://stream.frontro.com/live
Stream Key: [Your key from Frontro dashboard]
  1. Optimize Output Settings
Settings > Output
Output Mode: Advanced
Encoder: x264 or NVIDIA NVENC
Rate Control: CBR
Bitrate: 6000 kbps (for 1080p 30fps)
Keyframe Interval: 2
  1. Configure Video Settings
Settings > Video
Base Resolution: 1920x1080
Output Resolution: 1920x1080
FPS: 30 or 60

Hardware Encoder Setup (ATEM Mini Example)

  1. Connect ATEM Software Control
  2. Open Streaming Settings
  3. Configure Platform:
    • Platform: Custom
    • Server: rtmp://stream.frontro.com/live
    • Key: Your Frontro stream key
  4. Set Quality: 1080p30 at 6 Mbps
  5. Start Streaming: Press "ON AIR" button

Advanced Streaming Features

Multi-Bitrate Streaming

Frontro automatically creates adaptive bitrate streams:

// Stream analytics API response
{
  "renditions": [
    { "name": "source", "resolution": "1920x1080", "bitrate": 6000 },
    { "name": "high", "resolution": "1280x720", "bitrate": 3000 },
    { "name": "medium", "resolution": "854x480", "bitrate": 1500 },
    { "name": "low", "resolution": "640x360", "bitrate": 800 }
  ]
}

Low Latency Mode

Enable ultra-low latency streaming (2-5 seconds):

// API configuration
const streamConfig = {
  lowLatency: true,
  targetLatency: 3, // seconds
  bufferSize: 1 // seconds
}

Redundant Streaming

Set up backup streams for reliability:

# Primary stream
rtmp://stream.frontro.com/live/{stream_key}

# Backup stream
rtmp://backup.stream.frontro.com/live/{stream_key}?backup=1

Stream Management API

Create Stream Session

POST /api/v1/streams/sessions
Authorization: Bearer YOUR_API_KEY
Content-Type: application/json

{
  "title": "My Live Stream",
  "description": "Stream description",
  "privacy": "public",
  "recordStream": true,
  "lowLatency": true
}

Get Stream Status

GET /api/v1/streams/sessions/{sessionId}/status
Authorization: Bearer YOUR_API_KEY

Response:
{
  "status": "live",
  "health": {
    "bitrate": 6245,
    "fps": 29.97,
    "keyframeInterval": 2.0,
    "droppedFrames": 0
  },
  "viewers": 1523,
  "duration": 3600
}

Update Stream Settings

PATCH /api/v1/streams/sessions/{sessionId}
Authorization: Bearer YOUR_API_KEY

{
  "title": "Updated Title",
  "enableChat": false,
  "enableDonations": true
}

WebRTC Support (Coming Soon)

Browser-Based Streaming

Soon you'll be able to stream directly from your browser:

// Future WebRTC implementation
const stream = await navigator.mediaDevices.getUserMedia({
  video: { width: 1920, height: 1080, frameRate: 30 },
  audio: { echoCancellation: true, noiseSuppression: true }
})

const peer = new FrontroWebRTCPeer({
  stream: stream,
  streamKey: 'your-stream-key'
})

await peer.startBroadcast()

WebRTC Benefits

  • Ultra-low latency: Sub-second delay
  • No encoder needed: Stream from browser
  • Adaptive quality: Automatic bitrate adjustment
  • Better NAT traversal: Works behind firewalls

Stream Health Monitoring

Real-Time Metrics

Monitor your stream health in real-time:

// Connect to metrics WebSocket
const ws = new WebSocket('wss://metrics.frontro.com/streams/{sessionId}')

ws.onmessage = (event) => {
  const metrics = JSON.parse(event.data)
  console.log('Bitrate:', metrics.bitrate)
  console.log('FPS:', metrics.fps)
  console.log('Dropped Frames:', metrics.droppedFrames)
}

Health Indicators

  • Green: Excellent (0% dropped frames, stable bitrate)
  • Yellow: Good (< 1% dropped frames)
  • Red: Poor (> 5% dropped frames or unstable connection)

Network Requirements

Minimum Requirements

  • Upload Speed: 5 Mbps (for 720p 30fps)
  • Latency: < 100ms to nearest edge server
  • Packet Loss: < 2%

Recommended Setup

  • Wired Connection: Ethernet preferred over Wi-Fi
  • Dedicated Bandwidth: 2x your target bitrate
  • Quality of Service: Prioritize streaming traffic

Edge Server Locations

North America: NYC, LAX, CHI, DAL, SEA
Europe: LON, FRA, AMS, MAD
Asia-Pacific: TOK, SIN, SYD, BOM
South America: SAO, GRU

Troubleshooting

Connection Issues

# Test RTMP connectivity
ffmpeg -re -i test.mp4 -c copy -f flv rtmp://stream.frontro.com/live/{key}

# Check latency to servers
ping stream.frontro.com

# Trace route for network path
traceroute stream.frontro.com

Encoder Settings Optimization

CPU Usage Too High

  • Lower preset (faster encoding)
  • Reduce resolution or framerate
  • Use hardware encoding (NVENC, QuickSync)

Stream Buffering

  • Lower bitrate by 20%
  • Increase keyframe interval to 2-4 seconds
  • Check upload bandwidth consistency

Audio Sync Issues

  • Set audio offset in encoder (-50ms to +50ms)
  • Use CBR for both video and audio
  • Ensure consistent sample rates

Best Practices

Pre-Stream Checklist

  1. Test Stream: Always run a private test
  2. Check Bandwidth: Run speed test
  3. Monitor CPU: Keep usage under 80%
  4. Audio Levels: Peak at -6dB
  5. Scene Setup: Test all transitions

Professional Tips

  • Use a wired internet connection
  • Stream at 80% of available upload bandwidth
  • Keep local recordings as backup
  • Use a UPS for power protection
  • Monitor chat from second device

API Integration Examples

Python Streaming Monitor

import requests
import time

class FrontroStreamMonitor:
    def __init__(self, api_key, session_id):
        self.api_key = api_key
        self.session_id = session_id
        self.base_url = "https://api.frontro.com/v1"
    
    def get_stream_health(self):
        headers = {"Authorization": f"Bearer {self.api_key}"}
        response = requests.get(
            f"{self.base_url}/streams/sessions/{self.session_id}/health",
            headers=headers
        )
        return response.json()
    
    def monitor_stream(self, interval=5):
        while True:
            health = self.get_stream_health()
            print(f"Bitrate: {health['bitrate']} kbps")
            print(f"FPS: {health['fps']}")
            print(f"Viewers: {health['viewers']}")
            time.sleep(interval)

Node.js Auto-Recovery

const FrontroStream = require('frontro-sdk')

class StreamManager {
  constructor(apiKey, streamKey) {
    this.client = new FrontroStream(apiKey)
    this.streamKey = streamKey
    this.reconnectAttempts = 0
  }

  async monitorConnection() {
    setInterval(async () => {
      const health = await this.client.getStreamHealth()
      
      if (health.status === 'disconnected') {
        await this.attemptReconnect()
      }
    }, 5000)
  }

  async attemptReconnect() {
    if (this.reconnectAttempts < 3) {
      console.log(`Attempting reconnect ${this.reconnectAttempts + 1}/3`)
      // Trigger encoder restart
      this.reconnectAttempts++
    } else {
      console.error('Max reconnection attempts reached')
      // Send alert notification
    }
  }
}

Livestream Trailer Videos

Maximize conversions from locked livestream pages by using trailer videos instead of static thumbnails. When a viewer doesn't have access to your livestream, a compelling trailer video can significantly increase subscription and purchase conversions.

How Trailer Videos Work

When a livestream is locked (viewer doesn't have access), FrontRow displays:

  • Without trailer: A static thumbnail with a subscription/purchase CTA
  • With trailer: A looping video preview with an overlay CTA

The trailer video plays automatically (muted) when a locked livestream page loads, giving potential subscribers a taste of your content and creating urgency to unlock the full experience.

Setting Up a Trailer Video

  1. Upload a video to your channel's video library first
  2. Create or edit a livestream in the Creator Dashboard
  3. Select "Trailer Video" in the livestream settings
  4. Choose from your existing videos - select a compelling preview clip

Best Practices for Trailer Videos

Content Guidelines

  • Keep it short: 30-90 seconds works best for conversion
  • Start strong: Hook viewers in the first 5 seconds
  • Show value: Preview the type of content they'll get access to
  • Include faces: Personal connection increases conversions
  • End with a tease: Leave them wanting more

Technical Recommendations

Duration: 30-90 seconds
Resolution: 1080p or higher
Format: MP4 (H.264)
Audio: Include but expect muted autoplay

Conversion Optimization

  • Use action-oriented clips from previous streams
  • Include testimonials or audience reactions
  • Show exclusive moments only available to subscribers
  • Highlight community interaction and chat engagement

Trailer Video Analytics

Track the effectiveness of your trailer videos in the Livestream Analytics dashboard:

MetricDescription
Trailer ViewsNumber of times the trailer started playing
Trailer Completion RatePercentage who watched to the end
Loop CountAverage number of times the trailer looped
CTA Click RatePercentage who clicked the subscribe/purchase button
Conversion RateViewers who converted after seeing the trailer

A/B Comparison

Compare conversion rates between livestreams with and without trailers:

// Analytics API response
{
  "livestreamId": "ls_123",
  "analytics": {
    "withTrailer": {
      "lockedViews": 1250,
      "conversions": 187,
      "conversionRate": 0.1496 // 14.96%
    },
    "withoutTrailer": {
      "lockedViews": 980,
      "conversions": 88,
      "conversionRate": 0.0898 // 8.98%
    },
    "improvement": 0.665 // 66.5% improvement with trailer
  }
}

API Integration

Get Livestream with Trailer

When querying a livestream, the trailerVideo field is only returned when the viewer doesn't have access:

query GetLivestream($id: ID!) {
  livestream(id: $id) {
    id
    title
    hasAccess
    trailerVideo {
      id
      url
      thumbnail
      duration
      title
    }
  }
}

Set Trailer Video

Update a livestream to add or change the trailer video:

mutation UpdateLivestream($id: ID!, $input: UpdateLivestreamInput!) {
  updateLivestream(id: $id, input: $input) {
    id
    trailerVideoId
  }
}

# Variables
{
  "id": "ls_123",
  "input": {
    "trailerVideoId": "vid_456"
  }
}

Remove Trailer Video

Clear the trailer video from a livestream:

mutation RemoveTrailer($id: ID!, $input: UpdateLivestreamInput!) {
  updateLivestream(id: $id, input: $input) {
    id
    trailerVideoId
  }
}

# Variables
{
  "id": "ls_123",
  "input": {
    "clearTrailerVideo": true
  }
}

Trailer Video Player Behavior

The trailer video player includes these features across all platforms:

FeatureBehavior
AutoplayStarts playing when page loads (muted)
LoopingAutomatically loops when video ends
Mute ToggleUsers can unmute to hear audio
CTA OverlaySubscribe/Purchase button always visible
ResponsiveAdapts to all screen sizes
Mobile OptimizedTouch-friendly controls

Platform Support

Trailer videos are supported across all FrontRow platforms:

  • Web (Desktop & Mobile browsers)
  • iOS App (SwiftUI with AVPlayer)
  • Android App (Jetpack Compose with ExoPlayer)
  • Smart TVs (Coming soon)

Support Resources


Last updated: January 2026 | Trailer videos now available on all platforms

Was this page helpful?