Building the wallet · Add & Prove

How we’re building this · consumer UX direction

Two journeys the wallet owns:
Add and Prove.

Getting a trusted document in, and sharing the minimum to prove something. A phone may decide which wallet answers — it does not take over the wallet’s job.

The platform may mediate

  • Which wallet or document is offered to a website (the chooser sheet).

The wallet remains responsible for

  • Authenticating the verifier & validating the request
  • Understandable consent, and sharing the minimum
  • Explicit approval, and building the response securely
  • Delivery, and recovery when things go wrong
The boundary that must hold

Plain words on top — verified data underneath

Protocol terms never reach the person. But every simplified line is bound to the verified protocol data beneath it: simplification must never weaken verifier identity, consent integrity, or minimisation.

Each consumer line is the plain-language face of a security decision — not a replacement for it.
What the person sees What it is bound to (never weakened)
“✓ Verified issuer — Bundesdruckerei” Authenticated certificate path to a trusted issuer; the name comes from the certificate, never from caller-supplied text.
“weindeals.example · registered verifier” Verifier authenticated and its identifier bound to its certificate; the shown name is the authenticated one, and its stated purpose comes from its registration.
“Over 18: Yes” — and nothing else A single selectively-disclosed claim from a credential whose issuer signature and device key-binding verified; only that claim is placed in the response.
“Not shared: name, date of birth, address” Data minimisation: attributes outside the request are never assembled into the response — the “not shared” line is the true response contents.
“This site is asking for more than it registered for” The request is checked against the verifier’s registration; an over-ask is flagged before anything is shared.
“Approve with Face ID” A device-key signature over the exact request nonce (proof of possession). No approval → no response leaves the device.
Try it · tap to move through

A clickable walkthrough of both journeys

Pick a journey and tap the buttons — the same real controls a person would use, operable by keyboard and VoiceOver. Nothing is sent anywhere. Use Back or Start over any time; the “Aa Large text” button at the top scales this too.

Add your National ID?

Bundesdruckerei✓ Verified issuer

Use your phone to prove who you are — online and in person.

A clickable concept for review and moderated testing — no data is sent.

Journey · Add (issuance)

Add your National ID — calm, understandable, recoverable

Issuer-first, ordinary verbs, no protocol words. As few screens as it takes; a confident user moves quickly, an unsure one is never stuck. Every screen’s controls are real and reach VoiceOver in reading order.

← scroll to see every screen →

Add your National ID?

Bundesdruckerei✓ Verified issuer

Use your phone to prove who you are — online and in person.

ADD · 1

Meet the offer, issuer first

The authority is named and verified up front; purpose in one line; the attribute list is an optional button, never an approval wall.

VoiceOver reading order
  1. Heading “Add your National ID?”
  2. “Bundesdruckerei, verified issuer.”
  3. “Use your phone to prove who you are, online and in person.”
  4. Button “Add.”
  5. Button “What will be added?”
  6. Button “Not now.”

Do you know your ID card PIN?

The 6-digit PIN you chose for your ID card. You’ll enter it when you tap the card.

“I’m not sure” shows how to check or reset it — no rush.

ADD · 2

Ask about the PIN before the tap — calmly

We never assume a known PIN. “I’m not sure” leads to help framed as normal, not failure. Transport-PIN, CAN and blocked-PIN detail live in that help, not here.

VoiceOver reading order
  1. Heading “Do you know your ID card PIN?”
  2. “The six-digit PIN you chose… you’ll enter it when you tap the card.”
  3. Button “Yes, I know it.”
  4. Button “I’m not sure.”
  5. “Shows how to check or reset it, no rush.”

Hold your card to the top of your phone

Reading… keep the card still

ADD · 3

The tap — guided, and always cancellable

Live spoken status (“Reading… keep still”, and “Connection lost, reposition” on a slip). Every NFC and network step can be cancelled and resumed; a slip reconnects — it never restarts the journey.

VoiceOver reading order
  1. Heading “Hold your card to the top of your phone.”
  2. Live region announces “Reading, keep the card still” (updates on interruption).
  3. Button “Where is the chip on my card?”
  4. Button “Cancel.”

Add your National ID to this wallet?

BundesdruckereiGermany’s federal issuer

This lets you prove your identity and age, and sign in to public services.

ADD · 4

Confirm by purpose & issuer — not a checklist

We explain what the document is for and who stands behind it; the detailed attributes stay behind “What will be added?”, so the primary screen is calm.

VoiceOver reading order
  1. Heading “Add your National ID to this wallet?”
  2. “Bundesdruckerei, Germany’s federal issuer, verified.”
  3. “This lets you prove your identity and age, and sign in to public services.”
  4. Button “Confirm.”
  5. Button “What will be added?”

Preparing your National ID

We’ll send you a notification the moment it’s ready. You can close the app.

ADD · 5

Preparing is a state, not a spinner

Issuers deliver asynchronously; we say so, let the user leave, and continue on the home card with a notification when ready. No time promises until measured with the real Ausweis SDK, network and issuer paths.

VoiceOver reading order
  1. Heading “Preparing your National ID.”
  2. Live region “We’ll notify you the moment it’s ready. You can close the app.”
  3. Button “Done.”

Your National ID is ready

National ID · Germany
Astrid Andersson
Ready · kept on this device
ADD · 6

End on something useful to do

Success leads into a real, privacy-preserving action — prove age without revealing name or birth date — turning a one-time add into an active wallet.

