---
id: ux-patterns-index
class: b2
sourced: 2026-07-12
source: "b2b-ux-patterns playbook (16 chapters) — distilled"
license: open
---
# B2 — the B2B UX-pattern decision layer

What-to-use-when for every structural UI decision, distilled from the ratified 16-chapter B2B UX playbook. **One decision file per pass**, each carrying its rule twice in one body: prose for the model, then an embedded machine-readable `json decision-table` that is the executable core — the contract runner ([`../../../../evals/design/run-decision-contracts.mjs`](../../../../evals/design/run-decision-contracts.mjs)) parses and evaluates these tables directly, so the tested rule and the followed rule are the same bytes.

The pinned **seven-archetype roster** every pass conforms to: `browse`, `queue`, `grid`, `record-detail`, `dashboard`, `creation-flow`, `settings`. View-types (table, board, cards, calendar, timeline, map) are **projections** of an archetype, never archetypes themselves.

## The 15 passes

Run each at the step of the method that needs it — the order below is the method's order.

| # | Pass | Source | Owns |
| --- | --- | --- | --- |
| 1 | [object-model](object-model.md) | ch.1 | `requiredMechanics`, `clarifications` |
| 2 | [attributes-lifecycle](attributes-lifecycle.md) | ch.2 | `requiredMechanics`, `requiredStates`, `clarifications` |
| 3 | [verbs](verbs.md) | ch.3 | `requiredMechanics`, `requiredStates`, `containers`, `clarifications` |
| 4 | [viewer-context](viewer-context.md) | ch.4 | `requiredMechanics`, `clarifications` |
| 5 | [modes](modes.md) | ch.5 | `archetypes`, `requiredMechanics` |
| 6 | [promotion-demotion](promotion-demotion.md) | ch.6 | `requiredMechanics`, `clarifications` |
| 7 | [page-archetype](page-archetype.md) | ch.7 | `archetypes`, `requiredMechanics`, `requiredStates`, `clarifications` |
| 8 | [container-choice](container-choice.md) | ch.8 | `containers`, `requiredMechanics`, `clarifications` |
| 9 | [creation-paths](creation-paths.md) | ch.9 | `creationPaths`, `requiredMechanics`, `clarifications` |
| 10 | [table-mechanics](table-mechanics.md) | ch.10 | `requiredMechanics`, `clarifications` |
| 11 | [state-matrix](state-matrix.md) | ch.11 | `requiredStates`, `requiredMechanics`, `clarifications` |
| 12 | [standard-pages](standard-pages.md) | ch.12 | `archetypes`, `requiredMechanics`, `clarifications` |
| 13 | [ai-layer](ai-layer.md) | ch.13 | `archetypes`, `requiredStates`, `requiredMechanics`, `clarifications` |
| 14 | [dashboards](dashboards.md) | ch.15 | `archetypes`, `requiredStates`, `requiredMechanics`, `clarifications` |
| 15 | [settings](settings.md) | ch.16 | `archetypes`, `requiredStates`, `requiredMechanics`, `clarifications` |

(Playbook chapter 14 — the agentic pattern catalog — is consideration material behind pass 13, not a pass of its own.)

## The decision-table contract

Every pass file ends with one fenced `json decision-table` block: `{"pass": "<id>", "rows": [{"when": {...}, "then": {...}, "reason": "<kebab-code>"}]}`.

**Matching semantics (canonical).** A row matches when **every** key in its `when` matches the input: a literal value matches by equality, an array value matches by membership (input ∈ array), and `"__absent__"` matches when the key is missing or null. The engine unions the `then` of every matched row.

**`then` fields.** `archetypes` / `containers` / `creationPaths` / `requiredStates` / `requiredMechanics` each take `{"mustInclude": [...], "mustNotInclude": [...]}` (`containers` may use `"acceptable"` / `"forbidden"`); `clarifications` takes a flat list of missing-input codes.

## Shared input vocabulary

Every `when` key used across the 15 passes, with its legal values. **Any key may also be `"__absent__"`** (the input omits it) — that is how clarification rows fire. Boolean keys take `true` / `false`.

