> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.ada.cx/docs/channels/messaging/choosing-an-experience/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.ada.cx/_mcp/server.

# Choosing an experience

## Overview

Choose how end users interact with [Messaging](/docs/channels/messaging). Your choice determines which interface your developers maintain.

## Limitations

[Messaging](/docs/channels/messaging) and Lovelace have different responsibilities. Lovelace provides React components; the SDK manages the conversation.

Lovelace requires React 19. It provides interface primitives, but it does not include complete survey or file-upload flows.

A custom interface can differ visually from the hosted widget. See the [Lovelace scope](/lovelace/overview#scope-of-this-release).

## Capabilities & configuration

Select a [Messaging](/docs/channels/messaging) integration based on the interface you need.

| Experience           | What you configure                                            | Developer responsibility                                                                                                                                                                  |
| -------------------- | ------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Hosted widget        | Dashboard branding, appearance, and behavior                  | Install the web or mobile SDK.                                                                                                                                                            |
| Custom app           | A hosted application that replaces the conversation interface | Connect through the Messaging bridge. Deploy the hosted app for updates on the next Ada view load. See the [update model](/messaging/custom-apps/overview#deploy-once-update-everywhere). |
| Headless integration | An interface owned by your website or native app              | Render messages and controls through SDK methods and events. Deploy each website or release a native app update that end users must install.                                              |

Dashboard branding is the first choice when the hosted interface meets your needs. Use [Appearance settings](/docs/channels/messaging/messaging-configuration/appearance-settings).

For a custom interface, share [Choosing an integration](/messaging/introduction/choosing-an-integration) with your developers.

## Implementation & usage

Plan ownership before you build a custom [Messaging](/docs/channels/messaging) interface.

* Custom apps require an approved origin in **Allowed websites**. See [Custom apps](/messaging/custom-apps/getting-started).
* Headless integrations require programmatic control for transcript methods and message events. Review [transcript exposure](/messaging/web/security-best-practices#limit-transcript-exposure).
* Lovelace can support either approach. See [Build a custom chat UI](/lovelace/build-a-custom-chat-ui).
* [Lovelace theming](/lovelace/theming) explains how dashboard brand settings map to design tokens.

Your developers must test accessibility, errors, uploads, surveys, and human support in the interface they build.

## Best practices

Keep [Messaging](/docs/channels/messaging) runtime delivery separate from component upgrades. The web SDK loads its runtime from Ada's CDN.

An npm loader version does not pin that runtime. Lovelace versions contain the components your application runs and require deliberate upgrades.

---

Have any questions? Contact your Ada team, or email us at [](mailto:help@ada.cx?subject=Help%20Docs%20inquiry).