{
  "site": "https://mecha-xyz.webflow.io/",
  "host": "mecha-xyz.webflow.io",
  "analyzedAt": "2026-09-03",
  "stats": { "pages": 2, "candidates": 9, "distilled": 7 },
  "patterns": [
    {
      "slug": "01-overscroll-footer-reveal",
      "number": "01",
      "name": "Overscroll footer reveal",
      "categories": ["scroll", "motion", "microinteraction"],
      "description": "At the scroll limit, further wheel deltas become pressure that lifts the whole page off a fixed footer, then drops it back on a different curve.",
      "trigger": "wheel at scroll limit",
      "difficulty": "Medium",
      "fidelity": "high",
      "score": 4.8,
      "scores": { "visual": 5, "originality": 5, "reusability": 4, "interest": 5, "difficulty": 3 },
      "source": "https://mecha-xyz.webflow.io/",
      "needsNetwork": false
    },
    {
      "slug": "02-push-cover-page-transition",
      "number": "02",
      "name": "Push-and-cover page transition",
      "categories": ["page-transition", "navigation", "motion"],
      "description": "The outgoing page is pushed upward while a panel in the destination's own colour rises over it; the swap happens under cover and the new page arrives from the same offset.",
      "trigger": "click",
      "difficulty": "Medium",
      "fidelity": "high",
      "score": 4.5,
      "scores": { "visual": 5, "originality": 4, "reusability": 4, "interest": 5, "difficulty": 3 },
      "source": "https://mecha-xyz.webflow.io/",
      "needsNetwork": false
    },
    {
      "slug": "03-section-progress-nav",
      "number": "03",
      "name": "Section progress navigation",
      "categories": ["navigation", "scroll", "motion"],
      "description": "A side nav generated from the page's own sections, each item carrying a progress line scrubbed across that section's range, anchored to the viewport centre.",
      "trigger": "scroll",
      "difficulty": "Medium",
      "fidelity": "high",
      "score": 4.4,
      "scores": { "visual": 4, "originality": 4, "reusability": 5, "interest": 5, "difficulty": 3 },
      "source": "https://mecha-xyz.webflow.io/",
      "needsNetwork": false
    },
    {
      "slug": "04-reversible-line-mask",
      "number": "04",
      "name": "Reversible line mask reveal",
      "categories": ["typography", "scroll", "motion"],
      "description": "Per-line clip-path masks that open at the bottom for descenders, with an authored exit at 0.6x duration, different easing and reversed stagger.",
      "trigger": "scroll",
      "difficulty": "Medium",
      "fidelity": "high",
      "score": 4.2,
      "scores": { "visual": 4, "originality": 4, "reusability": 5, "interest": 4, "difficulty": 2 },
      "source": "https://mecha-xyz.webflow.io/",
      "needsNetwork": false
    },
    {
      "slug": "05-drag-spring-3d",
      "number": "05",
      "name": "Drag-spring 3D object",
      "categories": ["3d", "webgl", "scroll", "motion"],
      "description": "Scroll scrubs a base rotation while dragging adds a clamped tilt integrated by a real spring; orthographic frustum rebuilt from container aspect.",
      "trigger": "drag + scroll",
      "difficulty": "Hard",
      "fidelity": "approximate",
      "score": 4.2,
      "scores": { "visual": 5, "originality": 4, "reusability": 3, "interest": 5, "difficulty": 5 },
      "source": "https://mecha-xyz.webflow.io/",
      "needsNetwork": true
    },
    {
      "slug": "06-three-state-spring-cursor",
      "number": "06",
      "name": "Three-state spring cursor",
      "categories": ["cursor", "microinteraction", "motion"],
      "description": "Three cursor heads sharing one lerped position, transformed from the viewport centre and crossfaded by delegated hover state.",
      "trigger": "pointer-move",
      "difficulty": "Easy",
      "fidelity": "high",
      "score": 4.0,
      "scores": { "visual": 4, "originality": 4, "reusability": 4, "interest": 4, "difficulty": 2 },
      "source": "https://mecha-xyz.webflow.io/",
      "needsNetwork": false
    },
    {
      "slug": "07-gated-preloader",
      "number": "07",
      "name": "Gated preloader",
      "categories": ["loading", "motion", "microinteraction"],
      "description": "Three independent readiness gates converge on one exit; the looping mark always finishes its current cycle, and a session flag picks full or short intro.",
      "trigger": "page-load",
      "difficulty": "Medium",
      "fidelity": "high",
      "score": 3.7,
      "scores": { "visual": 4, "originality": 3, "reusability": 4, "interest": 4, "difficulty": 3 },
      "source": "https://mecha-xyz.webflow.io/",
      "needsNetwork": false
    }
  ]
}
