Video Demo: https://youtu.be/g5VU9WgLy1A
GAMEPLAN is a lightweight Chrome extension that combines task management and focus timing into a single, minimalist interface. The project was created to address a common friction in productivity workflows: the need to switch between separate applications to manage tasks, deadlines, and focus sessions. By placing all essential productivity elements in one compact popup, GAMEPLAN allows users to plan their day, track progress, and stay focused without distraction.
Rather than adding complex gamification mechanics or social features, GAMEPLAN focuses on visual clarity and simplicity. Its retro, gameboy-inspired interface provides a playful aesthetic while remaining functional and intentionally minimal. The design encourages users to start their day by listing tasks, complete them incrementally, and visually track progress through a progress bar and a focus timer.
At its core, GAMEPLAN consists of three main features:
- Task management with Deadlines
- Visual Progress Tracking
- A Focus Timer All data is stored locally using Chrome's extension storage API, ensuring fast performance and privacy without the need for a backend or user accounts.
Users can add tasks using a simple input form that includes an optional deadline (date and time). Each task is displayed in a list below the input area and can be marked as complete by clicking on it. Tasks can also be deleted entirely, allowing users to reset their task list or remove irrelevant items.
Tasks persist across browser sessions using chrome.storage.local, meaning unfinished tasks remain available even after closing the browser or the extension popup. This persistence supports daily planning while also giving users control over when to clear completed or outdated tasks.
To improve deadline awareness, tasks automatically change color based on how close they are to their deadline:
- Green indicates tasks with deadline far in the future (more than 24 hours)
- Yellow signals approaching deadlines (less than 24 hours)
- Red highlights overdue tasks
GAMEPLAN includes a visual progress bar that reflects the percentage of completed tasks. Each time a task is marked as done or deleted, the progress bar updates dynamically. This feature gives users a quick sense of accomplishment and momentum as they work through their task list.
The progress system is intentionally simple: it is based solely on task completion and does not attempt to track productivity scores or streaks. This design choice keeps the interface clear and avoids overwhelming users with metrics.
Users can select a focus duration in 10-minute increments ranging from 30 to 120 minutes using plus and minus buttons.
Once started, the timer continues running even if the extension popup is closed. This persistence is achieved by saving the timer's end time to local storage and recalculating whenever the popup is reopened. When the timer reaches zero, the session ends cleanly and notifies the user that the focus period is complete.
The interface is inspired by the original Nintendo Game Boy, using pixel-style font, monochrome green palette, and a screen-like container. While visually playful, the UI remains intentionally restrained to avoid distraction.
This design strikes a balance between minimalism and personality, making the tool feel less sterile than typical productivity apps without introducing unnecessary animations or effects.
popup.html: Defines the structure of the extension UI, including the task form, task list, progress bar, and timer controls.popup.css: Handles all visual styling, including the retro theme, layout spacing, task colors, and timer visuals.popup.js: Contains all application logic - task creation and persistence, deadline calculations, progress tracking, and the persistent focus timer.manifest.json: Configures the Chrome extension, including permissions and popup behaviour.