<p><img src="/assets/projects/task-floater/full-view-dark.png" alt="Task Floater, full view"></p>
<h2>The Problem</h2>
<p>To-do apps lose to the cost of switching to them. The list lives in a tab or a separate window, so checking it means breaking focus, and breaking focus means the list quietly stops getting used. Menu-bar apps fix visibility but hide everything behind a click. I wanted my tasks to be persistently <em>there</em>: always visible, always one glance away, without stealing screen real estate or attention.</p>
<h2>What I Built</h2>
<p><a href="https://github.com/Cyvid7-Darus10/task-floater">Task Floater</a> is a small, always-on-top window that floats over your work. It is translucent glassmorphism, so it sits on top of your editor without feeling heavy, and it stays out of the way until you need it. Add a task, check one off, start a focus timer, all without leaving what you were doing.</p>
<h3>Focus timer</h3>
<p>A built-in timer turns any task into a focus session, so starting work and tracking it happen in the same place.</p>
<p><img src="/assets/projects/task-floater/focus-timer.png" alt="Focus timer"></p>
<h3>Modes for every context</h3>
<p>A full view for planning, a compact mode that shrinks to just your active tasks, and a focus mode that strips everything down to the one thing you are doing right now. Full light and dark theming adapts to your desktop.</p>
<p><img src="/assets/projects/task-floater/full-view-light.png" alt="Light theme, full view"></p>
<h2>Tech Stack</h2>
<table>
<thead>
<tr>
<th>Layer</th>
<th>Technology</th>
<th>Why I Chose It</th>
</tr>
</thead>
<tbody>
<tr>
<td>Shell</td>
<td><a href="https://www.electronjs.org/">Electron 28</a></td>
<td>Native always-on-top window, tray APIs</td>
</tr>
<tr>
<td>Language</td>
<td><a href="https://www.typescriptlang.org/">TypeScript</a></td>
<td>Type safety across main and renderer</td>
</tr>
<tr>
<td>OCR</td>
<td><a href="https://github.com/tesseract-ocr/tesseract">Tesseract</a></td>
<td>Pull tasks out of screenshots and images</td>
</tr>
<tr>
<td>Platform</td>
<td>macOS 10.13+</td>
<td>Vibrancy and window-level integration</td>
</tr>
</tbody>
</table>
<h2>What Building This Taught Me</h2>
<h3>Always-on-top is a UX problem, not a flag</h3>
<p>Setting a window to float is one line. Making a floating window pleasant is the actual work: it cannot grab focus when you click it, it has to stay subtle enough not to distract, and it needs to respect full-screen apps and Spaces. The window-level behavior took far more iteration than the task logic.</p>
<h3>Glassmorphism earns its keep here</h3>
<p>I usually treat heavy blur as decoration to avoid. For an overlay that sits permanently on top of other windows, translucency is functional: it keeps the app present without fully occluding what is behind it, so the floater informs without blocking.</p>
<h3>Less surface, more use</h3>
<p>Every mode I added was about removing, not adding. Compact mode and focus mode exist because the full view is too much when you are heads-down. The app gets more useful the smaller it gets.</p>
<h2>Links</h2>
<ul>
<li><strong>GitHub:</strong> <a href="https://github.com/Cyvid7-Darus10/task-floater">task-floater</a></li>
</ul>


Projects.

Task Floater: A Floating Task Manager for macOS