THE LAST SCROLL - Project Story

Inspiration

The prompt hit different: "What would you ship if the internet was ending tomorrow?"

I started thinking about all the things we've lost already—Flash games that raised a generation, forum communities that felt like home, MySpace profiles that were our first attempts at self-expression. The internet isn't permanent. It's fragile. Platforms die. Servers shut down. Links rot.

And then it hit me: What if I could make people feel that loss? What if scrolling through internet history became a meditation on digital mortality?

I wanted to create something that hurt in the right way. Not shocking or traumatic, but bittersweet. Like finding old photos and realizing you can't remember everyone in them. That ache of "I should have saved this when I had the chance."

This is a love letter to everything we've already lost online, and everything we're going to lose.

What it does

THE LAST SCROLL is an interactive experience where users scroll through fragments of internet history—old tweets, forum posts, early YouTube comments, forgotten memes—but everything is corrupting in real-time.

As you scroll:

  • Text gradually gets replaced with corruption blocks
  • Images pixelate and glitch
  • Colors desaturate
  • The whole feed gets slower and more broken
  • A corruption meter at the top shows the internet dying: "Internet Integrity: 67%"

Users can "save" memories to a personal vault, but here's the cruel twist: you only get 15-20 saves. There are hundreds of memories. You will run out.

Eventually, everything you didn't save is lost forever. The end screen shows your vault and the brutal statistics: "You saved 12 memories. 10,847 were lost forever."

It's digital triage. It's the weight of impossible choices. It's watching history die and deciding what deserves to survive.

How we built it

Tech Stack:

  • Pure HTML/CSS/JavaScript (vanilla—no frameworks to slow me down)
  • Hardcoded JSON array of ~200 nostalgic internet memories
  • CSS filters and animations for glitch effects
  • Deployed on Vercel for instant hosting

The Build Process:

Phase 1 - The Scroll (Hours 1-12): I started with a basic infinite scroll and loaded fake memories. Each memory is an object with content, author, year, and a corruption level. I intentionally degraded performance using increasing setTimeout delays and CSS animation stutters.

Phase 2 - The Decay System (Hours 13-24): This was the heart of the project. I built a corruption engine that runs on setInterval(). Every tick:

  • Increases each memory's corruption level
  • Applies visual effects based on corruption percentage
  • Replaces random characters in text with blocks
  • Adds CSS filters (blur, grayscale, pixelation) to images
  • Items at 100% corruption fade to complete black

The corruption accelerates over time—the apocalypse speeds up.

Phase 3 - The Choice (Hours 25-36): Added save buttons with a hard limit. Saved items get frozen in time and moved to a vault. The counter shows remaining saves, creating constant anxiety. I used localStorage to persist the vault, but you can only view it at the end.

Phase 4 - The Gut Punch (Hours 37-48): Built the end screen with statistics and emotional copy. Added polish: smooth transitions, haunting typography, a final message about digital impermanence. Tested on multiple devices.

Challenges we ran into

The Text Corruption Algorithm: Making text corruption look realistic was HARD. Random character replacement looked chaotic, not apocalyptic. I had to create weighted corruption—spaces and punctuation corrupt first, then vowels, then consonants. It creates a more "degrading document" feel.

Performance vs. Aesthetics: I wanted the page to feel broken, but not actually be broken. Finding the balance between intentional lag and unusable lag took a lot of tweaking. Too slow = frustrating. Too smooth = doesn't feel apocalyptic.

Emotional Pacing: The corruption had to feel urgent but not rushed. Too fast and users panic and disengage. Too slow and they get bored. I added acceleration curves so it starts subtle and becomes desperate.

Content Creation: Writing 200 fake internet memories that felt authentic was harder than coding. Each one needed to hit a specific emotional note—nostalgic, bittersweet, funny, or profound. I spent hours crafting memories that would make people feel something real.

The Save Limit: Deciding how many saves to give was brutal. Too many = no tension. Too few = frustrating. I settled on ~15-20 based on testing, creating that perfect "I have to choose" anxiety.

Accomplishments that we're proud of

It Makes People Feel Things: This isn't just a tech demo. It's an emotional experience. Every decision was made to create discomfort, nostalgia, and weight. The glitches aren't just aesthetic—they're narrative tools.

The Corruption Engine: I built a system where visual decay is tied to multiple factors: time, scroll speed, viewport distance. It feels organic, not algorithmic. Every corruption pattern is slightly different.

Shipping in 48 Hours Solo: From concept to deployment in one weekend, alone, with sleep. I'm proud of the discipline to cut scope ruthlessly and focus on the core experience.

The End Screen Statistics: "You saved 12 memories. 10,847 were lost forever." This one line does more emotional work than paragraphs of explanation. Numbers tell the story of loss better than words.

It's Beautifully Broken: Every bug became a feature. Lag is intentional. Glitches are designed. The discomfort is the point. I turned technical limitations into aesthetic choices.

