# Presentations

A presentation is how the open widget sits on the page. It is one setting of a Web Agent, chosen in the **Look & feel** tab under **Presentation**.

## Usage

In the portal, go to [**Web Agents**](https://auth.faustine.ai/go?to=%2Fweb-assistants), select your agent and the **Look & feel** tab. Under **Presentation**, select a card, then **Save changes**.

The presentation is saved to the draft. Your users get it when you [publish a version](https://docs.faustine.ai/web-agents/publish-a-version/) and [deploy it](https://docs.faustine.ai/web-agents/deploy-a-version/).

## Presentations

| Presentation | What the user sees |
| --- | --- |
| **Studio window** | A floating window that the user can expand to full screen. This is the default. |
| **Glass panel** | A full-height panel on the side of the page, in clear glass. |
| **Dock bar** | A frosted command bar at the bottom center of the page. The conversation grows upward from the bar and the page behind it is dimmed. |
| **Flow veil** | Messages without bubbles, on a feathered veil over the page. |
| **Aura orb** | No message log. The answer to the last message is shown around an orb. |
| **Custom** | A widget you build from seven options. |

## Studio window styles

With **Studio window** selected, **Style** has two options.

| Style | What it changes |
| --- | --- |
| **Solid** | A white window with answers as plain text. This is the default. |
| **Glass** | A frosted window with bubbles on both sides. |

## Custom

**Custom** is the Studio window with seven options you choose in a wizard. With every option at its default, it is the Studio window in the **Solid** style.

| Option | Values | Default |
| --- | --- | --- |
| **Placement** | **Floating window**, with a margin all around. **Side panel**, full height and flush with the edge. | **Floating window** |
| **Side** | **Right**, **Left** | **Right** |
| **Surface** | **Solid**, opaque in your background color. **Glass**, frosted, the page shows through. **Clear**, the messages over the page on a light veil. | **Solid** |
| **Answers** | **Plain**, text directly on the surface. **Bubble**, each answer in its own box. | **Plain** |
| **Header** | **Title bar**, with the conversation title, the agent's name and the controls. **Minimal**, controls only. | **Title bar** |
| **The widget’s shapes** | **Your app’s look**, corners, border and shadow from the look of your app. **Faustine’s**, the widget's own shapes. | **Your app’s look** |
| **Full screen** | **Offered**, an expand button in the header. **Not offered**, the widget keeps its size. | **Offered** |

**The widget’s shapes** covers the window, the bubbles, the composer and the conversations list. With no look set for the agent, the widget keeps Faustine's shapes.

An agent has one custom widget. Selecting another presentation keeps it, and the **Custom** card shows its options in one line. **Edit** on the card opens the wizard again. See [Build a custom widget](https://docs.faustine.ai/web-agents/custom-widget/).

## Next steps

- [Build a custom widget](https://docs.faustine.ai/web-agents/custom-widget/): go through the wizard on the example app.
- [Choose a launcher and its position](https://docs.faustine.ai/web-agents/launchers/): choose what opens the widget.
- [Appearance](https://docs.faustine.ai/web-agents/appearance/): the rest of the **Look & feel** tab.
