About the project

Inspiration
I built WorkNest after feeling overwhelmed by constant context‑switching between tasks, calendars, and focus sessions. Inspired by Zen productivity philosophies (and apps like Headspace), I wanted a single desktop command center that seamlessly blends AI‑powered planning with robust Deep Work support. During a hackathon, I sketched a wireframe of a minimal UI overlaying my schedule and realized that integrating AI suggestions and app/site‑blocking could solve my biggest productivity hurdles.

How I Built It

  1. Electron Shell & Embedded Browser – Laid the foundation with Electron.js and BrowserView to create a desktop container that hosts both React UI and a controlled Chromium instance.
  2. UI & Styling – Used Vite, React.js, and TailwindCSS to craft a Zen‑minimalist interface with soft pastel accents and dark forest green highlights. Components include a task panel, calendar view, focus timer, and notification tray.
  3. AI Integration – Integrated the Gemini API (with a local LLM fallback) to power event suggestions (“Study Session at 4 PM?”) and task breakdowns. Developed middleware to parse natural language and update React state seamlessly.
  4. Blocking Logic – Employed node-window-manager, active-win, and robotjs to detect and block distracting apps (Discord, Chrome, Slack). Implemented site‑blocking in the embedded browser with a whitelist/blacklist approach.
  5. Data Persistence – Chose SQLite (electron-sqlite3) for reliable storage of tasks, events, and focus session logs. Designed a lightweight schema and built a simple ORM layer to sync UI actions with the database.

What I Learned

  • Cross‑Platform Desktop Development – Navigating Electron’s quirks on Windows, macOS, and Linux taught me to handle OS‑specific behaviors and packaging.
  • AI‑First UX Patterns – Balancing proactive suggestions without intruding on user flow sharpened my sense for timing, relevance, and fallback handling.
  • Robust Blocking Techniques – Building reliable app and site blockers underscored the importance of edge‑case handling (e.g., app renaming, system dialogs).
  • Team Collaboration – Coordinating with frontend, AI, and shell specialists refined my communication and git workflow skills.

Challenges Faced

  • API Consistency – Ensuring Gemini’s suggestions remained contextually accurate required prompt engineering and caching strategies.
  • Blocking Edge Cases – Some apps resisted window hooks, so I had to explore multiple libraries and fallback methods to guarantee a distraction‑free mode.
  • State Synchronization – Keeping the database, UI state, and embedded browser in perfect sync during rapid focus‑mode toggles demanded careful debouncing and transaction handling.
  • Performance Tuning – Balancing real‑time blocking checks, AI calls, and React rendering without draining resources pushed me to optimize event loops and lazy‑load components.
Share this project:

Updates