figma guide
Designing breach settlement proof of payment and remittance advice UI in Figma: PROOF-PAY-*, REMIT-ADV-*, and claimant downloadable artifacts
Design breach settlement proof of payment UI in Figma with PROOF-PAY-* PDFs, REMIT-ADV-* remittance lines, tax-safe redaction, and portal download after CONF-BANK-* settlement.
- Published
- Updated
- Sep 21, 2026
- Read time
- 4 min
- Level
- Intermediate
Quick answer
Proof-of-payment UI gives claimants a durable, court-defensible receipt—not a screenshot of the status portal timeline. Design PROOF-PAY- PDF/HTML artifacts* generated only after CONF-BANK-* settlement (or documented VAR-MATCH-* waiver), REMIT-ADV- line items* mirroring NACHA addenda (gross award, lien offset, tax withholding, net paid), and REDACT-PAY- rules* so downloads never expose full bank tokens or other claimants’ data. Portal surfaces should offer DL-PROOF- with step-up* (identity re-verification when session stale), version stamps when award restatement changes historical amounts, and NOTIF-PROOF-* only after artifact hash is stable. Without this UI, support reissues ad hoc letters, call center agents email unsecured spreadsheets, and final accounting lacks claimant-facing corroboration. Start from the Figma guides hub and pair with disbursement tracking, data portability export patterns, and privacy settings.
Who this is for
- Product designers owning claimant-facing documents after money moves.
- Legal and communications teams standardizing remittance language across rails.
- Engineers generating immutable PROOF-PAY-* blobs tied to MATCH-LINE-* ids.
PROOF-PAY-* artifact model
ProofOfPayment — PROOF-PAY-8812 · CLM-4412 · Tranche T3 · Status: Available
├── Preconditions:
│ ├── MATCH-LINE-* or SETTLED-* from [bank confirm](/designing-breach-settlement-bank-confirmation-and-trace-matching-ui-in-figma/)
│ ├── FIN-AWD-* version frozen at settlement snapshot
│ └── No open [clawback](/designing-breach-settlement-clawback-and-overpayment-recovery-ui-in-figma/) dispute on this payment
├── ID namespace:
│ ├── PROOF-PAY-* (artifact record)
│ ├── REMIT-ADV-* (structured line breakdown)
│ ├── HASH-PROOF-* (SHA-256 for integrity)
│ ├── DL-PROOF-* (download session)
│ ├── LOG-PROOF-* (access audit)
│ └── REDACT-PAY-* (field visibility policy)
├── Contents:
│ ├── Program name · court case caption · claim id
│ ├── Payment date · rail · trace last-4 / check last-4
│ ├── REMIT-ADV-* table · gross → net
│ ├── Optional [1099](/designing-breach-settlement-tax-reporting-and-1099-ui-in-figma/) summary pointer
│ └── Support contact · not legal advice footer
└── Formats:
├── PDF (default) · accessible tags
├── HTML print view · same HASH-PROOF-*
└── JSON bundle · [portability](/designing-data-portability-and-machine-readable-export-ui-in-figma/) opt-in
| State | Portal UX | Support |
|---|---|---|
| Pending settlement | Disabled + ETA link | SCR-PROOF-PEND |
| Available | Primary download CTA | SCR-PROOF-YES |
| Superseded | Show new version banner | SCR-PROOF-VER |
| Withheld (clawback) | Explain hold · no download | SCR-PROOF-HOLD |
Verdict: Never generate PROOF-PAY- from export upload alone*— wait for CONF-BANK-* or explicit counsel waiver with LOG-WVR-*.
REMIT-ADV-* remittance breakdown UI
RemittanceTable — REMIT-ADV-4412-T3 · Currency: USD
├── Line items (example):
│ ├── Award per [plan of allocation](/designing-breach-settlement-plan-of-allocation-and-award-chart-ui-in-figma/) · $400.00
│ ├── [Tier objection](/designing-breach-settlement-tier-objection-and-award-challenge-ui-in-figma/) adjustment · $0.00
│ ├── [Lien offset](/designing-breach-settlement-lien-and-third-party-creditor-offset-ui-in-figma/) · −$50.00
│ ├── [Backup withholding](/designing-breach-settlement-tax-reporting-and-1099-ui-in-figma/) · −$35.00
│ └── Net paid · $315.00
├── Display rules:
│ ├── Match [status portal](/designing-breach-settlement-claim-status-portal-and-claimant-dashboard-ui-in-figma/) amounts exactly
│ ├── Footnote [pro rata reduction](/designing-breach-settlement-fund-shortfall-and-pro-rata-reduction-ui-in-figma/) if applicable
│ └── Intl · FX line + link [foreign payment FAQ](/designing-breach-settlement-foreign-claimant-and-international-payment-ui-in-figma/)
└── Components:
├── [Tables](/figma-tables-and-data-ui-rows-columns-and-handoff/) · zebra optional
├── [Cards](/designing-cards-in-figma-layouts-variants-and-handoff/) · mobile summary
└── [Tooltips](/designing-tooltips-and-popovers-in-figma-placement-and-handoff/) · lien creditor masked name
Portal preview pane: show REMIT-ADV-* above download button; PDF uses same component specs for parity.
Download, redaction, and audit UX
| Control | Purpose | Failure mode |
|---|---|---|
| Step-up auth | Stale session on DL-PROOF-* | Account takeover downloads |
| REDACT-PAY-* | Mask routing except last-4 | Full account leak in PDF |
| HASH-PROOF-* | Integrity footer | Tampered “proof” in disputes |
| LOG-PROOF-* | Who downloaded when | Regulator asks for access proof |
| Rate limit | Bot scraping | Fraud queue |
Pair with audit log patterns and session timeout copy.
Recommended: counsel-approved static disclaimer block— version like privacy notice changelog.
Comparison: proof formats by rail
| Rail | Proof fields | Claimant expectation |
|---|---|---|
| ACH | TRACE last-4 · settlement date | Bank statement match |
| Check | Check # · mail date | Reissue note if void |
| Wire | Reference id · value date | SWIFT copy request |
| Digital wallet | Provider receipt id | App-specific |
Best for: programs needing self-service proof before tax reporting season and court monitor inquiries.
Common mistakes
- PROOF-PAY- before bank settle*— claimants use invalid docs in disputes.
- Amount drift vs portal— missing REMIT-ADV-* single source.
- Full bank account in PDF— REDACT-PAY-* not enforced in template.
- No superseded flow after restatement— two conflicting proofs live.
- Email attachment by default— use portal DL-PROOF-* + NOTIF-PROOF-LINK-* pattern.
Recommended workflow
- Define REMIT-ADV- schema* · align with LINE-PAY-* and tax flags.
- Design PROOF-PAY- template* · PDF + mobile HTML · legal review.
- Gate generation on SETTLED-* from trace matching.
- Add portal download + LOG-PROOF-* · step-up rules.
- Train call center · never email raw bank details.
FAQ
Multiple partial payments per claim?
One PROOF-PAY- per MATCH-LINE-**— list all on portal index with tranche labels.
Returned payment after proof issued?
Mark superseded · issue PROOF-PAY- v2*— link RET-PAY-* in REMIT footnote.
Include full case caption?
Yes for court programs— truncate on mobile with expand pattern from notice FAQ.
Machine-readable export?
Optional JSON— follow data portability consent flags.
Developer handoff?
Document SETTLED- → PROOF-PAY- generator → HASH-PROOF-***— Dev Mode checklist.
Next steps
- Design breach settlement bank confirmation and trace matching UI in Figma — settlement gate
- Design breach settlement claim status portal and claimant dashboard UI in Figma — download placement
- Design breach settlement payment disbursement and payout tracking UI in Figma — ops view of same data
- Design breach settlement tax reporting and 1099 UI in Figma — tax lines on REMIT-ADV-*
- Design data portability and machine-readable export UI in Figma — JSON bundle pattern
§ Keep reading