> ## Documentation Index
> Fetch the complete documentation index at: https://docs.spatius.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Backend Mode Client SDK

> Use AvatarKit clients to render messages produced by your Backend Mode.

The Client SDK side of Backend Mode Integration renders encoded audio payloads and motion data payloads from your backend. The client does **not** connect directly to Motion Server. Instead, it receives those payloads over your chosen transport and feeds them into AvatarKit.

```mermaid theme={null}
flowchart LR
    A["Your backend<br/>(Server SDK)"] -->|encoded audio payloads + motion data payloads| B["Your transport"]
    B --> C["AvatarKit Client SDK<br/>Backend Mode path"]
    C -->|yieldAudioData / yieldFramesData| D["Local avatar rendering"]
```

## Responsibilities

| Client SDK responsibility    | Description                                                                                         |
| ---------------------------- | --------------------------------------------------------------------------------------------------- |
| **Initialize AvatarKit**     | Configure the client with App ID, avatar, region, and the Backend Mode client setting for your SDK. |
| **Connect to your backend**  | Join your WebSocket, RTC room, or other downstream transport.                                       |
| **Consume encoded payloads** | Receive encoded audio payloads and motion data payloads provided by the Server SDK.                 |
| **Render locally**           | Feed messages into AvatarKit with `yieldAudioData()` and `yieldFramesData()`.                       |

<Warning>
  Do not call `start()` and `send()` for the Backend Mode client path. Those are Direct Mode methods. Backend Mode clients receive messages from your backend and call the `yield*` methods.
</Warning>

## Next steps

<CardGroup cols={2}>
  <Card title="Web SDK reference" icon="globe" href="/sdk-reference/web-sdk/reference">
    Backend Mode client methods such as `yieldAudioData()` and `yieldFramesData()`.
  </Card>

  <Card title="iOS SDK reference" icon="apple" href="/sdk-reference/ios-sdk/api-reference">
    iOS AvatarKit API reference.
  </Card>

  <Card title="Android SDK reference" icon="android" href="/sdk-reference/android-sdk/api-reference">
    Android AvatarKit API reference.
  </Card>

  <Card title="Flutter SDK reference" icon="mobile" href="/sdk-reference/flutter-sdk/api-reference">
    Flutter Backend Mode input and rendering API.
  </Card>
</CardGroup>

<CardGroup cols={1}>
  <Card title="Browse all demos" icon="github" href="/resources/demo-projects">
    Every runnable demo by platform and integration path.
  </Card>
</CardGroup>
