# Configure video encoding (/en/realtime-media/broadcast-streaming/build/manage-video-and-streaming/configure-video-encoding/blueprint)

> For AI agents: see the complete documentation index at [llms.txt](/llms.txt).

Customer satisfaction with your Video Calling integrated game depends on the quality of video and audio it provides. The sharpness, smoothness, and overall quality of the video is directly linked to the frame rate, bitrate, and other video encoder settings. Choosing improper settings can result in poor video quality. Conversely, if the settings are too demanding, the available bandwidth quickly gets choked, leading to a suboptimal experience for your users.

    This page guides you on configuring the video encoder settings to ensure optimal video quality in your Broadcast Streaming game.

    ## Understand the tech [#understand-the-tech-10]

    In Video SDK you can set the video dimensions, framerate, bitrate, orientation mode, and mirror mode by specifying a video profile. You can also set the degradation preference to specify how video quality is degraded under suboptimal network conditions.

    #### Resolution, frame rate, and bitrate [#resolution-frame-rate-and-bitrate-9]

    * **Resolution**: Defines the video encoding resolution in pixels. The default value is `960 × 540`. Higher resolutions generally result in better video clarity. Note that this parameter does not determine the final video orientation. Refer to [Video orientation](#video-orientation) for setting the video output orientation.

    * **Frame rate**: Represents the number of frames encoded per second (FPS). The default value is `15` FPS. A higher frame rate contributes to smoother video playback. For use-cases demanding high video smoothness, consider setting this parameter to `20` or `25`. It is advised not to exceed a frame rate of `30`.

    * **Bitrate**: Indicates the video encoding bitrate in Kbps. The default mode is set to *Standard Bitrate*. In this mode, the Video SDK dynamically sets an appropriate bitrate based on the channel profile, resolution, and frame rate.

    * **Minimum bitrate**: Sets the minimum video encoding bitrate in Kbps. The SDK automatically adjusts bitrate based on network conditions. The default value for this parameter allows the SDK to determine the minimum bitrate automatically, which is recommended for most use cases. Setting this parameter higher than the default value forces the video encoder to maintain higher quality, but may increase packet loss and affect video playback smoothness.

    Video SDK offers a variety of resolutions and frame rates to choose from. To specify your own configuration, refer to the [Video profiles table](#video-profiles-table).

    To achieve high video quality, it's crucial to maintain a balanced relationship between resolution, bitrate, and frame rate. Higher resolutions necessitate a higher bitrate. If the bitrate is fixed, an excessively high frame rate can reduce the resolution.

    The configured parameter settings represent maximum values under ideal conditions. In cases where video quality cannot reach the set maximum values due to network constraints or other factors, the actual values are adjusted to match the specified maximum resolution, frame rate, or bitrate as closely as possible.

    <CalloutContainer type="info">
      <CalloutDescription>
        Billing is based on actual video resolution, not configured settings. For example, if network adaptation reduces your video from 1280×720 to 640×360, you are billed for the lower resolution that users actually receive.
      </CalloutDescription>
    </CalloutContainer>

    #### Video orientation [#video-orientation-9]

    The way video is displayed on the playing device depends on `orientationMode` used on the encoding device, orientation of the capturing device, orientation of the playing device, and whether screen rotation is enabled on the playing device. On the capturing device, you can set the `orientationMode` to:

    * **Adaptive**

      In the this mode, the direction of the video output is consistent with the direction of the captured video. The receiving end rotates the video based on the received video rotation information. This mode is suitable for use-cases where the receiving end can adjust the video direction. No matter which mode you choose, Video SDK ensures that the relative position of the video and the status bar is always consistent at the capturing end and playback end.

    * **Fixed Portrait**

      In this mode, the output video is always in portrait mode relative to the Status Bar. If the captured video is in landscape mode, the video encoder crops it. This method is suitable for situations where the receiving end cannot process the rotation information.

    * **Fixed Landscape**

      In this mode, the output video is always in landscape mode relative to the Status Bar. If the captured video is in portrait mode, the video encoder crops it. This method is suitable for situations where the receiving end cannot process the rotation information, such as web browsers or legacy applications.

    The following table shows how video orientation behaves under different mode and device configurations:

    | Orientation mode    | Screen rotation | Capturing device | Recording server    | Receiving end display                           |
    | ------------------- | --------------- | ---------------- | ------------------- | ----------------------------------------------- |
    | **Adaptive**        | Disabled        | Landscape        | Landscape           | Landscape. Does not change with device rotation |
    | **Adaptive**        | Disabled        | Portrait         | Portrait            | Portrait. Does not change with device rotation  |
    | **Adaptive**        | Enabled         | Landscape        | Landscape           | Landscape. Rotates with device orientation      |
    | **Adaptive**        | Enabled         | Portrait         | Portrait            | Portrait. Rotates with device orientation       |
    | **Fixed landscape** |                 | Landscape        | Landscape           | Always landscape                                |
    | **Fixed landscape** |                 | Portrait         | Landscape (cropped) | Always landscape (cropped)                      |
    | **Fixed portrait**  |                 | Portrait         | Portrait            | Always portrait                                 |
    | **Fixed portrait**  |                 | Landscape        | Portrait (cropped)  | Always portrait (cropped)                       |

    The following images illustrate the orientation behavior:

    **Adaptive orientation mode**

    * Screen rotation: *Disabled*

    * Capturing device orientation: *Landscape*
      ![orientation\_adaptive\_locked\_landscape](https://assets-docs.agora.io/images/video-sdk/orientation_adaptive_locked_landscape.png)

    * Screen rotation: *Disabled*

    * Capturing device orientation: *Portrait*
      ![orientation\_adaptive\_locked\_portrait](https://assets-docs.agora.io/images/video-sdk/orientation_adaptive_locked_portrait.png)

    * Screen rotation: *Enabled*

    * Capturing device orientation: *Landscape*
      ![orientation\_adaptive\_unlocked\_landscape](https://assets-docs.agora.io/images/video-sdk/orientation_adaptive_unlocked_landscape.png)

    * Screen rotation: *Enabled*

    * Capturing device orientation: *Portrait*
      ![orientation\_adaptive\_unlocked\_portrait](https://assets-docs.agora.io/images/video-sdk/orientation_adaptive_unlocked_portrait.png)

    **Landscape orientation mode**

    * Capturing device orientation: *Landscape*
      ![orientation\_landscape\_landscape](https://assets-docs.agora.io/images/video-sdk/orientation_landscape_landscape.png)

    * Capturing device orientation: *Portrait*
      ![orientation\_landscape\_portrait](https://assets-docs.agora.io/images/video-sdk/orientation_landscape_portrait.png)

    **Portrait orientation mode**

    * Capturing device orientation: *Portrait*
      ![orientation\_portrait\_portrait](https://assets-docs.agora.io/images/video-sdk/orientation_portrait_portrait.png)

    * Capturing device orientation: *Landscape*
      ![orientation\_portrait\_landscape](https://assets-docs.agora.io/images/video-sdk/orientation_portrait_landscape.png)

    #### Degradation preference [#degradation-preference-9]

    To enhance the video experience for users in low-bandwidth conditions, the Video SDK offers the `degradationPreference` parameter. This parameter determines how video adapts when bandwidth is limited: prioritize frame rate for smooth playback, prioritize resolution for visual clarity, balance both qualities, or let the SDK decide automatically based on the scenario.

    #### Mirror mode [#mirror-mode-9]

    By default, Video SDK does not mirror the video during encoding. You use the `mirrorMode` parameter to decide whether to mirror the video that remote users see.

    ## Prerequisites [#prerequisites-10]

    Ensure that you have implemented the [SDK quickstart](../../index) in your project.

    ## Implementation [#implementation-10]

    Use the `SetVideoEncoderConfiguration` method to configure video encoding parameters.
    You can call this method at any point after initialization, whether it's before or after joining a channel. For optimal performance, best practice is to enable the video module by calling `EnableVideo` before calling `SetVideoEncoderConfiguration`. This approach reduces the time required for the first frame to be generated.

    To set the video encoder configuration, take the following steps:

    1. **Create UI**

    In `BP_VideoWidget`, create a **Video Encoder Configuration** area containing the following controls:

    * `ET_FPS`: Set the frame rate of video encoding.
    * `ET_Width`: Set the width of the video.
    * `ET_Height`: Set the height of the video.
    * `ET_BitRate`: Set the bitrate of the video.
    * `ET_MinBitRate`: Set the minimum encoding bitrate of the video.

    Sample UI Interface:
    ![Video call ui](https://assets-docs.agora.io/images/video-sdk/blueprint-assets/bp-videoprofile-ui.png)

    2. **Bind events**

    Follow the steps below to bind the corresponding events in the node.

    1. In the `Bind UIEvent` node, bind the `OnVideoConfigConfirmClicked` callback. This callback is triggered when the user sets the video encoding parameters in the video encoder configuration.

       ![OnVideoConfigConfirmClicked callback](https://assets-docs.agora.io/images/video-sdk/blueprint-assets/bp-bind-onvideoconfigconfirmclicked.png)

    2. In the `Bind Event` node, bind the `OnVideoSizeChanged` callback. This callback is triggered when there is a change in the video size or rotation information.

       ![OnVideoSizeChanged callback](https://assets-docs.agora.io/images/video-sdk/blueprint-assets/bp-bind-onvideosizechanged.png)

    3. **Implement the `OnVideoConfigConfirmClicked` callback**

    To change the video encoder configuration, take the following steps:

    1. In the **My Blueprint panel** of the Level Blueprint, follow these steps to create an `OnVideoConfigConfirmClicked` UI event node:

    2. Open the Level Blueprint.

    3. Locate the **My Blueprint** panel.

    4. Create a new UI event node named `OnVideoConfigConfirmClicked`.

    5. Connect the created UI element to the **Make VideoEncoderConfiguration** node. Pass in the encoding parameters entered by the user to configure the `VideoEncoderConfiguration`. Follow the steps below:

    6. Retrieve the user-specified values from the UI elements.

    7. Use these values as inputs to the **Make VideoEncoderConfiguration** node.

    8. Connect the output of the **Make VideoEncoderConfiguration** node to the appropriate input of the video encoding process.

       ![VideoEncoderConfiguration](https://assets-docs.agora.io/images/video-sdk/blueprint-assets/bp-videoconfig-value.png)

    9. Call the `SetVideoEncoderConfiguration` method and configure the following parameters in the **Make VideoEncoderConfiguration** node according to your specific requirements:

    10. **Orientation Mode:** Set the rotation direction of the video.

    11. **Degradation Preference:** Specify the degradation preference for video encoding when bandwidth is limited.

    12. **Mirror Mode:** Define whether the video screen seen by the remote user should be mirrored.

    13. **Compression Preference:** Set the compression preference for video encoding.

    Refer to the following sample interface:

    ![Orientation Mode](https://assets-docs.agora.io/images/video-sdk/blueprint-assets/bp-setvideoencoderconfiguration.png)

    4. **Implement the `OnVideoSizeChanged` callback**

    Follow the steps below to implement the `OnVideoSizeChanged` callback function and adjust the local view based on the video change information obtained in the callback:

    1. In the **My Blueprint** panel of the level blueprint, create an `OnVideoSizeChanged` event node.
    2. Within the `OnVideoSizeChanged` callback, obtain the key parameters of the video change information: `sourceType`, `uid`, `width`, `height`, `rotation`.
    3. Pass these parameters into the **Make FVideoViewIdentity** node to adjust both the local and remote views accordingly.

    Sample implementation:

    * Connect the obtained parameters (`sourceType`, `uid`, `width`, `height`, `rotation`) to the corresponding inputs of the **Make FVideoViewIdentity** node.
    * Adjust the local and remote views using the output of the **Make FVideoViewIdentity** node.
      ![OnVideoSizeChanged callback](https://assets-docs.agora.io/images/video-sdk/blueprint-assets/bp-onvideosizechanged.png)

    ### Troubleshooting [#troubleshooting-10]

    The following are some common issues and their solutions:

    | Issue                           | Possible solution                                                                  |
    | ------------------------------- | ---------------------------------------------------------------------------------- |
    | **Blurry video**                | Increase resolution or bitrate                                                     |
    | **Choppy/laggy playback**       | Reduce resolution, increase minimum bitrate, or use maintain framerate degradation |
    | **High bandwidth usage**        | Lower resolution or frame rate                                                     |
    | **Video orientation incorrect** | Use fixed portrait or fixed landscape orientation mode                             |

    ## Reference [#reference-10]

    This section contains content that completes the information on this page, or points you to documentation that explains other aspects to this product.

    ### Video profiles table [#video-profiles-table-10]

    Video SDK provides a selection of video dimensions and frame rates to choose from. You can also customize the values according to the following table:

    | Resolution (width × height) | Frame rate (fps) |
    | --------------------------- | ---------------- |
    | 160 × 120                   | 15               |
    | 120 × 120                   | 15               |
    | 320 × 180                   | 15               |
    | 180 × 180                   | 15               |
    | 240 × 180                   | 15               |
    | 320 × 240                   | 15               |
    | 240 × 240                   | 15               |
    | 424 × 240                   | 15               |
    | 640 × 360                   | 15               |
    | 360 × 360                   | 15               |
    | 640 × 360                   | 30               |
    | 360 × 360                   | 30               |
    | 480 × 360                   | 15               |
    | 480 × 360                   | 30               |
    | 640 × 480                   | 15               |
    | 480 × 480                   | 15               |
    | 640 × 480                   | 30               |
    | 480 × 480                   | 30               |
    | 848 × 480                   | 15               |
    | 848 × 480                   | 30               |
    | 640 × 480                   | 10               |
    | 960 × 540                   | 15               |
    | 960 × 540                   | 30               |
    | 1280 × 720                  | 15               |
    | 1280 × 720                  | 30               |
    | 960 × 720                   | 15               |
    | 960 × 720                   | 30               |
    | 1920 × 1080                 | 15               |
    | 1920 × 1080                 | 30               |
    | 1920 × 1080                 | 60               |
    | 2560 × 1440                 | 30               |
    | 2560 × 1440                 | 60               |
    | 3840 × 2160                 | 30               |
    | 3840 × 2160                 | 60               |

    <CalloutContainer type="info">
      <CalloutDescription>
        After you set the resolution and frame rate, the SDK automatically sets the corresponding bitrate. Agora does not recommend that you modify the bitrate manually.
      </CalloutDescription>
    </CalloutContainer>

    ### Sample project [#sample-project-7]

    Agora provides open source sample projects for your reference. Download or view the following projects for more detailed examples.

    * [`SetVideoEncoderConfiguration`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_setvideoencoderconfiguration)
    * [`FOnVideoSizeChanged`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengineeventhandler.html#callback_irtcengineeventhandler_onvideosizechanged)

    ### API reference [#api-reference-10]

    * [`SetVideoEncoderConfiguration`](https://api-ref.agora.io/en/video-sdk/blueprint/4.x/API/class_irtcengine.html#api_irtcengine_setvideoencoderconfiguration)

    
  
