Design/Show the finding, not the promise

Design

Principles

Seven rules the design holds to. Each has a sentence, the reason it exists, and a “do” and a “don’t” drawn side by side with the product’s own components, so the difference can be seen and not only read. The “don’t” is marked and is never to be built.

Principle 1

Show the finding, not the promise

An authenticity mark states what the provider found and nothing more; a check that is waiting, failed or inconclusive never looks like a pass.

Components: authenticity badge listingCard

Why

G-01: buyers must be able to trust what they buy. The badge is the authentication provider’s finding, not a platform guarantee, and pending, failed and inconclusive must never look positive. Brass is the accent, not the status colour: success is teal (SC-002), so a seal can never read as the brand.

Do

A teal seal names the provider and the date, with the certificate a tap away. A check that is still running is a quiet neutral badge.

Passed: the provider’s finding
Authenticated by Veritrace

Checked by the authentication provider, 12 Oct. The certificate card opens from the seal.

Still running: quiet and neutral

No check mark and no colour: nothing here can be read as a pass.

Don’t

A green seal on a listing whose check is only submitted; a badge that says “Guaranteed authentic”; a failed or inconclusive result hidden behind no mark at all.

A pass drawn on a pending check

This listing is only submitted to the provider, yet the card says it was authenticated.

A promise the platform cannot makeGuaranteed authentic

The finding is the provider’s, never a guarantee by the marketplace.

Principle 2

Two checks, two places

Digital authentication belongs to the listing; physical inspection belongs to the order; they are drawn apart and never merged into one “verified”.

Components: authenticity inspection orderTimeline listingCard stepper

Why

G-01 names both checks as different things. The listing page only shows that inspection can be chosen at checkout (A-015); the inspection’s status and its final verdict live on the order (D-006), and an inspection ends in passed or failed, nothing in between.

Do

On the order, an inspection stepper beside the delivery timeline, each with its own heading. On the listing, the authenticity seal only.

On the order: two things, two headings

Hub inspection

by Certa Inspection, Frankfurt hub

Separate from delivery
  1. Requested2026-10-20Paid with the order
  2. Awaiting item2026-10-21Seller sends the item to the hub
  3. Received at hub2026-10-24Logged at intake by the hub
  4. Passed or failedNot yetDecided by the hub specialist

Delivery

  1. Completed:Paid
  2. Now:In transit
  3. Next:Delivered

The parcel’s journey and the hub’s verdict never share a list.

On the listing: the seal onlyAuthenticated by Veritrace

Inspection can be chosen at checkout; its result is not shown here.

Don’t

One combined badge reading “Verified”; an inspection step folded into the delivery timeline; an inspection result on a listing that has not been sold.

One word for two checks

Nobody can tell whether a provider or a hub found something.

Inspection folded into delivery

Delivery

  1. Completed:Paid
  2. Completed:In transit
  3. Now:Inspected
  4. Next:Delivered

A verdict that is final sits in a list of things that can be late.

A verdict on an unsold listing

No order exists, so no inspection can have happened.

Principle 3

The whole price before the question

Every amount the buyer will be asked for is on screen, itemised, before they commit, and a converted amount always says it is approximate.

Components: priceBreakdown currencySelector listingCard button

Why

G-03: a sale must run safely from offer to delivery, and G-06: more currencies without rebuilding the core. The buyer’s currency is shown as approximate; the charge is in the checkout currency. Fees are still open (Q-001), so they are drawn as settings, never as figures with authority.

Do

A price breakdown with item, shipping, inspection fee and a total in tabular figures, and “≈” with the charged currency on every converted price. The seller’s breakdown shows fees and net.

Buyer: every line, the currency charged

Order total

Charged in USD
ItemConverted from €8,450
≈ $9,168.25
ShippingConverted from €45
≈ $48.83
Inspection feeHub inspection, Frankfurt
≈ $130.20
Taxes and duties
To be confirmed
Total
≈ $9,347.28

Converted amounts are approximate. The exact amount is shown before you pay.

The converted lines carry “≈” and where they were converted from.

A converted price on a card

€8,450 ≈ $9,168 approximate

The listing’s own currency leads; the conversion is marked.

Seller: fees and net

What you receive

Placeholder rates
Sale price
€8,450.00
CommissionPlaceholder rate: 12 %
−€1,014.00
Payment feePlaceholder rate: 2.9 %
−€245.05
Net payout
€7,190.95

Rates are placeholders until Q-001 is answered, and the view says so.

Don’t

An inspection or service fee that first appears on the payment button; a converted price without “≈” that looks like the amount charged; old-style figures that do not line up in a column.

A fee that first appears on the button
Item
€8,450.00
Shipping
€45.00
Total
€8,495.00

The total says €8,495.00; the button asks for €120.00 more.

A converted price that looks charged

$9,168

No “≈”, no word “approximate”, no checkout currency.

Figures that do not line up
Item
€8,450.00
Shipping
€45.00
Inspection fee
€120.00
Total
€8,615.00

Old-style figures in the display face jump above and below the line.

Principle 4

Say where the money is

At every step of an order the page says whether the payment is held, released or returned, and what has to happen next.