What we learned

Emotion Over Perfection: In 48 hours, you don't have time for perfect code. You have time for feeling. I learned to prioritize what makes people feel something over what's technically impressive.

Constraints Are Creative Fuel: Limited saves, no backend, solo build—every constraint forced better decisions. The 15-save limit creates more tension than unlimited saves ever could.

Glitch Aesthetics Are Hard: Making things look intentionally broken (not actually broken) is an art form. CSS filters, timing functions, and careful corruption algorithms are the difference between "cool glitch" and "is this a bug?"

Content Is King: The code is invisible. Users remember the memories they saved. I learned that writing 200 emotional internet fragments was more important than any algorithm.

Pacing Matters: The acceleration curve of corruption is everything. Start subtle (comfort), build slowly (unease), then accelerate (panic). It's storytelling through decay.

Dark Themes Hit Different: There's something powerful about building for the void instead of the light. Apocalyptic themes give permission to be weird, uncomfortable, and real.

What's next for THE LAST SCROLL

Immediate Future:

  • Add ambient sound design (low drone, static noise, distant digital hums)
  • Implement "ghost users"—show fake other people trying to save memories
  • Add scroll resistance that increases with corruption
  • Build a "share your vault" feature (screenshot-able end screen)

Dream Features:

  • User-Generated Memories: Let people submit their own internet memories to the pool
  • Multiplayer Apocalypse: Multiple users scroll through the same dying feed, competing to save memories
  • Personalized Corruption: Use browser history/cookies to generate memories specific to each user (with permission)
  • The Reverse: A mode where you START at 100% corruption and scroll backward, watching the internet heal
  • Audio Logs: Voice-acted "last transmissions" from fictional internet users
  • Time Dilation: The faster you scroll, the faster everything corrupts (literally racing against yourself)

The Philosophy: This project isn't just about the internet ending. It's about:

  • What we value when forced to choose
  • The fragility of digital culture
  • Collective memory and who decides what's worth preserving
  • The anxiety of information overload vs. information loss

I want to expand this into a larger meditation on digital impermanence. Maybe a series: "The Last Email," "The Last Tweet," "The Last Upload."

The Real Goal: If even one person walks away from THE LAST SCROLL thinking differently about what they save, what they share, and what they let disappear online—then I've succeeded.

Because the internet is ending, slowly, one dead link at a time. This project just makes you feel it all at once.


Built with chaos, shipped with love, designed to hurt. 🌑

Built With

  • css-animations
  • css3
  • html5
  • intersection-observer-api
  • localstorage-api
  • vanilla-javascript
Share this project:

Updates

posted an update

THE LAST SCROLL - Project Updates

Copy and paste these into your hackathon platform/devlog as you build!


UPDATE 1: The Concept

Posted at: Hour 0 (Hackathon Start)

The prompt hit different: "What would you ship if the internet was ending tomorrow?"

So here's the answer: THE LAST SCROLL

An infinite scroll through internet history. But everything's corrupting in real-time. Text breaks apart. Images glitch. Memories fade to static.

You can save some. But not all.

Digital triage. The weight of impossible choices. Watching history die and deciding what survives.

48 hours to build something that hurts in the right way.

Let's go.


UPDATE 2: The Corruption Engine Lives

Posted at: Hour 8

Just got the corruption system working and holy shit it's visceral.

Every memory has a decay level that increases over time. Text gets progressively replaced with blocks. Images pixelate and fade. The whole feed slows down like a dying computer gasping for breath.

function corruptText(text, level) {
  const corruptionChars = ['█']
  let corrupted = text;
  const corruptCount = Math.floor(text.length * (level / 100));

  for (let i = 0; i < corruptCount; i++) {
    const pos = Math.floor(Math.random() * corrupted.length);
    corrupted = corrupted.substring(0, pos) + 
                corruptionChars[Math.floor(Math.random() * corruptionChars.length)] + 
                corrupted.substring(pos + 1);
  }
  return corrupted;
}

This is working. This feels right.


UPDATE 3: Content is King

Posted at: Hour 14

Spent the last few hours writing ~150 fake internet memories and I'm realizing: the content IS the project.

The corruption engine is cool. The save mechanic will be tense. But none of it matters if the memories don't hit.

Some favorites so far:

  • "RIP Flash games, you raised me better than my parents"
  • "my first email was sparklegirl2001@hotmail and I'm not ashamed"
  • "Does anyone else physically feel the Myspace top 8 anxiety or just me"
  • "Goodbye, Internet Explorer. You were slow but you were there."

The key: mix nostalgia with specificity. Generic = forgettable. Weirdly specific = emotional gut punch.

Coffee break, then building the save system.


UPDATE 4: The Save System (aka The Cruelty)

Posted at: Hour 22

The save button is implemented. You get 15 saves. That's it.

There are 200+ memories in the feed. The math is brutal by design.

