Project Info
Find yourself on Instagram Reels all day? Can't escape the Twitter drug? We'll help you break that habit with a bit of social friction. Here's how it works: Get all your friends together in a group. You can set your group's timezone as well as a designated no-friction rest period. You can set your group's timezone as well as a designated no-friction rest period. Anytime someone scrolls on a website like Twitter or Instagram, the distance they scrolled is tracked. The more distance that the group scrolls, the more "friction" is added to everyone's trackpad. This means over time, if people are doomscrolling a lot, it becomes harder & harder to scroll.... This means over time, if people are doomscrolling a lot, it becomes harder & harder to scroll.... And if you're addicted to Instagram Reels or YouTube Shorts, we'll also make them slower and blurrier (+ greyscale them!) over time. You can customize all the settings. Choose whether to make your reels and shorts blur, slow down, turn black-and-white...or all of the above! Also, specify a list of websites to apply friction on. Spend too much time scrolling Hacker News? Just add it to the blocklist. That way you put your energy towards other things, not just creating friction. Behind-the-scenes We've got a couple of things happening behind the scenes to make this happen: A PostgreSQL database being accessed / edited by a collection of Vercel Serverless Functions (via Prisma). We're hosting this database on Vercel's Serverless Postgres. We're hosting this database on Vercel's Serverless Postgres. A Chrome extension built using React This Chrome extension hijacks the wheel and onScroll events to produce the friction effect This Chrome extension hijacks the wheel and onScroll events to produce the friction effect Built at TreeHacks 2024 by @janetguo, @sampoder, and @maggie-j-liu
Find yourself on Instagram Reels all day? Can't escape the Twitter drug? We'll help you break that habit with a bit of social friction.
Here's how it works:
- Get all your friends together in a group.
- You can set your group's timezone as well as a designated no-fricition rest period.
- Anytime someone scrolls on a website like Twitter or Instagram, the distance they scrolled is tracked.
- The more distance that the group scrolls, the more "friction" is added to everyone's trackpad.
- This means over time, if people are doomscrolling a lot, it becomes harder & harder to scroll....
- And if you're addicted to Instagram Reels or YouTube Shorts, we'll also make them slower and blurrier (+ greyscale them!) over time.
That way you put your energy towards other things, not just creating friction.
Behind-the-scenes
We've got a couple of things happening behind the scenes to make this happen:
- A PostgreSQL database being accessed / edited by a collection of Vercel Serverless Functions (via Prisma).
- We're hosting this database on Vercel's Serverless Postgres.
- A Chrome extension built using React
- This Chrome extension hijacks the
wheelandonScrollevents to produce the friction effect
- This Chrome extension hijacks the
Built at TreeHacks 2024 by @janetguo, @sampoder, and @maggie-j-liu
Here's our mascot MITtens and our project!
And a team photo!
Analysis
View
Metric
- 30
- 23
- 2
Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.
Technology
- CSSIn code
- HTMLIn code
- JavaScriptIn code
- ReactIn code
- PostgreSQLClaimed
4 of 5 appear in the indexed code. 1 claimed on Devpost could not be matched to code, which may simply mean the tool leaves no trace in the repository.
AI coding agents
No AI coding agent signals were found in this repository.
Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.
Codebase size
Source size
59 KB
Source files
20
Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.
Repository
maggie-j-liu/friction
31 files · 949 KB · @ 344a2fa
Structure
Interface
13 files · 42%Screens, components and styles rendered to the user.
Application logic
7 files · 23%Domain rules, services and shared utilities.
Supporting
Layers are inferred from where files sit in the tree, not from reading the code. A project that names its directories unconventionally will read oddly here — open the file browser to check anything the diagram implies.
Languages
- JavaScript94%
- Markdown4%
- CSS2%
- HTML1%
Share of indexed source by file size. Binary and vendored files are excluded.
Dependencies
package.json
npm · 48- @emotion/react
- @emotion/styled
- palx
- react
- react-dom
- react-hot-toast
- theme-ui
- toastify-js
- +40 more
Declared in the repository’s manifests at the indexed commit. A declared package is not proof it is used, and runtime dependencies are listed first.
This project’s features have not been analysed yet.
Export this project's context (description, README, evidence, key source files) to chat with an AI agent elsewhere.