TaskGlowTimer

TaskGlowTimer is AR Labs' single-page web app for focused work, for anyone who wants a keyboard-driven focus timer tied to their goals. You write the task in front of you on a sticky note, start a 30-minute circular timer, and when the task is done it drops into a history list tagged with the goal it served. It began in late 2025 as a small web companion to VoxPlan, our Android goal planner and time tracker, branded "VoxPlan Web-Mini", and in 2026 it became the first real application our design system was applied to.

What it does

The screen has three working areas: a stack of goals on the left, the completed-task history beside it, and on the right the task queue, the sticky note and the timer.

• Sticky note and timer. The current task lives on a sticky note. The timer fills like a pie chart over 30 minutes and can be paused and resumed.
• Goals. A person keeps a stack of goals and promotes one to "current". New tasks and queued tasks inherit the current goal automatically, and each completed task carries a short goal badge. Curved lines are drawn from each goal to the tasks that served it, so the shape of a day's work is visible at a glance.
• Rewards. Every 30 minutes of work earns a gold medal, and two medals merge into a diamond representing an hour.
• Queue. Upcoming tasks wait in a queue that can be reordered by drag and drop.
• Keyboard first. Almost everything has a key: t focuses the sticky note, Enter starts the clock, Space pauses, g adds a goal, j and k move through lists in the manner of the Vim editor, and Shift+M switches between light and dark themes. A help panel lists every shortcut.

flowchart LR
  GS["Goal stack"] --> CG["Current goal"]
  Q["Task queue"] --> SN["Sticky note"]
  CG --> SN
  SN --> T["30-minute timer"]
  T --> R["Medals and diamonds"]
  T --> H["Completed history"]
  H -.->|"lines back to goals"| GS

How it was built

The first version was built in an online development environment in October and November 2025, as an experiment in prompting an AI tool to produce a working app from a description. The stack is React 18 with TypeScript and Vite, Tailwind CSS with shadcn/ui components built on Radix primitives, and a small Express server. Goals and tasks are stored in SQLite through the Drizzle ORM.

What exists today

The code is public on GitHub. In August 2026 we reskinned the app with the design system we had extracted from arlabs.tech, then ran a user-interface audit and a cleanup whose rule was that nothing visible could change. The audit documented the as-built design, proposed a target structure, and then applied the safe part of it: shared components extracted for keyboard-key chips and empty states, unused components removed, theme switching consolidated into one helper, and undefined design tokens removed from the configuration. The net result was 279 fewer lines of code.

The cleanup was checked by type-checking, a clean production build, a scripted walkthrough of the main actions, and screenshot comparison in both themes. That comparison caught one regression: a class-merging utility silently dropped a custom border class, so the keyboard chips lost their borders. The fix replaced the utility and the check was re-run. Larger refactors, such as splitting the timer component into smaller hooks, were written down as a staged backlog rather than attempted in the same pass.