Headless Browser Video Mixing via HTML5 Rendering

Resolve Bottlenecks,
Find Innovative Solutions
Generate Solutions

Solution Overview

Problem

Existing video stream mixing technologies face challenges in efficiently mixing and adjusting video streams in real-time, particularly during events like web conferences, due to CPU-intensive encoding and decoding, and difficulties in displaying multiple streams with varying quality and size.

Innovation Solution

The use of a headless browser for mixing video streams in HTML format allows for dynamic adjustment of video stream elements based on parameters like the number of participants, screen size, and predefined layouts, enabling efficient mixing and rendering of video streams.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Productivity

If traditional video stream mixing is used, then video streams can be mixed, but CPU load becomes excessively high due to intensive encoding and decoding

Engineering Contradiction:
Improvevideo stream mixing efficiencyVSAvoidCPU load
Core Design Contradiction:
ProductivityVSUse of energy by moving object

Solution Approach 1:

The patent replaces traditional CPU-intensive video encoding and decoding mechanisms with HTML5 video tags and CSS-based layout rendering. Video streams are mixed by embedding multiple video elements in an HTML document, where the browser's native video rendering engine handles playback and composition, eliminating the need for CPU-intensive transcoding operations.

Inventive Principle:
Principle #28Mechanics substitution (Replace mechanical system)

Solution Approach 2:

The patent changes the fundamental parameter of video stream representation from encoded video frames to HTML-compatible video elements. By converting video streams into a format natively supported by web browsers, the system leverages the browser's optimized video rendering pipeline, significantly reducing CPU load while maintaining mixing functionality.

Inventive Principle:
Principle #35Parameter changes

2Adaptability or versatility

If multiple video streams are mixed in real-time, then video production flexibility improves, but difficulty in adding, removing, and adjusting streams increases

Engineering Contradiction:
Improvevideo stream adjustment flexibilityVSAvoidstream management complexity
Core Design Contradiction:
Adaptability or versatilityVSDevice complexity

Solution Approach 1:

The patent creates a universal video mixing platform using HTML that can handle multiple video streams, adjust layouts, and accommodate dynamic participant joining/leaving through a single standardized interface. The HTML-based approach provides multi-functionality by enabling video mixing, layout management, and stream adjustment all within the same browser environment without requiring separate processing pipelines.

Inventive Principle:
Principle #6Universality (Multi-functionality)

Solution Approach 2:

The patent implements dynamic video stream management through HTML's inherent flexibility. Video streams can be easily added or removed by modifying the HTML document structure, and layout adjustments can be made dynamically through CSS transitions and JavaScript manipulation of video element properties, allowing real-time adaptation without system reconfiguration.

Inventive Principle:
Principle #15Dynamics

3Ease of operation

If video streams are displayed with varying sizes and quality, then user experience improves, but difficulty in managing display parameters increases

Engineering Contradiction:
Improvevideo display qualityVSAvoiddisplay parameter management
Core Design Contradiction:
Ease of operationVSDevice complexity

Solution Approach 1:

The patent applies local quality by allowing each video element in the HTML document to have independent CSS styling for size, position, and quality parameters. Each video stream can be individually configured with different dimensions, scaling properties, and quality settings through localized CSS rules, enabling customized display quality without centralized parameter management complexity.

Inventive Principle:
Principle #3Local quality

4Productivity

If CPU-intensive encoding and decoding is performed, then video stream mixing is achieved, but processing speed decreases

Engineering Contradiction:
Improvevideo stream processing speedVSAvoidprocessing power consumption
Core Design Contradiction:
ProductivityVSPower

Solution Approach 1:

The patent substitutes CPU-based video encoding/decoding mechanisms with browser-native video rendering. By leveraging the browser's optimized video playback engine and hardware-accelerated rendering, the system achieves faster processing speeds with lower power consumption, as the browser's video pipeline is specifically designed for efficient video composition and display.

Inventive Principle:
Principle #28Mechanics substitution (Replace mechanical system)

Data Source

PatentUS12010161B1Browser-based video production
Publication Date: 2024.06.11 BENDING SPOONS US INC
  • US12010161B1 patent drawing
  • US12010161B1 patent drawing
  • US12010161B1 patent drawing

AI summary

Systems, methods, and computer-readable media are provided for producing and mixing a video stream based on a predetermined video layout template and a set of selectable video streaming parameters. A plurality of individual video streams is received from a respective plurality of participant users and mixed into a mixed video stream on a mixing server which is distributed to a plurality of viewing users. An authoring server allows an authoring user to configure various video streaming parameters which instruct the mixing and display of the mixed video stream.