---
id: portfolio.ds.portfolio-evidence-animation
name: "Portfolio Evidence Animation"
type: pattern
status: active
relations: []
sources: ["apps/portfolio-site/src/design-system/docs/portfolio-evidence-animation.astro","apps/portfolio-site/src/lib/designSystemRegistry.ts","packages/design-system/src/components/PortfolioEvidenceAnimation.astro","packages/design-system/src/components/PortfolioEvidenceVideoAnimation.astro","packages/design-system/src/components/ProjectVisual.astro","packages/design-system/src/components/animations/PortfolioEvidenceAnimation.astro"]
catalog: ["apps/portfolio-site/src/design-system/docs/portfolio-evidence-animation.astro"]
previews: ["apps/portfolio-site/src/design-system/docs/portfolio-evidence-animation.astro"]
---
# Portfolio Evidence Animation

## Purpose
Realtime SVG scene for the Portfolio project. It shows scattered private artifacts moving through a central evidence index and resolving into public pages and machine-readable context.

The animation is intentionally an evidence pipeline rather than a website mockup. It explains what the Portfolio does: turns approved project work into inspectable public surfaces.

## Use
- Rendering the Post-AI Systems project card, header, or related-project item.
- A visual needs to communicate publication, traceability, indexing, and several public views derived from the same source.

## Contract
- Keep the visual key `portfolio-evidence` mapped through `Portfolio Evidence Video Animation`.
- Keep this realtime SVG as the source of truth and runtime fallback.
- Preserve the left-to-right relationship: source artifacts, central index, public surfaces.
- Keep the central index visible in mobile and narrow crops.
- Do not place titles, labels, or project copy inside the SVG.
- Keep color accents functional: blue for incoming evidence, yellow for published flow, green for the evidence index and available context, and pink for public-surface variation.
- Respect `prefers-reduced-motion` by showing a complete static scene and hiding moving packets.

## Current Usage

- Source/fallback child of Portfolio Evidence Video Animation.
- Design System source component preview.

## Code Paths

- `packages/design-system/src/components/PortfolioEvidenceAnimation.astro`
- `packages/design-system/src/components/animations/PortfolioEvidenceAnimation.astro`
- `packages/design-system/src/components/PortfolioEvidenceVideoAnimation.astro`
- `packages/design-system/src/components/ProjectVisual.astro`
- `apps/portfolio-site/src/lib/projects.ts`

## Do Not Use

Do not use outside the documented source, composition, or ownership contract without Design System Architect review.

## Accessibility

Preserve applicable accessibility behavior of the implementation and verify changes in actual usage.

## Verification

- Confirm every source path in frontmatter resolves to current implementation or documentation.
- Run `scripts/design-system-graph --check --no-write`.
- Verify actual usage and documented Preview against the enabled package profiles before completion.