| Key | Legal values | Used by |
| --- | --- | --- |
| `relationshipCardinality` | one-to-one · one-to-few · one-to-many · many-to-many | object-model |
| `childHasOwnLifecycle` | boolean | object-model |
| `childMeaningfulAlone` | boolean | object-model |
| `editedAtomicallyWithParent` | boolean | object-model |
| `associationHasPayload` | boolean | object-model |
| `glanceContextNeeded` | boolean | object-model |
| `collaboration` | concurrent · single-writer | object-model, viewer-context, page-archetype |
| `historySignal` | none · trajectory · compliance · derived-high-frequency | attributes-lifecycle |
| `disputeLikely` | boolean | attributes-lifecycle |
| `fieldOrigin` | manual · computed · synced · imported · ai-generated | attributes-lifecycle |
| `objectHasLifecycle` | boolean | attributes-lifecycle |
| `transitionRequirements` | boolean | attributes-lifecycle |
| `timeProperty` | sla · due-escalation · recurrence · snooze · none | attributes-lifecycle |
| `endOfLife` | reference-after-completion · user-data-deletion · compliance-erasure | attributes-lifecycle |
| `multipleEntryPoints` | boolean | attributes-lifecycle |
| `verbKind` | transition · edit · association · collaboration · communication · conversion · break-glass · approval-gated | verbs |
| `reversible` | boolean | verbs, ai-layer |
| `outwardFacing` | boolean | verbs, ai-layer |
| `bulk` | boolean | verbs |
| `thresholdVariant` | boolean | verbs |
| `denialKind` | role · plan | viewer-context |
| `entitlementKind` | boolean · metered | viewer-context |
| `fieldLevelSecurity` | boolean | viewer-context |
| `requiredFieldHidden` | boolean | viewer-context |
| `existenceLeakRisk` | boolean | viewer-context |
| `viewerKind` | human · agent | viewer-context |
| `concurrentViewers` | boolean | viewer-context |
| `environmentSeparation` | boolean | viewer-context |
| `mode` | monitoring · triage · procedural · exception · approval · investigation · exploration · authoring · reconciliation · comparison · batch-mutation · configuration · collaboration · reporting · learning · supervision | modes |
| `sameDataMultipleModes` | boolean | modes |
| `frequency` | high · medium · low | promotion-demotion |
| `isParent` | boolean | promotion-demotion |
| `demotionContractMet` | boolean | promotion-demotion |
| `perRoleVariance` | boolean | promotion-demotion |
| `primaryJob` | lookup · triage · process · edit-bulk · monitor · narrate-period · route-work · author · configure · approve · investigate · explore · reconcile | page-archetype |
| `ordering` | priority · sla · age · user-controlled · none | page-archetype |
| `ownership` | claimable · assigned · individual · shared | page-archetype |
| `viewTypeRequested` | table · board · cards · calendar · timeline · map | page-archetype |
| `hasStatusField` | boolean | page-archetype, table-mechanics |
| `hasDateField` | boolean | page-archetype |
| `unitOfWork` | record · machine-proposal · thread | page-archetype |
| `structuralChangeAllowed` | boolean | page-archetype |
| `existingArchetype` | browse · queue · grid · record-detail · dashboard · creation-flow · settings | page-archetype |
| `opensRecord` | boolean | container-choice |
| `contextRetentionNeeded` | boolean | container-choice |
| `interactionDepth` | quick-read · deep-edit | container-choice |
| `sharing` | stable-url · sent-outward · none | container-choice |
| `traversal` | boolean | container-choice |
| `interruption` | interrupt · continue | container-choice |
| `contentSize` | small · large | container-choice |
| `recordReference` | boolean | container-choice |
| `opensInOverlay` | boolean | container-choice |
| `isDetailSurface` | boolean | container-choice |
| `detailBody` | large-independent · modest-cross-skim | container-choice |
| `longSessionStream` | boolean | container-choice |
| `customerFacingComposer` | boolean | container-choice |
| `manualCreate` | boolean | creation-paths |
| `bulkOnboarding` | boolean | creation-paths |
| `bornFromTransformation` | boolean | creation-paths |
| `bornFromTemplate` | boolean | creation-paths |
| `recurs` | boolean | creation-paths |
| `externalSourceOfTruth` | boolean | creation-paths |
| `creationFrequency` | high · low | creation-paths |
| `fieldCount` | few · many | creation-paths |
| `interdependentFields` | boolean | creation-paths |
| `bornComplete` | boolean | creation-paths |
| `sequentialDependencies` | boolean | creation-paths |
| `isGridPrimaryWrite` | boolean | creation-paths |
| `requiredRelationMayBeMissing` | boolean | creation-paths |
| `duplicateProneCreate` | boolean | creation-paths |
| `serverTruthValidation` | boolean | creation-paths |
| `editRegime` | inline · explicit-mode · canvas | creation-paths |
| `concurrentEditors` | boolean | creation-paths |
| `isConfigObject` | boolean | creation-paths |
| `revisitedWithIntent` | boolean | table-mechanics |
| `sharedViewScope` | personal · team | table-mechanics |
| `wideObject` | boolean | table-mechanics |
| `heavyDailyUse` | boolean | table-mechanics |
| `groupBySegment` | boolean | table-mechanics |
| `crossCuttingHealthNumbers` | boolean | table-mechanics |
| `gridEditable` | boolean | table-mechanics |
| `bulkVerbs` | boolean | table-mechanics |
| `rowActions` | boolean | table-mechanics |
| `viewerRelationships` | boolean | table-mechanics |
| `largeDataset` | boolean | table-mechanics |
| `listLength` | paginated · infinite · virtualized | table-mechanics |
| `financialRecordKeeping` | boolean | table-mechanics |
| `sharedMutableList` | boolean | table-mechanics |
| `exportNeeded` | boolean | table-mechanics |
| `isListSurface` | boolean | state-matrix |
| `dataFetch` | boolean | state-matrix |
| `fetchLatency` | boolean | state-matrix |
| `compositePage` | boolean | state-matrix |
| `consumesCachedData` | boolean | state-matrix |
| `streamingView` | boolean | state-matrix |
| `optimisticMutation` | boolean | state-matrix |
| `queueSuccessIsEmpty` | boolean | state-matrix |
| `firstRunSurface` | boolean | state-matrix |
| `onboardingTechnique` | boolean | state-matrix |
| `onboardingScope` | application-level · empty-state | state-matrix |
| `standardPage` | settings · profile · notifications · audit-object · audit-global · user-management · roles-permissions · seats-licenses · billing · integrations | standard-pages |
| `notificationDelivery` | boolean | standard-pages |
| `ssoScimProvisioning` | boolean | standard-pages |
| `complianceBuyer` | boolean | standard-pages |
| `recordLevelAccess` | boolean | standard-pages |
| `externalSystemMapping` | boolean | standard-pages |
| `intelligenceTime` | build-time · run-time | ai-layer |
| `aiWrites` | boolean | ai-layer |
| `blastRadius` | single-record · many-records · external-fanout | ai-layer |
| `initiative` | invoked · suggested · initiated | ai-layer |
| `latency` | live · just-in-time · per-row · scheduled · ambient | ai-layer |
| `confidenceGateable` | boolean | ai-layer |
| `correctsHumanOrThirdParty` | boolean | ai-layer |
| `autonomousAgent` | boolean | ai-layer |
| `agentPrincipal` | boolean | ai-layer |
| `durableWait` | boolean | ai-layer |
| `copilotOutput` | inspectable-reversible · externally-committing | ai-layer |
| `accumulatedMemory` | boolean | ai-layer |
| `inputBoundaryTransduction` | boolean | ai-layer |
| `dashboardJob` | monitoring · narrative · work-router | dashboards |
| `multiJobCanvas` | boolean | dashboards |
| `cachedDecisionData` | boolean | dashboards |
| `viewerScopedMetrics` | boolean | dashboards |
| `promotionRole` | manager · operator | dashboards |
| `pushDigest` | boolean | dashboards |
| `tile` | boolean | dashboards |
| `monitoringTile` | boolean | dashboards |
| `thresholdDeclared` | boolean | dashboards |
| `trendTileRequested` | boolean | dashboards |
| `sourceHistoryClass` | overwrite · sampled · logged | dashboards |
| `isSettingsPage` | boolean | settings |
| `scope` | personal · workspace · org | settings |
| `settingKind` | leaf-preference · config-object | settings |
| `riskClass` | preference · behavior-config · structural-destructive | settings |
| `subject` | identity-access · data-model · automation · notifications · integrations · branding · billing · compliance-audit · ai-agent-policy | settings |
| `multiScopeSetting` | boolean | settings |
| `nodeCount` | under-30 · over-30 | settings |
| `governedSurfaceLink` | boolean | settings |
| `buildTimeGeneration` | boolean | settings |
| `productSurfaceInTree` | boolean | settings |

## The load rule

**One pass file per step, never all at once.** The load contract ([09 §Load contracts](../../../../docs/features/design-skill/09-database-structures.md)) is explicit: B2 enters context as *the one pass file the current step needs*; loading all passes at once is forbidden. Consult this Readme to route to the right file, then load only that file at the step that needs it. Clarification codes are surfaced, never guessed around — a `then.clarifications` firing means an input the pass needs is missing, and the step pauses to obtain it rather than proceeding on a default.