Every click now feels weighted. "Do I save this nostalgic forum post or wait for something better?" But you can't scroll back. Once it's gone, it's gone forever.

I tested it myself and literally felt anxiety choosing what to save. If it's making ME uncomfortable, it's working.

The vault view shows your saved memories at the end. Everything else? Lost to the void.

This is the heart of the project: you can't save everything, and that's the point.


UPDATE 5: Glitch Aesthetic Polish

Posted at: Hour 30

Spent the morning making the decay beautiful.

Added:

  • CSS filters that progressively increase (blur, grayscale, contrast)
  • RGB split effect on corrupted items
  • Scan lines and VHS-style distortion
  • Random pixelation on images
  • Subtle animations that stutter and break

The goal: make it look intentionally broken, not accidentally buggy.

There's an art to controlled chaos. Every glitch needs to feel designed.

Also added a corruption meter at the top: "Internet Integrity: 47%" that ticks down. Visual countdown to apocalypse. Pure dread.


UPDATE 6: The End Screen

Posted at: Hour 38

Just finished the end screen and it's devastating.

When everything hits 100% corruption or you run out of time, the screen fades to black. Then:

━━━━━━━━━━━━━━━━━━━━━━━━━━
    THE INTERNET HAS DIED
━━━━━━━━━━━━━━━━━━━━━━━━━━

You saved 12 memories.

10,847 memories were lost forever.

Internet Integrity: 0%
━━━━━━━━━━━━━━━━━━━━━━━━━━

Then it shows your vault - the few things you chose to preserve.

That number. "10,847 lost forever." It's fake, obviously, but the weight of it? Real.

This is what I wanted to build. Something that makes you feel digital mortality.


UPDATE 7: Demo Video & Final Polish

Posted at: Hour 44

4 hours left. Demo video is recorded. Final polish time.

Added:

  • Smoother scroll degradation (starts subtle, accelerates)
  • Better mobile responsiveness
  • Fixed a bug where saves weren't persisting
  • Tweaked color palette (deeper blacks, dying ember orange)
  • Cleaned up the code (future me will thank current me)

The experience is tight. 60 seconds from landing to end screen. Every second has weight.

Deployed on Vercel. Link works. Thumbnail uploaded. Submission ready.

Now I wait.


UPDATE 8: Submitted

Posted at: Hour 48

It's done.

THE LAST SCROLL is live, submitted, and out in the world.

48 hours ago this was just a vibe. Now it's a thing people can experience.

No idea if judges will love it or hate it. But I built what I wanted to build. Something that makes you feel the weight of digital impermanence. Something beautifully broken.

If even one person walks away thinking differently about what they save online, I've won.

Thanks for following along.

Live Demo: [your link] GitHub: [your repo] Video: [your youtube link]

Now I sleep.


UPDATE 9: Post-Hackathon Reflections

Posted: Day 3 (after judging)

Had some time to reflect on what worked and what I'd change:

What Worked:

  • The emotional core - people FELT it
  • Vanilla JS was the right call - shipped fast, no framework overhead
  • The save limit created real tension
  • Content quality > code complexity

What I'd Improve:

  • Add sound design (ambient drone, static noise)
  • Implement "ghost users" to show others saving memories
  • Better mobile touch interactions
  • More memory variety (video thumbnails, audio clips)

What I Learned:

  • Constraints breed creativity
  • Emotion beats perfection in 48 hours
  • Dark themes hit different
  • Sometimes the bug IS the feature

Regardless of results, I'm proud of this weird little apocalypse simulator.


UPDATE 10: Future Plans

Posted: Week 1 Post-Hackathon

Got some wild ideas for V2 (if I ever find time):

Immediate:

  • Open source the corruption engine
  • Write a technical breakdown blog post
  • Add user-submitted memories feature

Dream Features:

  • Multiplayer mode - multiple users racing to save memories
  • Personalized corruption - use browser history to generate custom memories
  • "The Last Email" - same concept, different medium
  • VR version? (probably cursed but intriguing)

Community Ideas:

  • Let people submit their real internet memories
  • Create a permanent memorial of lost internet culture
  • Build a series: The Last Tweet, The Last Upload, etc.

This project has legs. It's not done.

The internet is always dying. We're just making you feel it.


TEMPLATE FOR YOUR OWN UPDATES:

Format:

## UPDATE [NUMBER]: [Catchy Title] [Emoji]
**Posted at: [Time/Date]**

[1-2 paragraphs about what you built/learned/felt]

[Optional: code snippet, screenshot, or quote]

[End with a hook or next step]

Tone Guide:

  • Be honest about struggles
  • Share small wins
  • Show personality
  • Use emojis sparingly but effectively
  • Keep it conversational
  • Build narrative momentum

Remember: These updates aren't just logs - they're storytelling. You're taking people on the journey with you.

Log in or sign up for Devpost to join the conversation.