DEDUPED Hot AI repos, turned into use cases Get the Monday 5

What you can do with Awesome HTML Scrolline Deck

Scrolline is a JavaScript toolkit for building scroll-driven presentation decks, where you describe beats in a deck.yaml file and the same timeline plays in the browser or exports to MP4.

Trended earlier

gongnyang/awesome-html-scrolline-deck on GitHub

Third-party repos we don't own or vouch for. AI-generated use cases can be wrong: review everything and run at your own risk.

What do you want to do?

5 use cases

  • Build a scroll-driven deck from a concept in one afternoon

    Start a deck from a concept pack, write beats in deck.yaml, and preview it in the browser.

    View prompt
    In the awesome-html-scrolline-deck repo, check out branch v2, run npm install, then create a deck named <deck-name> with `npm run deck -- new <deck-name> --concept data` and write its beats in decks/<deck-name>/deck.yaml from <source-brief>. Run `npm run deck -- plan <deck-name>` and report the stops and timings it prints. Verify that the plan command finishes without errors before you stop.

  • Export a finished deck to an MP4 video

    Render a deck's paused timeline to a 1920x1080 MP4 for sharing without a browser.

    View prompt
    In the awesome-html-scrolline-deck repo on branch v2, run `npm run export -- <deck-id> --dry-run` to print the timeline map, then run `npm run export -- <deck-id>` to render the MP4. Report the path of the output file, which should be out/export/<deck-id>.mp4. Verify that the file exists and that its resolution is 1920x1080 as the README describes.

  • Save one PNG per deck stop for a visual review

    Capture each stop of a deck as a PNG so a team can review every frame without scrolling.

    View prompt
    In the awesome-html-scrolline-deck repo on branch v2, run `npm run capture -- <deck-id> --stops` and list the PNG files written to out/capture/<deck-id>/. Verify that the number of PNG files equals the number of stops that `npm run deck -- plan <deck-id>` reports.

  • Let Claude Code build a deck from a brief

    Install the repo as a Claude Code skill so an agent can go from a brief to a deck and an MP4.

    View prompt
    Use the scrolline-deck skill in the awesome-html-scrolline-deck repo to turn <brief-file> into a deck named <deck-id>. Choose a concept, write decks/<deck-id>/deck.yaml, run `npm run deck -- plan <deck-id>`, then `npm run export -- <deck-id>`. Report the concept you chose and the path of the MP4, and verify that out/export/<deck-id>.mp4 exists.

  • Add stock video to a deck beat with your own API key

    Put Pexels or Pixabay footage into a beat that scrubs with scroll or plays in place.

    View prompt
    In the awesome-html-scrolline-deck repo, add a video beat to decks/<deck-id>/deck.yaml using <clip-file> and mode scrub. Confirm that the API key is stored only in .env. Run `npm run check` and report whether it passes.

How to use Awesome HTML Scrolline Deck

  1. Check you have what it needs: Node.js 22 or newer; git; ffmpeg, only if you cut frame sequences for scrubbed video.
  2. Open gongnyang/awesome-html-scrolline-deck on GitHub and read the README and license.
  3. git clone https://github.com/gongnyang/awesome-html-scrolline-deck.git
  4. cd awesome-html-scrolline-deck
  5. git checkout v2
  6. npm install

These steps come from our top use case, Build a scroll-driven deck from a concept in one afternoon, which also has a copy-paste agent prompt.

Awesome HTML Scrolline Deck alternatives · Best AI repos for Content

About this repo

Requirements

  • Node.js 22 or newer
  • git
  • ffmpeg, only if you cut frame sequences for scrubbed video
  • A Pexels or Pixabay API key in .env, only if you add stock video

Add this badge to your README

Maintain Awesome HTML Scrolline Deck? Show readers where to find these use cases. Use cases on Deduped

Markdown 

[![Use cases on Deduped](https://dedupedai.com/badge/gongnyang/awesome-html-scrolline-deck.svg)](https://dedupedai.com/use-cases/gongnyang-awesome-html-scrolline-deck/?utm_source=github&utm_medium=badge&utm_campaign=gongnyang-awesome-html-scrolline-deck)

HTML 

<a href="https://dedupedai.com/use-cases/gongnyang-awesome-html-scrolline-deck/?utm_source=github&amp;utm_medium=badge&amp;utm_campaign=gongnyang-awesome-html-scrolline-deck"><img src="https://dedupedai.com/badge/gongnyang/awesome-html-scrolline-deck.svg" alt="Use cases on Deduped" height="20"></a>

A static image, no tracking script. About the badge

Questions about Awesome HTML Scrolline Deck

What is Awesome HTML Scrolline Deck?

Scrolline is a JavaScript toolkit for building scroll-driven presentation decks, where you describe beats in a deck.yaml file and the same timeline plays in the browser or exports to MP4. It is an open-source project on GitHub: https://github.com/gongnyang/awesome-html-scrolline-deck.

Who is Awesome HTML Scrolline Deck for?

Presenters, analysts and teams who want a scroll-based deck with presenter keys and an MP4 copy, and developers or AI agents who build those decks.

What can I do with Awesome HTML Scrolline Deck?

5 use cases so far, for example: Build a scroll-driven deck from a concept in one afternoon; Export a finished deck to an MP4 video; Save one PNG per deck stop for a visual review. Each has steps and a copy-paste agent prompt.

What do I need to run Awesome HTML Scrolline Deck?

Node.js 22 or newer; git; ffmpeg, only if you cut frame sequences for scrubbed video; A Pexels or Pixabay API key in .env, only if you add stock video.

What are alternatives to Awesome HTML Scrolline Deck?

Other hot AI repos in Content: Hermes Speech, Wonder Pill, Comfy UI Mini Max H3 Image Studio, GPT Image 2 5 Prompt Atlas, Genart Skill.

Is Awesome HTML Scrolline Deck safe to run?

Deduped does not own, audit or vouch for it. Read the README and license, run it on your own systems first and review every command before you run it.