{
  "id": "deck:scroll-motion-linked",
  "slug": "scroll-motion-linked",
  "title": {
    "ja": "スクロールに連動する動き 09–16 — 進めた分だけ進む演出",
    "en": "Scroll-linked 09–16 — Effects That Advance as Far as You Scroll"
  },
  "summary": {
    "ja": "読了バーからマーキーまで 8 種。時間ではなくスクロール量で進むので、止めれば止まり、戻せば戻る",
    "en": "Eight effects from the progress bar to the marquee. They run on scroll distance rather than time: stop and they stop, go back and they rewind"
  },
  "count": 8,
  "slides": [
    {
      "position": 1,
      "slug": "motion-scroll-linked",
      "kind": "motion",
      "title": {
        "ja": "スクロール連動",
        "en": "Scroll-linked animation"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-scroll-linked",
        "en": "https://design-vault.pages.dev/en/designs/motion-scroll-linked",
        "json": "https://design-vault.pages.dev/ai/assets/motion-scroll-linked.json",
        "designJson": null
      },
      "reproduction": null
    },
    {
      "position": 2,
      "slug": "motion-parallax",
      "kind": "motion",
      "title": {
        "ja": "パララックス",
        "en": "Parallax scrolling"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-parallax",
        "en": "https://design-vault.pages.dev/en/designs/motion-parallax",
        "json": "https://design-vault.pages.dev/ai/assets/motion-parallax.json",
        "designJson": null
      },
      "reproduction": null
    },
    {
      "position": 3,
      "slug": "motion-scroll-zoom",
      "kind": "motion",
      "title": {
        "ja": "スクロールズーム",
        "en": "Scale on scroll"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-scroll-zoom",
        "en": "https://design-vault.pages.dev/en/designs/motion-scroll-zoom",
        "json": "https://design-vault.pages.dev/ai/assets/motion-scroll-zoom.json",
        "designJson": null
      },
      "reproduction": null
    },
    {
      "position": 4,
      "slug": "motion-image-sequence",
      "kind": "motion",
      "title": {
        "ja": "画像シーケンス",
        "en": "Scroll-scrubbed image sequence"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-image-sequence",
        "en": "https://design-vault.pages.dev/en/designs/motion-image-sequence",
        "json": "https://design-vault.pages.dev/ai/assets/motion-image-sequence.json",
        "designJson": null
      },
      "reproduction": null
    },
    {
      "position": 5,
      "slug": "motion-svg-line-draw",
      "kind": "motion",
      "title": {
        "ja": "SVGラインドロー",
        "en": "SVG line drawing"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-svg-line-draw",
        "en": "https://design-vault.pages.dev/en/designs/motion-svg-line-draw",
        "json": "https://design-vault.pages.dev/ai/assets/motion-svg-line-draw.json",
        "designJson": null
      },
      "reproduction": null
    },
    {
      "position": 6,
      "slug": "motion-text-fill",
      "kind": "motion",
      "title": {
        "ja": "テキストフィル",
        "en": "Text fill on scroll"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-text-fill",
        "en": "https://design-vault.pages.dev/en/designs/motion-text-fill",
        "json": "https://design-vault.pages.dev/ai/assets/motion-text-fill.json",
        "designJson": null
      },
      "reproduction": null
    },
    {
      "position": 7,
      "slug": "motion-bg-color-transition",
      "kind": "motion",
      "title": {
        "ja": "背景色トランジション",
        "en": "Background color transition"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-bg-color-transition",
        "en": "https://design-vault.pages.dev/en/designs/motion-bg-color-transition",
        "json": "https://design-vault.pages.dev/ai/assets/motion-bg-color-transition.json",
        "designJson": null
      },
      "reproduction": null
    },
    {
      "position": 8,
      "slug": "motion-marquee",
      "kind": "motion",
      "title": {
        "ja": "マーキー",
        "en": "Marquee (scroll velocity)"
      },
      "useCase": null,
      "role": null,
      "urls": {
        "ja": "https://design-vault.pages.dev/designs/motion-marquee",
        "en": "https://design-vault.pages.dev/en/designs/motion-marquee",
        "json": "https://design-vault.pages.dev/ai/assets/motion-marquee.json",
        "designJson": null
      },
      "reproduction": null
    }
  ],
  "urls": {
    "ja": "https://design-vault.pages.dev/decks/scroll-motion-linked",
    "en": "https://design-vault.pages.dev/en/decks/scroll-motion-linked",
    "json": "https://design-vault.pages.dev/ai/decks/scroll-motion-linked.json"
  },
  "catalogVersion": 1,
  "designSchemaVersion": 2,
  "notesMarkdown": ""
}