An AI brief with a price on the button

A sales-intelligence company planned to start charging AI credits for its intelligence brief. Until then it had been free.

The ask
Redesign the brief for the day it costs credits: before, during and after the click.
The problem
A click that used to be free would now spend money, and nothing told people what they’d get for it.
Try the prototype

Built for a laptop screen.

A company page with the generated brief in a panel on the right. The page beside it has narrowed to one column.

The research

I put ChatGPT on a deep investigation of UX patterns for AI transactions. It came back with 24 sources. Three findings stood out.

  1. 1

    Show the value, not only the price.

    “Someone can understand the price perfectly and still hesitate because they cannot predict whether the result will be useful.”

  2. 2

    Surprise spending hurts as much as the price.

    “Unintended automation and unclear rerun behavior can be as important as the displayed price.”

  3. 3

    Trust has to follow the evidence.

    “Citations can increase perceived trust even when they do not support the answer.”

What existed

The brief starts writing the moment a company page opens, from a small card in the corner. The bar under the tabs explains the score and the brief, but it isn’t connected to either.

A company page. Top right, a small card reads Intelligence brief, generating. Below the tabs, a green bar explains the score.
The brief generating on page open, top right. The score bar sits on its own below it.
  1. 1

    No confirmation.

    Opening a page spends the credits.

  2. 2

    No sense of value.

    Nothing says what you’ll get or whether there’s enough data. A one-person firm still got a confident sales pitch, so people could feel ripped off.

  3. 3

    No connection.

    The score bar and the brief sit apart, and the open brief covers the data it was built from.

What I designed

A panel beside the page, in three steps.

1 Before: confirm the spend

The price is on the button. One line says whether there’s enough data for a good brief.

Strong matchReady to generate.
The panel with a green Generate brief, 50 credits button and a green line that says Ready.
Thin matchGenerate, with a warning.
The panel with the same button and an amber line that says the data is thin.
Not enough dataNo button and no charge.
The panel with the button turned off and one line: not enough data.
A bar across the page with the fit score on the left and a chip on the right that reads Intelligence brief, 50 credits.
The score bar now opens the brief, so the two read as one thing.

2 During: show the work

Each step shows what it found. Stop is free until the last step.

The panel while generating: three finished steps, each with a short finding, and one still running.

3 After: act on it

Every fact links to its source and says whether it’s observed or inferred. One next step: Draft outreach.

The finished brief: the angle in one sentence with source chips, Observed and Inferred tags, and a green Draft outreach button.

How I worked

Three hours, four AI sessions running side by side. I set the direction and reviewed the prototype out loud four times.

ChatGPT
The research.
Claude Code
Reviewed the live product in my browser and built the prototype.
Claude Code
Rebuilt the product’s page so the design sits in context.
Claude Code
Gathered 66 examples of how AI tools show what a run costs.

The product isn’t named. The page around the panel is a rebuild of its page and the panel is mine. Numbers are real, from a trial account, and people are shown by job title.

Ask Alex

What would you like to see?

Type / for the kinds of work.