# Quickstart (/en/realtime-media/broadcast-streaming/quickstart/blueprint)
> For AI agents: see the complete documentation index at [llms.txt](/llms.txt).
This page provides a step-by-step guide on how to create a basic Broadcast Streaming app using the Agora Video SDK.
## Understand the tech [#understand-the-tech-11]
To start a Broadcast Streaming session, implement the following steps in your app:
* **Initialize the Agora Engine**: Before calling other APIs, create and initialize an Agora Engine instance.
* **Join a channel**: Call methods to create and join a channel.
* **Join as a host**: A live streaming event has one or more hosts. A host publishes audio and video to the channel. Hosts can also subscribe to streams from other hosts.
* **Join as audience**: Audience members can only subscribe to streams published by hosts.
* **Send and receive audio and video**: Hosts publish streams to the channel. Audience members subscribe to audio and video streams published by hosts.
## Prerequisites [#prerequisites-11]
* Unreal Engine 4.27 or higher
* Prepare your development environment according to your target platform and engine version:
| Dev environment requirements | Other requirements |
| :------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Android](https://docs.unrealengine.com/4.27/us-EN/SharingAndReleasing/Mobile/Android/AndroidSDKRequirements/) | - |
| [iOS](https://docs.unrealengine.com/4.27/us-EN/SharingAndReleasing/Mobile/iOS/SDKRequirements/) | A valid Apple developer signature. |
| [macOS](https://docs.unrealengine.com/4.27/us-EN/Basics/InstallingUnrealEngine/RecommendedSpecifications/) | A valid Apple developer signature. |
| [Windows](https://docs.unrealengine.com/4.27/us-EN/Basics/InstallingUnrealEngine/RecommendedSpecifications/) | 32-bit Windows only supports Unreal Engine 4 and below. To use Unreal Engine with 32-bit Windows, uncomment the code relating to `Win32` in the `AgoraPluginLibrary.Build.cs` file. |
* Two physical devices for testing
* A camera and a microphone
* A valid Agora account and project. Please refer to [Agora account management](manage-agora-account.md) for details.
## Set up your project [#set-up-your-project-11]
This section shows you how to set up your Unreal (Blueprint) project and install the Agora Video SDK.
**Create a new project**
Refer to the following steps or the [Unreal official guide](https://docs.unrealengine.com/4.27/us-EN/Basics/Projects/Browser/) to create a new project. If you already have an Unreal project, skip to the next section.
1. Open Unreal Engine. Select **Games** under **New Project Categories**, and click **Next**.
2. Configure your project as follows:
* **Template**: Select **Blank**.
* **Project Defaults**:
* **Language**: Select **Blueprint**.
* **Target Platform**: Pick **Desktop**.
* **Project Location**: Enter a project files storage path.
* **Project Name**: Type a suitable name for your project.
Click **Create**.
**Add to an existing project**
1. In the Unreal Project Browser, click on **Browse** and locate the `.uproject` file.
2. Select the project and click **Open**.
### Install the SDK [#install-the-sdk-11]
Take the following steps to add the Unreal (Blueprint) Video SDK to your project:
1. Download the latest version of Agora Unreal Video SDK from [Download SDKs](/en/api-reference/sdks?product=video\&platform=unreal-engine) and unzip it.
2. In your project root folder, create a `Plugins` folder.
3. Copy `AgoraPlugin` from the Unreal SDK folder to `Plugins`.
## Implement Broadcast Streaming [#implement-broadcast-streaming-11]
This section guides you through the implementation of basic real-time audio and video interaction in your game.
### Create a level [#create-a-level]
1. In the **Content** folder of the **Content Browser**, right-click and select **Level** to create a **Level Blueprint** and name it **BasicVideoCallScene**.
2. Double-click **BasicVideoCallScene** and click **Blueprints > Open Level Blueprint** above the editor to open the level blueprint.
### Implement basic processes [#implement-basic-processes]
In the **My Blueprint** panel, double-click **Graphs > EventGraph** to open the event graph. You see two event nodes: **Event BeginPlay** (game starts) and **Event End Play** (game ends). Create event nodes with the corresponding functions and variables, and connect them as shown in the following figure to implement the Broadcast Streaming logic:
The following table lists the main nodes:
| # | Node | Type | Description |
| :- | :------------------------------ | :--------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 1 | **Set Show Mouse Cursor** | Native\* | (Optional) Set whether to display the mouse cursor. Check to display it.
This node is available on Windows and macOS only. If the node is not retrieved at creation time, uncheck **Context Sensitive**. 
|
| 2 | **Load Agora Config** | Custom\*\* | Loads Agora configuration. Used to verify user identity when creating and joining channels. |
| 3 | **Create BP Video Widget** | Native | Create user interface:1) Add **Create Widget** node.
2) Select the node's **Class** as **BP\_VideoWidget** and associate the node with the already created user interface. |
| 4 | **Set Basic Video Call Widget** | Custom | Set up the user interface:1) Create the **BasicVideoCallWidget** variable and select the **Variable Type** of the variable as **BP\_VideoWidget**, which is the user interface created to store a reference to the user interface in the blueprint.
2) After dragging the created variables to **EventGraph**, two options, **Set BasicVideoCallWidget** and **Get BasicVideoCallWidget**, appear. Select **Set BasicVideoCallWidget** to create a node for accessing and setting the user interface. |
| 5 | **BindUIEvent** | Custom | Use Bind UI events to handle event logic after clicking the **Join Channel** and **Leave Channel** buttons. |
| 6 | **Add to Viewport** | Native | Add user interface to the viewport. |
| 7 | **Check Permission** | Custom | (Optional) Check whether you have obtained the system permissions required for real-time audio and video interaction, such as access to the camera and microphone.
If your target platform is Android, create this node to check system permissions.
|
| 8 | **Init Rtc Engine** | Custom | Create and initialize the RTC engine. |
| 9 | **Un Init Rtc Engine** | Custom | Leave the channel and release resources. |
\* Native nodes are nodes that come with the blueprint and can be added and called directly.
\*\* Custom nodes are not included in the blueprint. You create a custom function before you can add the corresponding node.
### Add channel-related variables [#add-channel-related-variables]
Add variables to create an engine instance and join a channel.
1. Create three variables:
**Token**, **ChannelId**, and **AppId**. Select the **Variable Type** as **String**.
2. In the **Load Agora Config** function, add the **Sequence** node, and then connect **Set Token**, **Set Channel Id**, and **Set App Id** respectively. Fill in the token, channel name, and app ID values obtained from Agora Console.
### Initialize RTC engine [#initialize-rtc-engine]
1. If your target platform is Android, check whether system permissions have been granted before initializing the RTC engine. Refer to the following figure to create nodes for adding permissions to access the microphone and camera in the **CheckPermission** function.
If your target platform is macOS or iOS, please refer to [How do I add the permissions needed for real-time interaction to my Unreal Engine project?](/en/api-reference/faq/integration/unreal_permissions)
1. To initialize the RTC engine, in the **InitRtcEngine** function, create and connect nodes as shown in the following figure:
2. Create `IRtcEngine` and `IRtcEngineEventHandler`.
1. To store references to the engine and event-handler interface classes, create `RtcEngine` and `EventHandler` variables, and set the **Variable Type** to **Agora Rtc Engine** and **IRtc Engine Event Handler**, respectively.
2. Add two **Construct Object From Class nodes**, set **Class** to **Agora Rtc Engine** and **IRtc Engine Event Handler** respectively. Connect to **Set Rtc Engine** and **Set Event Handler**, respectively.
3. Bind `IRtcEngineEventHandler` class-related callback functions.
4. Create `onJoinChannelSuccess`, `onLeaveChannel`, `onUserJoined`, and `onUserOffline` callback functions. Refer to the following table to configure the input parameters of the callbacks:
| Callback | Description | Input parameters |
| :---------------------- | :-------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `FOnJoinChannelSuccess` | The local user successfully joined a channel. | * `channel`: (String) Channel name.
* `uid`: (Integer64) The ID of the user joining the channel.
* `elapsed`: (Integer) The time (in milliseconds) that elapsed from the local call to `JoinChannel` till the occurrence of this event. |
| `FOnLeaveChannel` | The local user left the channel. | - `stats`: Call statistics. |
| `FOnUserJoined` | A remote user joined the current channel. | * `uid`: (Integer64) The user ID of the remote user joining the channel.
* `elapsed`: (Integer) The time (in milliseconds) that elapsed from the local call to `JoinChannel` till the occurrence of this event. |
| `FOnUserOffline` | A remote user left the current channel. | - `uid`: (Integer64) The ID of the user going offline.
- `reason`: Offline reason. For details, see `EUSER_OFFLINE_REASON_TYPE`. |
1. Create a **Bind Event** function. In this function, add a **Sequence** node, and then bind the `onJoinChannelSuccess`, `onLeaveChannel`, `onUserJoined`, and `onUserOffline` callback events.
2. `IRtcEngine` initialization
3. Call **Initialize** to initialize the RTC engine.
4. Connect to the **RtcEngineContext** configuration `IRtcEngine` instance and select **Channel Profile** as `CHANNEL_PROFILE_LIVE_BROADCASTING`.
### Bind UI events [#bind-ui-events]
To bind UI events:
1. Create and implement the `OnJoinChannelClicked` event callback.
2. Call **Enable Video** and **Enable Audio** to enable the video and audio modules.
3. Call **Join Channel** to join the channel.
4. Set the following parameters in **Make ChannelMediaOptions**:
* Set **Publish Camera Track** to `AGORA TRUE VALUE` to publish the video stream recorded by the camera.
* Set **Publish Microphone Track** to `AGORA TRUE VALUE` to publish the audio stream recorded by the microphone.
* Set **Auto Subscribe Video** to `AGORA TRUE VALUE` to automatically subscribe to all video streams.
* Set **Auto Subscribe Audio** to `AGORA TRUE VALUE` to automatically subscribe to all audio streams.
* Check **Client Role Type Set Value** and set **Client Role Type** to `CLIENT_ROLE_BROADCASTER` or `CLIENT_ROLE_AUDIENCE`, to set the user role to host or audience.
* Check **Channel Profile Set Value** and set **Channel Profile** to `CHANNEL_PROFILE_LIVE_BROADCASTING`.
5. Create and implement the `OnLeaveChannelClicked` event callback. When the event is triggered, call **Leave Channel** to leave the channel.
6. In the **Bind UIEvent** function, refer to the figure below to bind the `OnJoinChannelClicked` and `OnLeaveChannelClicked` callback functions to the **Join Channel** and **Leave Channel** buttons respectively. When the button is clicked, the corresponding event callback is triggered.
You can also bind UI events in Unreal Motion Graphics (UMG). This document only shows binding using the **Bind UIEvent Function**.
### Set up local and remote views [#set-up-local-and-remote-views]
1. Create and implement the **MakeVideoView** function to load the view when local or remote users join the channel:
2. In this function, create `SavedUID`, `SavedSourceType`, `SavedChannelID` local variables, set the **Variable Type** to `Integer64`, `VIDEO_SOURCE_TYPE`, and `String`, respectively. Save the variables for use when loading the view later.
3. Create a local view. In the local view, if the UID is 0, a value is randomly assigned by the SDK, and the video source type is `VIDEO_SOURCE_CAMERA_PRIMARY` (the first camera).
4. Create a remote view. In the remote view, the `uid` is the uid sent from the remote end, and the video source type is `VIDEO_SOURCE_REMOTE` (remote video obtained from the network).
5. Create and implement the **ReleaseVideoView** function to release the view when a local or remote user leaves the channel.
6. In this function, create `SavedUID`, `SavedSourceType`, and `SavedChannelID` local variables, set the **Variable Type** to `Integer64`, `VIDEO_SOURCE_TYPE`, and `String`, respectively. Save the variables for use when releasing the view later.
7. Release the local view.
8. Release the remote view.
### Implement callback function [#implement-callback-function]
Configure the previously created `onJoinChannelSuccess`, `onLeaveChannel`, `onUserJoined`, and `onUserOffline` callback functions as follows:
1. After the local user successfully joins the channel, the `onJoinChannelSuccess` callback is triggered and the local view is created. The `uid` is set to `0` by default, but it is assigned a random value by the SDK. The video source type is `VIDEO_SOURCE_CAMERA_PRIMARY` (first camera):
2. After the local user leaves the channel, the `onLeaveChannel` callback is triggered which releases the local view:
3. When a remote user joins the channel, the `onUserJoined` callback is triggeredd to create a remote view. `uid` is the uid sent from the remote end, and the video source type is `VIDEO_SOURCE_REMOTE` (remote video obtained from the network):
4. When a remote user leaves the channel, the `onUserOffline` callback is triggered to release the remote view:
### Leave the channel and release resources [#leave-the-channel-and-release-resources]
To leave the channel, implement the following steps:
1. Leave the channel.
2. Unregister Agora SDRTN® event callback.
3. Destroy `IRtcEngineObject` to release all resources used by Agora SDK.
Refer to the figure below to implement the `UnInitRtcEngine` function:
## Test the sample code [#test-the-sample-code-11]
Take the following steps to test the sample code:
1. In the **Load Agora Config** function, fill in the app ID, channel name, and temporary token for your project.
2. In the Unreal Editor, click Play to run your project. Click **JoinChannel** to join a channel.
3. Invite a friend to run the demo game on a second device. Use the same app ID, channel name, and token to join. After your friend joins successfully, you can hear and see each other.
## Reference [#reference-11]
This section contains content that completes the information on this page, or points you to documentation that explains other aspects to this product.
* If a firewall is deployed in your network environment, refer to [Connect with Cloud Proxy](build/optimize-quality-and-connection/cloud-proxy.mdx) to use Agora services normally.
### Next steps [#next-steps-11]
After implementing the quickstart sample, read the following documents to learn more:
* To ensure communication security in a test or production environment, best practice is to obtain and use a token from an authentication server. For details, see [Secure authentication with tokens](build/authenticate-users/use-tokens.mdx).
### Sample project [#sample-project-11]
Agora provides open source sample projects on [GitHub](https://github.com/AgoraIO-Extensions/Agora-Unreal-RTC-SDK/tree/main/Agora-Unreal-SDK-Blueprint-Example) for your reference. Download or view the [JoinChannelVideo](https://github.com/AgoraIO-Extensions/Agora-Unreal-RTC-SDK/tree/main/Agora-Unreal-SDK-Blueprint-Example/Content/API-Example/Basic/JoinChannelVideo) project for a more detailed example.
### Frequently asked questions [#frequently-asked-questions-9]
* [How can I listen for audience joining or leaving a channel?](/en/api-reference/faq/integration/audience_event)
* [How can I fix black screen issues?](/en/api-reference/faq/quality/video_blank)
* [Why can't I turn on the camera?](/en/api-reference/faq/quality/video_camera)
* [How can I solve channel-related issues?](/en/api-reference/faq/integration/channel)
* [How can I set the log file?](/en/api-reference/faq/integration/set_log_file)
### See also [#see-also-11]
* [Error codes](reference/error-codes.md)
* [Connection status management](build/optimize-quality-and-connection/connection-status-management.mdx)