A cross-platform, gamified productivity system that tracks application usage, enforces adaptive restrictions, and helps users build lasting focus habits through behavioral intelligence.
Modern knowledge workers lose 2.5+ hours daily to context switching, distraction loops, and unstructured app usage. Existing tools either spy too aggressively or nudge too gently. There is no system that:
- Tracks what you do (not what you type)
- Escalates restrictions intelligently based on behavior
- Helps you understand why you get distracted
- Gamifies discipline without being annoying
FocusLayer is a cross-device productivity OS layer that:
- Passively monitors app usage metadata (no content, no keystrokes)
- Detects distraction loops and context drift in real time
- Applies a 5-stage escalating restriction engine
- Provides a gamified habit + streak system
- Shows beautiful analytics to build self-awareness
- Optionally enables ethical employee monitoring (opt-in only)
| Feature | Description |
|---|---|
| 🔍 Activity Tracking | Track app usage, idle time, switch frequency |
| 🚫 Focus Mode | Whitelist/blacklist apps with 5-stage escalation |
| 🌀 Context Drift Detection | Real-time distraction loop identification |
| 🏆 Habit System | Create habits linked to actual usage data |
| 📊 Analytics Dashboard | Focus score, heatmaps, weekly reports |
| 🔄 Cross-Device Sync | Real-time WebSocket sync between desktop + mobile |
| 👔 Employee Mode | Opt-in ethical monitoring with productivity scores |
| 🔔 Smart Notifications | Behavior-aware warning messages |
| 🔒 Privacy Controls | Consent screen, data transparency, pause tracking |
| Layer | Technology |
|---|---|
| Frontend | React 18 + TypeScript + Tailwind CSS |
| Desktop App | Electron.js |
| Mobile App | React Native (Android) |
| Backend | Node.js + Express |
| Database | PostgreSQL |
| Real-time | Socket.io (WebSockets) |
| Auth | JWT + bcrypt |
| ORM | Prisma |
focuslayer/
├── docker-compose.yml ← Run everything with one command
├── frontend/
│ ├── Dockerfile
│ └── src/ # React + TypeScript web dashboard
├── backend/
│ ├── Dockerfile
│ ├── prisma/schema.prisma
│ └── src/ # Node.js + Express API server
├── electron/
│ └── src/ # Desktop app wrapper + native tracking
├── mobile/
│ └── src/ # React Native Android app
└── docs/
└── ARCHITECTURE.md # Full system design documentation
This is the easiest way to run the full stack. You only need Docker Desktop installed — no Node.js, no PostgreSQL setup required.
Download from https://www.docker.com/products/docker-desktop and install it. Make sure it is running before continuing.
unzip focuslayer-complete.zip
cd focuslayerdocker compose up --buildThat's it. Docker will automatically:
- Pull and start a PostgreSQL database
- Build and start the backend API (runs DB migrations automatically)
- Build and start the frontend (served via nginx)
| Service | URL |
|---|---|
| Web Dashboard | http://localhost:5173 |
| Backend API | http://localhost:4000 |
| API Health Check | http://localhost:4000/health |
docker compose downTo also wipe the database and start completely fresh:
docker compose down -vUse this if you want to run each service individually for active development.
- Node.js >= 18
- PostgreSQL >= 14 running locally, or a free cloud instance from https://neon.tech
- Android Studio (for mobile only)
unzip focuslayer-complete.zip
cd focuslayercd backend
npm install
cp .env.example .envOpen .env and fill in your values:
DATABASE_URL="postgresql://your_user:your_password@localhost:5432/focuslayer"
JWT_SECRET="any-long-random-string-you-choose"
PORT=4000
CLIENT_URL="http://localhost:5173"Run migrations and start the server:
npx prisma migrate dev
npm run devAPI is now running at http://localhost:4000
cd ../frontend
npm install
cp .env.example .env
npm run devDashboard is now at http://localhost:5173
cd ../electron
npm install
npm run devThis opens the desktop window and begins tracking your active app windows in the background.
cd ../mobile
npm install
npx react-native run-androidRequires Android Studio with an emulator running, or a physical Android device connected via USB with USB debugging enabled.
- Sign Up — Create an account and read through the consent screen
- Enable Tracking — Toggle tracking on from the Privacy tab
- Set Focus Goals — Define a session length and add habits in the Habits tab
- Start a Session — Click "Start Session" in the Focus tab; FocusLayer monitors app usage in the background
- Get Nudged — Receive stage-based alerts when you drift from focused work
- Review Dashboard — See your focus score, hourly heatmap, and streaks
- Improve — Act on weekly insights and AI-generated habit suggestions
See /docs/ARCHITECTURE.md for the full documentation including:
- High-Level Architecture diagram
- Low-Level Design (LLD)
- ER Diagram
- Data Flow Diagram (DFD)
- Sequence Diagrams
- Full REST API documentation
- WebSocket event reference
- Module-by-module explanations
"Cannot connect to database"
→ Make sure PostgreSQL is running. With Docker, just run docker compose up again.
"Port 4000 already in use"
→ Set PORT=4001 in backend/.env and update VITE_API_URL=http://localhost:4001/api in frontend/.env.
"Prisma migration failed"
→ Double-check that DATABASE_URL in .env points to an existing PostgreSQL server with the correct username and password.
Electron shows a blank screen
→ Make sure the frontend dev server is running first (npm run dev inside /frontend), then launch Electron.
Android build fails
→ Make sure ANDROID_HOME is set and an emulator is running. Run npx react-native doctor to diagnose issues.
MIT License — Free for personal and educational use.