VoiceOver reading order
  1. Heading “Your National ID is ready.”
  2. “National ID, Germany. Astrid Andersson. Ready, kept on this device.”
  3. Button “Prove your age.”
  4. Button “Go to Wallet.”
Durable state · Wallet home

The document lives as a home card — Preparing, Ready, Needs attention

Issuance status is a persistent card the user can leave and return to, carrying its own action so recovery is one tap away. It survives closing the app and rebooting.

Wallet

National ID · Germany
Preparing…
We’ll notify you when it’s ready
Nothing to do right now — keep using your phone.
HOME · Preparing

Preparing

Calm, no action needed.

Wallet

National ID · Germany
Astrid Andersson
✓ Ready
HOME · Ready

Ready

Usable; its primary action is to prove/share.

Wallet

National ID · Germany
Needs attention
One quick step to finish
We couldn’t finish adding your ID. Your progress is saved.
HOME · Needs attention

Needs attention

Recoverable, progress saved, one-tap continue — never a dead end.

Journey · Prove (consent)

Consent is the wallet’s — who’s asking, what’s shared, why, and what isn’t

When a website or reader asks, the wallet authenticates the verifier, validates the request, shows a plain request, shares the minimum, and takes an explicit approval. This screen is ours to get right.

Share with WineDeals?

weindeals.example✓ Registered verifier · age check at checkout
Over 18: Yes

Not shared: your name, date of birth, or address. Not stored by the site.

PROVE · 1

Who · what · why · retention · and what is not shared

One legible request: verifier + registered purpose, the single answer shared, retention stated, and an explicit “Not shared” line. Approval is a deliberate Face ID action.

VoiceOver reading order
  1. Heading “Share with WineDeals?”
  2. “weindeals.example, registered verifier, purpose: age check at checkout.”
  3. “Sharing: Over 18, yes.”
  4. “Not shared: your name, date of birth, or address. Not stored by the site.”
  5. Button “Approve with Face ID.”
  6. Button “See exactly what’s shared.”
  7. Button “Don’t share.”

Check this request

news.examplePurpose given: “read articles”
This site is asking for your full ID — more than it’s registered to need to let you read articles.

You can share nothing, or only what makes sense.

PROVE · over-ask

Warn on over-asking — a safety moment

Because the wallet authenticates the verifier against its registration, it flags a request beyond the declared purpose. The default is “don’t share”. Protection a passive chooser cannot offer.

VoiceOver reading order
  1. Heading “Check this request.”
  2. Alert “news.example is asking for your full ID, more than it’s registered to need.”
  3. Button “Don’t share.”
  4. Button “Share only what’s needed.”
Every path that isn’t happy

Errors, interruptions, and coming back later

Each names what happened in plain words and offers one clear recovery. Nothing dead-ends; progress is always saved.

That PIN didn’t match

You have 2 tries left. Take your time.

STATE · wrong PIN

Wrong PIN

Tries remaining shown; help offered before the last try.

Your card PIN is blocked

For safety it locks after three wrong tries. You can reset it and pick up where you left off.

STATE · blocked PIN

Blocked PIN

CAN / reset detail lives here in context, not on the calm primary screens. Resume after reset.

Lost the card

Line up the top of your phone with the card and hold still.

STATE · NFC lost

NFC interrupted

Auto-resume the read; never restart the whole flow. Cancel always present.

This phone can’t read your card

It doesn’t have the chip reader (NFC) needed. You can still add your ID another way.

STATE · unsupported device

Unsupported device

Detected before the tap; routed to alternatives, not a blank failure.

Couldn’t add your ID

Bundesdruckerei couldn’t confirm your details. Reason: the card has expired.

STATE · issuer rejection

Issuer rejection

The exact human reason from the issuer, plus retry and a real contact path.

The connection dropped

Your progress is saved. You can pick up right where you left off.

STATE · timeout

Timeout

Saved progress + resume; same pattern for any network step.

Still preparing

This is taking longer than usual at the issuer. You don’t need to wait here.

STATE · pending too long

Pending too long

Honest about issuer delay; converts waiting into a notification + status on the home card.

Welcome back

You were adding your National ID. Want to finish?

STATE · returning / interrupted

Returning & interrupted session

A resumed session is greeted, not reset; continue or start over.

Validated for large text, VoiceOver & older users

Accessibility is a design constraint, not a pass at the end

Use the “Aa Large text” button at the top to scale every screen. Full method and results: docs/ux/accessibility-validation.md. Empirical testing with people aged ~65–85 is the remaining gate before this is called final.

Built in

  • Real controls, real reading order — every action is a button; each screen is a labelled group; reading order equals visual order (no screen is a single flat image).
  • Adjustable large text — the whole prototype honours the large-text toggle; nothing is pinned tiny.
  • 44 pt minimum targets, full-width primary buttons, generous spacing.
  • High contrast both themes; no low-contrast grey for anything a person must read or do.
  • Flat structure — grouped rows and dividers, no card-within-card; criticals stay on screen.
  • Plain verbs — Add, Check, Tap, Confirm, Ready; no “PID”, no protocol words.
  • Reduced motion respected; the tap animation is decorative with a spoken status beside it.

How we validate before “final”

  • Large text: render at the large setting and confirm no clipping and every control reachable.
  • VoiceOver: traverse each screen — heading first, then context, then actions; live regions narrate the tap and preparing states.
  • Contrast & targets: WCAG AA (AAA where feasible) and ≥44 pt, checked against the tokens.
  • Older users (65–85): moderated sessions on the two tasks — “add your National ID”, “prove your age” — watching the PIN question and the tap. Protocol in the validation doc.