problem evidence
Content to follow.
a thin bar that stays out of the way
Idle, the pill is a six pixel bar. It turns purple and pulses while a timer is running.
one click to a running timer, on every tab.
The pill sits at the bottom center of every browser tab. It starts a Toggl timer in one click and opens the real "What are you working on?" card for task, project, and tags.
This page holds the three parts of the submission: the reasoning, the walkthrough video, and the working prototype in a real cloud browser with nothing to install.
An unofficial prototype by Shaurya Singh, built on the Toggl 2.0 browser extension for the Toggl Senior Product Manager assignment. Not affiliated with Toggl.
try it
- The demo account is shared, so timers you start are visible to other reviewers.
- The browser stays alive while you are in it and closes about four hours after you leave.
01
insights
Why this friction, why it should bring a new user back in the first week, and what was left out.
chosen opportunity
Content to follow.
first-week mechanism
Content to follow.
prototype flow
Content to follow.
prioritization
Content to follow.
trade-offs
Content to follow.
assumptions
Content to follow.
expected impact
Content to follow.
measurement plan
Content to follow.
02
loom video
A five-minute walkthrough of the prototype: the choice, the trade-offs, the expected impact, and how AI was used.
The walkthrough video is embedded here once recorded.
03
prototype
A working build of the Toggl 2.0 extension with the pill added, running against the live product. Open it in the cloud, or install it yourself.
starting a timer from a client tab
bar length: where it is availablenumber: clicks to a running timer
Freelancers and embedded contractors spend the day inside client tools: the client's Jira, a shared doc, a vendor portal, a custom admin. Toggl's extension puts a start button inside fourteen of those tools. Everywhere else, the fastest path is the toolbar popup: click the icon, then click play. The pill puts a one-click start at the bottom of every tab and its chevron opens the same timer card the popup uses.
see what changed
toolbar popup
2 clicks3 if the icon sits behind the puzzle menu
site integrations
1 clickon 14 supported sites
the pill
1 clickon every site
how it works
clips from the test harness on a dark page
01 idle
02 hover
hover reveals record and a chevron
The bar grows into a dark control. Record starts a timer with one click. The chevron opens the timer card.
03 running
elapsed time on every tab
A running timer shows its elapsed time on hover, and the same button stops it. Every tab stays in sync.
04 card
the extension's own timer card
The chevron opens the real "What are you working on?" card with task, project, and tag pickers.
install it yourself
Chrome or Arc, unpacked
the extension
- Open
chrome://extensionsorarc://extensionsand turn on Developer mode. - Disable the store "Toggl 2.0" extension while testing. Both builds would otherwise inject integration buttons and banners twice on every page.
- Click "Load unpacked" and pick the unzipped folder.
- Open any http or https page. The pill appears once the page finishes loading.
- Signed in to Toggl in that browser, the extension picks up the session on its own within a few seconds.
what changed
versus the store build, 0.25.1
| file | change |
|---|---|
addedcontent-scripts/pill.js |
The pill itself. A shadow DOM control on every http and https tab. Start and stop go through the extension's own background service, the running entry is read from extension storage, and the flyout embeds the popup. |
addedpill-embed.css, pill-embed.js |
An embed mode for the popup, enabled by popup.html?embed=bar, that shows only the timer card and pins it to the bottom of a transparent frame so pickers open upward. popup.html loads both from its head. |
editedmanifest.json |
Adds the pill content script on every site, makes popup.html web accessible so the flyout can load it, renames the extension to "Toggl 2.0 (Pill)", and drops key and update_url so it installs beside the store build under its own ID and never auto-updates. |
Everything else in the folder is Toggl's unmodified extension code. The pill only sends messages to it, so sign-in, retries, caching, and analytics stay where they are.