Components: orderTimeline progress badge tile feedback

Why

G-03 and the promise of escrowed payment: the payment provider holds the money and the seller is paid when the order completes. Payout states are on hold, released, paid and blocked. A buyer who cannot see where the money is will not trust the rest.

Do

An order timeline with “Payment held until you confirm delivery” at the paid step and “Released to the seller” at the last; on the seller’s side a tile for a payout on hold, with the date it can change.

The buyer’s timeline says where the payment is

Order

  1. Completed:Paid

    Payment held until you confirm delivery.

  2. Now:In transit
  3. Next:Delivered
  4. Next:Completed

    Released to the seller.

Held at the start, released at the end, and the step between says what is happening.

The seller’s payout, on hold
Payout, Corvane Mariner 41

€7,190.95

On hold. Can change from 2026-10-30.

The state and the date it can change, in words.

Don’t

A bare “Processing” badge for a paid order; a payout shown as paid while a case holds it; a toast for a money change that disappears after four seconds.

A bare status for a paid orderProcessing

The money has left the buyer and the page does not say where it is.

Paid, while a case holds it
Payout, Corvane Mariner 41

€7,190.95

Paid

A dispute case is open for this order.

Two statements that cannot both be true.

A toast for a change of money
Payout changed

Gone after four seconds; the reason and the next step went with it.

Principle 5

Keep the deal inside, and say why

When the product stops something that protects the buyer, it explains the reason in the place where it happened, in the voice of a house rule, not an accusation.

Components: chatNotice reputation feedback modal

Why

G-04: buyers and sellers deal only inside the product, so chat blocks contact details; G-05: reputation is visible. A silent block looks like a bug and invites the thing it prevents.

Do

A notice under the sender’s own message: “Contact details stay in the app”, with the message intact. A seller’s reputation as stars with the number, and “No ratings yet” when there are none.

The message stays, with the reason

Lovely. Could you send me your phone number so we can talk directly?

Not sent — contains a phone number

Message not sent

Contact details stay in the app — this keeps the sale protected.

A house rule, in the place it applies, with one way forward.

A reputation that is honest about being new
4.8out of 5(37 ratings)
No ratings yet

Stars with the number behind them; no ratings is said, not hidden.

Don’t

A message that silently disappears; a red modal that tells the sender they broke a rule; hiding that a new seller has no ratings.

The message simply vanishes

Happy to answer anything here.

Sofia’s message is gone and she cannot tell whether it was sent.

A red accusation

You broke our rules

Sharing contact details is forbidden. Repeated violations may suspend your account.

A person who asked an ordinary question is treated as an offender.

Principle 6

Quiet precision

Restraint is the luxury: one accent per view, hairlines before boxes, type doing the work, and motion that is slow and measured like a movement, not a banner.

Components: card listingCard button tabs loaders

Why

The client asked for a premium product with its own branding (SC-013, SC-002). The watchmaking theme gives the rules: an engraved-caseback serif for display and an exact sans with tabular figures for the rest (SC-020), and the Armillary, rings in motion held by one fixed brass meridian (SC-004), as the pattern for motion — the world moves, the measure stays still.

Do

Cormorant Garamond for titles and the price on a listing card, Inter for rows and controls, one primary action, the Armillary when something waits, and motion that stops under reduced motion.

A card: hairline, no shadow weight, type doing the work

The display face for the title and the price; the sans for the rest.

One primary action; a measured wait

The Armillary turns while the page waits, and holds still under reduced motion.

Don’t

A second accent colour; a serif in 13 px labels on the phone; heavy shadows and gradient fills on a card; an animation that loops for no reason.

A gradient, a heavy shadow, a second accent

Halden Reserve Automatic 38

€3,900

Three colours compete; the shadow lifts the card off the page for no reason.

A serif in a small label

Halden · 2021 · Very good

The display face thins out at 13 px; small text is the sans’s job.

An animation that never restsNew

It pulses forever and says nothing the label does not.

Principle 7

Say the end plainly, and give one way on

A final outcome, good or bad, is stated in plain words with what it means for the person and exactly one next action.

Components: emptyState feedback button orderTimeline modal

Why

The inspection verdict is final, with no appeal (D-006); a failure releases nothing, cancels the order and opens a case that records the decision and drives the refund (D-024, D-048). Every sale needs a way to go wrong safely. Dead ends and soft euphemisms spend the trust the rest of the product earned.

Do

A result page for a failed inspection: the picture, what the hub found, what happens to the item and the payment, and one button. The order timeline shows the case as the next step.

A failed inspection, said plainly

The hub found this item does not match its listing. The item is going back and your payment is returned.

What was found, what it means, and one place to go.

The case is the next step

Order

  1. Completed:Paid
  2. Completed:At hub
  3. Needs attention:In dispute

    A case is open for this order. Updates appear here.

The refund has a place on the timeline before the buyer asks where it is.

Don’t

“Oops, something went wrong” on a failed inspection; two equal buttons offering an appeal that does not exist; an error with no action.

A euphemism and two equal buttons

Oops, something went wrong.

The verdict is final; offering an appeal spends trust the product cannot repay.

An error with no way on

It says that something failed, not what or what to do.