Vocabulary

Animation Tier and Image Mood — locked enums the portal captures, the source of truth for which motion tier a mockup worker is allowed to use.

Two locked enums pair the Motion system to the client portal. When a client's animation tier or image mood is captured during onboarding, it carries forward into every mockup variant — the motion worker reads the tier to decide which libraries to load and which effects Claude is allowed to generate.

Animation Tier

The animation_tier field captured in the client portal's Visual Direction intel topic. It is a single-select — the client picks exactly one. The tier carries forward from onboarding through design preflight into every mockup variant.

This value is the source of truth for which motion tier a mockup worker is allowed to use. It is imported from content-system/vocabularies/animation-tier.ts and consumed by the portal via company_profiles.animation_tier (migration 00127). Never hardcode these values in consumer code — import ANIMATION_TIER_VALUES from this source.

Values

Value	Motion Tier	What it unlocks
`subtle`	Lightweight	`.fade-up` IntersectionObserver only. No GSAP. No premium effects. Transitions exist but do not call attention to themselves. Appropriate for professional services, law, healthcare contexts where motion confidence is low.
`moderate`	GSAP	Fade-ups, SplitText hero H1, stat counters, hover lifts, CSS animated gradient. Motion is present and intentional but not the lead design element. Appropriate for most service businesses and small practices.
`expressive`	Premium	SplitText, ScrollTrigger parallax, staggered card entrances, Granim.js gradient, Lenis smooth scroll. Motion is a design material, not a finishing coat. Appropriate for clients who reference brands like Daylight Computer or Legend.xyz.

Programmatic access

import {
  ANIMATION_TIER_VALUES,
  type AnimationTier,
  isAnimationTier,
} from '@brikdesigns/bds/content-system';

// The 3 valid values at runtime
console.log(ANIMATION_TIER_VALUES); // ['subtle', 'moderate', 'expressive']

// Type-safe guard
function resolveMotionConfig(tier: string) {
  if (!isAnimationTier(tier)) throw new Error(`Unknown tier: ${tier}`);
  // tier is narrowed to AnimationTier here
}

The portal reads company_profiles.animation_tier (type text, constrained by app-level validation to ANIMATION_TIER_VALUES). The mockup worker's resolveAnimationTierNote() resolver reads this field and decides:

Which CDN libraries to include in the mockup head
Which BDS CSS files to reference
Which effect classes Claude is permitted to generate in the mockup HTML

Drift warning: if the tier values here and the portal's intake form get out of sync, clients pick a value that silently resolves to nothing in the worker. isAnimationTier() is the runtime guard — use it at the API boundary before persisting.

Tier-to-page cross-reference

Each value maps directly to a tier documentation page:

subtle → Lightweight Tier
moderate → GSAP Tier
expressive → Premium Tier

Image Mood

The image_mood field captured in the client portal's Visual Direction intel topic. Multi-select 1–3 — a brand often blends moods (e.g. editorial × clinical for a luxury medical practice, or lifestyle × documentary for real estate). Stored on company_profiles.image_mood (text[], migration 00127).

This vocabulary is distinct from VISUAL_STYLE_VALUES — visual style describes overall aesthetic (typographic, structural), image mood describes how imagery is composed and lit. It is imported from content-system/vocabularies/image-mood.ts and consumed by the portal via client-facts.imageMoods (the field that downstream services read). Never hardcode these values in consumer code — import IMAGE_MOOD_VALUES from this source.

Values

Value	Connotation	Typical fit
`editorial`	Magazine-styled, composed, aspirational	Luxury hospitality, high-end services, design-forward brands
`clinical`	Clean, precise, sterile	Medical, dental, legal, pharmaceutical
`photojournalistic`	Candid, moment-in-time, real events	Editorial publications, event-driven brands, agencies
`lifestyle`	People in context, warm, aspirational daily life	Real estate, wellness, hospitality, consumer brands
`abstract`	Non-representational, textural, artistic	Tech, creative agencies, brands de-emphasizing literal imagery
`documentary`	Unposed, real, environmental portraiture	Nonprofits, healthcare with authenticity focus, MHC/RV / housing

Programmatic access

import {
  IMAGE_MOOD_VALUES,
  type ImageMood,
  isImageMood,
} from '@brikdesigns/bds/content-system';

// The 6 valid values at runtime
console.log(IMAGE_MOOD_VALUES);
// ['editorial', 'clinical', 'photojournalistic', 'lifestyle', 'abstract', 'documentary']

// Type-safe guard
function tagStockAsset(mood: string) {
  if (!isImageMood(mood)) throw new Error(`Unknown mood: ${mood}`);
  // mood is narrowed to ImageMood here
}

The portal reads company_profiles.image_mood (type text[]) and exposes it to:

The mockup generator's image prompts
The stock-asset picker (which photos to source)
The design preflight (image-approach validation)

Drift warning: if the values here and the portal's intake form get out of sync, clients pick a value that silently resolves to nothing in downstream image-direction logic. isImageMood() is the runtime guard — use it at the API boundary before persisting, and at any free-text ingestion point (e.g. stock-asset library tags) before storing.

Mood-to-atmosphere natural pairings

Image mood pairs with atmosphere choice — each atmosphere reinforces a mood without locking it. These are suggestions, not constraints; clients can mix:

Image mood	Natural atmosphere pairing
`editorial`	`editorial-luxury`
`clinical`	`minimal-clinical`
`lifestyle`	`warm-soft`
`documentary`	`clean-bright` or `none`
`photojournalistic`	atmosphere-agnostic (leans `none` or `clean-bright`)
`abstract`	atmosphere-agnostic (often pairs with `cinematic-dramatic` for theatrical brands)

Motion Overview — the three-tier philosophy
Tiers — what each tier ships
Content System — the vocabulary peer to tokens
Atmospheres — image mood pairs with atmosphere choice

Vocabulary

On this page