A speed reading app that uses Rapid Serial Visual Presentation (RSVP) to display words one at a time at a fixed focal point, eliminating eye movement and letting you read faster.
- ORP highlighting — each word highlights the Optimal Recognition Point letter in crimson, positioned at a fixed focal point so your eyes never move
- Adjustable speed — 100 to 1000 WPM with a slider or keyboard arrows
- Smart timing — longer words and sentences get extra display time automatically
- Keyboard controls — Space (play/pause), arrows (skip/speed), R (restart), Esc (exit)
- Paste and go — paste any article and start reading immediately
npm install
npm run devOpen http://localhost:3000.
- Next.js 16
- Tailwind CSS v4
- shadcn/ui
- Motion (Framer Motion)
src/
├── app/
│ ├── globals.css # Theme, animations, textures
│ ├── layout.tsx # Root layout with custom fonts
│ └── page.tsx # Composition shell
├── components/
│ ├── background.tsx # Gradients, grid, particles
│ ├── inputView.tsx # Article input screen
│ ├── readerView.tsx # Speed reading screen
│ ├── logo.tsx # SIFT logo
│ ├── reader/
│ │ ├── wordDisplay.tsx # ORP word rendering
│ │ ├── readerControls.tsx # Playback buttons, speed slider
│ │ └── progressBar.tsx # Reading progress
│ └── ui/ # shadcn components
├── hooks/
│ ├── useSpeedReader.ts # Reader state, rAF timer, controls
│ └── useKeyboardControls.ts
└── lib/
├── constants.ts # WPM limits, sample text
├── readerUtils.ts # ORP calculation, word delay, parsing
└── utils.ts # shadcn cn() helper
| Key | Action |
|---|---|
Space |
Play / Pause |
← → |
Skip 10 words back / forward |
↑ ↓ |
Increase / decrease speed |
R |
Restart |
Esc |
Exit to input |
⌘ Enter |
Start reading |