---
auto_generated: true
created: 2026-05-18
manual_updated_at: 2026-05-18
modified: 2026-05-18
name: User_Manual
status: active
tags:
- client/barclays
- client/oliver
- domain/ai
- tech/fastapi
- tech/react
- tech/typescript
- type/sop
type: sop
---

# Barclays Banner Builder — User Manual

## What This Tool Does

The Barclays Banner Builder is an AI-powered tool designed for Mobile Banking campaign managers. It streamlines the creation of compliant, visually consistent marketing banners by:

1. **Generating Copy**: Creates compliant short titles, body text, and CTAs based on a campaign brief.
2. **Visual Design**: Automatically selects or generates appropriate illustrations/icons or images.
3. **Preview**: Shows in-situ previews of the banners in various formats (SM2, MD1, MD2, MD3, LG1, LG2, Custom).
4. **Export**: Generates a PDF contact sheet and a Workfront CSV for downstream processing.

## Who Uses It

This tool is intended for:
- **Campaign Managers**: Who need to produce high-volume, compliant marketing assets.
- **Creative Directors**: Who need to review and approve banner concepts.
- **Compliance Officers**: Who require an audit trail of system prompts and generated copy.

## How to Access

- **Live URL**: [https://optical-dev.oliver.solutions/barclays-banner-builder/](https://optical-dev.oliver.solutions/barclays-banner-builder/)
- **Login Credentials**:
  - Username: `admin@barclays.com`
  - Password: `change_me_password` (Ensure this is changed in production or use the provided temporary credentials).

## Main Workflows

### Workflow 1: Creating a New Banner

1. **Start a Conversation**:
   - Navigate to the main dashboard.
   - Click **"New Banner"** or **"Start New Brief"**.
   - Enter your campaign brief details (e.g., target audience, key message, campaign theme).

2. **AI Generation**:
   - The system will process your brief using the `gpt-5.4-mini` model.
   - A job ID is generated; the frontend polls for status. Wait for the "done" state.
   - Generated copy variants (short_title, long_body, cta) will appear.

3. **Review & Refine**:
   - Inspect the generated copy for FCA compliance and brand tone.
   - Click **"Refine"** to request changes to specific variants (e.g., "Make the CTA more urgent").
   - Character limits are enforced server-side:
     - Short Title: ≤ 32-64 characters (depending on format)
     - Long Body: ≤ 64-128 characters
     - CTA: ≤ 50 characters

4. **Select Visuals**:
   - Choose a **Theme**: Navy, Cyan, White, or Pale Blue (Barclays 4-colour palette).
   - Choose a **Format**: SM2, MD1, MD2, MD3, LG1, LG2, or Custom.
   - **Asset Selection**:
     - For *Illustration formats* (SM2, MD1, MD2, MD3, LG1): Use the icon selector.
     - For *Image formats* (LG2, Custom): Use the Adobe DAM selector (or mock in dev).

5. **Preview**:
   - View the banner in-situ. The preview updates in real-time as you adjust theme, format, or assets.

6. **Export**:
   - Click **"Generate Contact Sheet"** to download a PDF of all selected variants.
   - Click **"Export to Workfront"** to generate a CSV file for integration with Adobe Workfront.

### Workflow 2: Admin & Compliance

1. **Access Admin Panel**:
   - Navigate to `/admin`.
   - View and edit the **System Prompt** used by the AI. All version history is kept for FCA audit.
   - Manage users and permissions.

2. **Audit Trail**:
   - All generated copy and prompt versions are logged. Contact compliance if you need to retrieve historical prompts for a specific banner set.

## FAQ

**Q: What happens if the AI generates non-compliant copy?**
A: The system enforces server-side character limits. However, for content compliance, you must review all generated text in the "Review & Refine" stage. The tool assists but does not replace human approval.

**Q: Can I upload my own images?**
A: In production, images are sourced from Adobe DAM. If `ADOBE_DAM_API_BASE_URL` is empty (dev mode), a mock DAM is used. Direct uploads are not supported in the current version; use the DAM selector for image formats.

**Q: What are the banner formats?**
A:
- **SM2**: 312×109
- **MD1**: 312×119
- **MD2**: 312×118
- **MD3**: 312×132
- **LG1**: 312×279
- **LG2**: 312×333
- **Custom**: User-defined dimensions (limited by max character counts).

**Q: Why is my job stuck on "Running"?**
A: The frontend polls every 2 seconds. If it exceeds the 2-minute timeout, it will throw an error. Refresh the page or retry. If persistent, check the backend worker logs (`docker compose logs worker`).

**Q: How do I change the password?**
A: Use the user management section in the Admin Panel (`/admin`). Default admin password is `change_me_password`.