Animated diagram demo

Two examples show traffic flowing through a static architecture and a controlled pod-scaling scenario. Compare repeatable SVG motion with JavaScript/CSS state transitions.

Live example

VPC traffic flow with a filterable legendOpen in a new tab ↗

Example workflow: Create SVG traffic paths with SMIL animation and a legend filter.

EKS pod scaling with scale-out and scale-in controlsOpen in a new tab ↗

Example workflow: Create an EKS pod-scaling state machine with JavaScript and CSS.

What to inspect

Exercise start/reset controls and observe how traffic, replicas, labels, and legends change. SMIL suits repeated flow; a state machine suits interactive scaling, deployment, and failover. The frozen output illustrates those choices; use current canonical tokens for new diagrams.

Embedded HTML, downloadable sources, and screenshots are frozen example artifacts. Their original language is preserved; these guides explain how to interpret them.

Screenshots