27 — Content System, Notifications & Error Taxonomy

Banking Experience System (BES) · v2.0.0-draft

<div class="demo-stack" style="max-width:520px">
  <div class="bes-list">
    <div class="bes-notif bes-notif--security">
      <span class="ic"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M8 1.5l5.5 2v4c0 3.2-2.3 5.6-5.5 7-3.2-1.4-5.5-3.8-5.5-7v-4l5.5-2z" stroke="currentColor" stroke-width="1.4" stroke-linejoin="round"/></svg></span>
      <span style="flex:1"><span class="t">New device signed in — Chrome on Windows, Sharjah</span><br><span class="s">Was this you? Review your devices.</span></span>
      <span class="when">11:02</span>
    </div>
    <div class="bes-notif">
      <span class="ic"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M8 2v8m0 0L5 7m3 3l3-3M3 13h10" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/></svg></span>
      <span style="flex:1"><span class="t">Salary received — <bdi class="bes-amount">+AED 18,500.00</bdi></span><br><span class="s">Al Noor Trading LLC · Current account ••4521</span></span>
      <span class="when">09:00</span>
    </div>
  </div>
  <div class="bes-alert bes-alert--error" role="alert">
    <div><b>We couldn't complete this transfer.</b> Your bank declined the transaction. No money was deducted from your account.
    <div class="actions"><a href="#">Try again</a><a href="#">Contact support</a></div></div>
  </div>
  <p style="font-size:13px;color:var(--bes-text-secondary);margin:0">Security notifications are visually distinct from transaction notices and never mix with marketing. Every error answers: what · why · what happened to the money · what next.</p>
</div>

1. Voice

Calm · specific · respectful · bilingual by design. The product speaks like a competent banker who explains clearly and never panics: no exclamation marks in financial contexts, no "Oops!", no jargon leakage, no blame. Arabic register: formal-respectful (فصحى معاصرة), consistent across all surfaces — never machine-translated colloquialism.

2. Terminology glossary (structure + seed entries)

Every term: canonical EN · canonical AR · conventional/Islamic variant flags · avoid-list. One term per concept, everywhere.

The Islamic dimension (doc 06 §3) resolves flagged terms automatically; a conventional string appearing on an Islamic surface is a build-detectable defect.

3. Message frameworks

• Errors (four questions): WHAT happened · WHY (plain class) · what happened to the MONEY · WHAT to do next.
• Confirmations: what happened + the key facts (amount, destination, when) + where the record lives.
• Warnings: the risk pattern (not accusation) + the protective action + the escape ("If unsure, wait — genuine payees will understand").
• Empty states: explain + enable, never blame.
• Buttons: verb + consequence; money-moving CTAs carry the amount.

4. Error taxonomy (normative)

Every error in a BES product maps to exactly one class. Classes define: user message frame · technical state logged · recovery action · CTA · severity · a11y behavior · analytics event. Internal codes never surface (a short human reference code may, for support).

5. Notification system

Categories (semantic + visual separation)

Urgency levels

informational (digestible, batchable) · important (timely, individual) · urgent (time-boxed action: pay-by, respond-by) · critical (immediate: fraud/security — full-screen-capable, bypass quiet hours per user's security setting).

Rules

• Security/fraud notifications are visually + semantically distinct (dedicated styling, no brand-marketing dress) and never batched.
• Marketing never masquerades: no "security-style" urgency on offers; no piggybacking offers onto transaction notices.
• Every notification deep-links to its object (transaction detail, consent card, approval).
• Quiet hours honored except critical; digest option for informational.
• Notification center in-app mirrors push history (nothing exists only as an ephemeral push), filterable by category.

6. Writing for bilingual parity

Source strings are written EN + AR together at design time (content design is bilingual, not translate-later); placeholders are position-independent ({amount} orders differ per language); pluralization uses proper Arabic plural categories (zero/one/two/few/many/other); dates/numbers formatted by locale library, never string-built; text expansion budget: Arabic ±25% and German-length safety for future locales — layouts tested at both extremes.