our sexy logo
brain nourishment
GAMEZ

Leo's Last Hope: A Story of Reclaiming Focus

Inspiration

The real story behind "Leo's Last Hope" starts with our friend, Leo.

Leo is an incredible developer, but he suffers from a common affliction: the "waiting game" distractibility loops. We noticed that every time Leo hit "Generate" on Copilot or waited for a build to finish, he would instinctively reach for his phone. What started as a 45-second wait turned into 15 minutes of doom-scrolling on Twitter or Instagram. By the time he looked back at his screen, his flow state was shattered, and he had forgotten what he was even trying to code.

We built Leo's Last Hope to save Leo (and ourselves) from this productivity black hole. We wanted to keep the dopamine hit on the main screen but transform it from "mindless scrolling" to "mindful learning" or "quick decompression."

What It Does

Leo's Last Hope is a VS Code extension that reclaims your idle time. It detects—or lets you instantly trigger—those "waiting moments" and replaces the empty void with two distinct modes:

📖 Reading Mode (Stay Sharp)

Instead of a blank screen, you get a personalized, curated feed of articles based on your specific interests (e.g., "AI", "Startups", "System Design"). We scrape the latest content from your favorite sources, summarize it into digestible 3-paragraph bites using AI, and serve it directly in your IDE. You learn something new in 2 minutes without ever alt-tabbing.

🎮 Game Mode (Decompress)

When your brain is fried and you can't read another word, you can switch to "Game Mode" to play custom-built Computer Science mini-games. It's a fun way to reset your mental state while still engaging with relevant concepts.

How We Built It

We built a distributed system that lives entirely within your development environment:

┌─────────────────────────┐
│   VS Code Extension     │ ← Entry point (Cmd+Shift+G)
│  (TypeScript)           │
└────────────┬────────────┘
             │
             ├─────────────────────────┐
             │                         │
             ▼                         ▼
    ┌────────────────┐        ┌──────────────────┐
    │   SvelteKit    │        │  Express Backend │
    │   Frontend     │        │  (Node.js)       │
    │   "The Brain"  │        │  "The Fetcher"   │
    └────────────────┘        └────────┬─────────┘
                                       │
                    ┌──────────────────┼──────────────────┐
                    │                  │                  │
                    ▼                  ▼                  ▼
             ┌────────────┐      ┌──────────┐     ┌────────────┐
             │  Exa API   │      │ OpenAI   │     │ PostgreSQL │
             │  (Search)  │      │ (Summary)│     │ (Cache)    │
             └────────────┘      └──────────┘     └────────────┘

Core Components:

VS Code Extension: The entry point. It handles user commands (Cmd+Shift+G), manages the webview panel, and intercepts "idle" moments.
The "Brain" (SvelteKit & Frontend): A responsive, high-performance UI that runs inside the VS Code webview. Handles rendering of the article feed and interactive game logic.
The "Fetcher" (Express & Node.js): A dedicated backend service that handles the heavy lifting.
Exa API: We use Exa's neural search to intelligently find high-quality articles from user-defined domains (like tldr.tech or dev.to) that match specific interest keywords.
Vector/Content Parsing: We fetch full article content and clean it for processing.
OpenAI (GPT-4o-mini): We pipe the raw article content through GPT-4o-mini to generate concise, "no-fluff" summaries perfect for a developer's short attention span.
Data Persistence (Prisma & PostgreSQL): We use Prisma ORM with a Postgres database to cache summarized articles, ensuring that your feed loads instantly even if you're offline or the APIs are slow.

Challenges We Ran Into

🔺 The "Triangle" Architecture

Coordinating state between the VS Code Extension host, the Express backend API, and the SvelteKit frontend was tricky. We had to ensure that when a user pressed a hotkey in VS Code, it correctly triggered the scraper in the backend and updated the Svelte view in real-time without locking up the editor.

💭 Prompt Engineering for "Flow"

Getting the AI to summarize articles effectively was a challenge. Initial prompts resulted in summaries that were too long or missed the technical depth. We had to iterate on our prompts to ensure the output was "3-4 paragraphs of pure signal, no noise."

🔍 Smart Scraping w/ Exa

Refining the Exa search queries to find new and niche content rather than just generic SEO spam took significant tuning of our search parameters (using neural search type and livecrawl).

🔐 Webview Constraints

Running a full modern web app (SvelteKit) inside a VS Code webview iframe came with strict Content Security Policy (CSP) and communication hurdles that we had to overcome.

Accomplishments We're Proud Of

✨ The "Overlay" UX We're really proud of how seamless the transition is. It feels like a native part of the editor. You hit a key, and boom—you're learning.

⚡ Real-time Summarization Pipeline Successfully chaining Exa's search results directly into OpenAI's summarization engine to go from "general keyword" to "summarized, readable content" in seconds.

🎯 Actually Saving Time In our own testing, we found ourselves actually reading the articles we bookmarked months ago but never opened. It turns "dead time" into "learning time."

What We Learned

⏱️ Latency Is the Enemy of Focus

If the tool takes too long to load, you lose the user to their phone anyway. This drove us to implement aggressive caching with Postgres and optimized frontend loading states.

💙 Developers Love "Lazy" Personalization

We learned that users don't want to manually curate feeds. Giving them simple configuration arrays ("interests": ["React", "Rust"]) was much more effective than complex UI settings.

🚀 The Power of VS Code Webviews

We learned just how powerful the VS Code API can be when combined with a modern web framework like Svelte. It opens up a world of "micro-apps" that can live inside your IDE.

What's Next for Leo's Last Hope

👥 Team Feeds

Share your "read list" with your engineering team. If someone finds a great article on architecture, it automatically propagates to the team's "waiting" feed.