I had Toggl as a dock icon for six months before I deleted it.
The deletion wasn't a principled decision. It was that every time I cmd-tabbed and my eye caught the Toggl badge, I'd think "did I start the timer?" and the answer was usually no, and then I'd lose the next ninety seconds switching to it to start the timer for whatever I'd been doing, and then I'd forget what I was doing. The dock icon was an attention sink for a tool that was supposed to disappear.
The first version of Timex I built was also a dock app. I deleted it from my own dock after two days. The menu bar version replaced it the next week and never came back down.
That's not a small design choice. The difference between "dock" and "menu bar" is the difference between a tool that demands attention and a tool that sits where you already glance. For a tracker, only one of those is right.
The dock asks. The menu bar tells.
The macOS dock is a launcher. The icons that live there are applications you intend to switch to. The visual weight is high. The hit target is large. The Cmd+Tab list includes them. They're all loaded with expectation.
The menu bar is the opposite. It's where small status lives — the clock, the battery, Wi-Fi, the rotating set of utilities you check without thinking. The visual weight is low. You don't switch to a menu bar app. You glance at it.
A time tracker should be a glance. The question "what's the active app I'm being tracked as" needs to be answerable without a context switch. The dock placement forces a switch. The menu bar placement doesn't.
This is also why we don't ship a dock icon at all. Not as an option. Not as a togglable preference. Timex is a menu-bar-first app on principle — the Today view opens in a window when you ask for it, but Timex itself doesn't sit in your Cmd+Tab list. Less competition for your attention.
The pill: 220 pixels and a job to do
The menu bar slot Timex occupies is what we call the pill. It's roughly 220 pixels wide depending on the active app name. Inside it lives:
- A colored dot (the per-app color from the strip)
- The name of the app currently focused
- The duration you've been on it
That's the entire status. When you switch from Xcode to Slack, the pill animates from green-Xcode-12m to blue-Slack-0s. The dot color comes from the same palette used in the Today view, so the menu bar is a one-pixel preview of where you're showing up on the strip.
Three constraints made this hard.
The width budget is real. A long-running session ("Visual Studio Code · 2h 14m") needs to fit without crowding the AirPlay or battery icons next to it. We truncate window titles aggressively when needed, but the app name is sacred — if "Cursor" shows up in the pill, you have to be able to read "Cursor."
The pill has to redraw at 1 Hz without flicker. Every second, the duration ticks forward. If the redraw is sloppy, the menu bar shakes visually. macOS doesn't give you many tools for sub-pixel-stable text in this region, so we cache the rendered text and only re-render when the digit actually changes.
Dark mode and light mode have to look identical in feel. The dot palette had to work over both backgrounds. The text color has to be the system label color, not a custom value, or it'll look out of place during accent-color changes. Apple's HIG is strict about this for a reason.
The reward for getting these three right is that you eventually stop seeing the pill. It just becomes part of the menu bar — like the clock, like the battery — and you only consciously look at it when something feels off.
The dropdown: everything in one scroll
Click the pill and a panel drops down. The choice about what to put in this panel was 60% of the design work for Timex 1.0.
Here's what's there, top to bottom, in the order you see when you look at the menubar dropdown:
- The currently active app, big at the top, with the running session duration on the right. Same data as the pill, repeated here because the pill is in your peripheral and this is where you actually look.
- TODAY label and total tracked time today.
- Next break in X, with a small play button to start it manually if you want a break now.
- Break counter ("1 breaks") and hydration counter ("2/12") with quick minus/plus buttons.
- Stat icons in a row — eye, stretch, legs, posture, walk, breathing — each with a small count for the day.
- App list for today, sorted by time spent, each row showing the per-app dot, the app name, and total time.
- Action row at the bottom — five icons for the five things you'll actually do from this panel.
The order matters. The thing you're doing right now is at the top because that's the answer to the most common question ("am I being tracked correctly?"). The day-level totals follow because that's the next-most-common question. The app list comes last because by the time you're scanning the app list, you're already in "look at the day" mode and you might as well open the full Today view.
What we kept out
The harder question wasn't what to put in. It was what to leave out.
We don't show last week's average in the dropdown. We don't show a productivity score. We don't show goals or targets. We don't show notifications for milestone hits. We don't have a "what should I work on" prompt.
Each of those got discussed and cut for the same reason: the menu bar panel is supposed to answer questions you already had. It's not supposed to introduce new questions. The dock is the place for an app that demands "look at me." The menu bar is the place for an app that answers "what's the time" when you ask.
The closest we came to violating this rule is the stat icons row. We considered cutting it for v1 — does eye stretch count belong in the menu bar? — and decided it earns its place because glanceable wellness data changes behavior. If I can see "1/11 eye breaks today" without leaving the panel, I'll do a 20-20-20 right then. If it takes a window switch, I won't. The cost of the row is two lines of vertical space. The benefit, after three months of using it, is meaningful.
The bottom action row
The five icons at the bottom of the panel get used the most after the app list. From left to right:
- Window — opens the full Today view in a window. The big one with the 24-hour strip.
- Coffee — starts a break manually. Useful if you know you need one before the timer fires.
- Gear — settings. We try hard to put very little here. The defaults should work.
- Runner — pause/resume tracking. Used surprisingly rarely. People who think they want it usually don't actually pause much.
- Building — switches the data context. Reserved for future multi-profile support (think "work" vs "personal"); v1 is single-profile but the icon is there because the data model already supports it.
The order is loose-to-tight: the most-used action (open the Today view) is the leftmost; the rarest (context switch) is the rightmost. There's no Quit button in the dropdown — Quit is in the right-click context menu of the pill. Quitting a time tracker is a deliberate action, not a tap-target.
The other menu bar trackers
A few competitors live in the same neighborhood, and the design comparison tells you something.
Tyme has a beautiful menu bar pill but the app is project-driven — you pick a project, you start a timer. The menu bar is for managing the manual timer. Different product, different design pressure.
Timing has a menu bar element that shows the currently tracked task name with a small live timer. Cleaner than Toggl's, but the panel below is dense and feels like a desktop app squeezed into the dropdown.
Toggl Track has a menu bar item that's mostly a launcher for the dock app. You click it and the dock window pops to front. The menu bar is incidental, not load-bearing.
Apple's own Screen Time doesn't have a menu bar item at all. To see your day, you open System Settings, navigate three levels deep, and read a chart that updates daily.
The thing each of these is missing — at least from our perspective — is the glanceability of the active app. None of them show, in the menu bar itself, "this is the app you're being tracked as, this is how long it's been." That's the first answer the pill should give. We made that the most important thing the pill does.
What the menu bar can't do
I want to name the limits before someone else does.
The menu bar is not where you do deep analysis. The Today view, in a regular window, is where you scrub the timeline, drill into apps, look at the week. The menu bar panel is the quick check. Don't try to replicate the Today view in the dropdown — it will be cramped, the text will be too small, and the chart won't fit. We tried. It didn't work. The dropdown shows summaries. The window shows detail.
The menu bar is also limited by macOS in ways most users don't notice. You can't make the menu bar item taller than the menu bar. You can't have animated content there (well, you can, but the OS will sometimes hide your icon under "more icons" in a small menu bar). You can't show images larger than ~22 pixels tall. Every design decision in the pill happens under these constraints.
The shape that emerged
After a year of iteration, the menu bar tracker shape settled into something simple:
- One pill that names the active app, colors it, and times it
- One panel that summarizes the day in one scroll
- Five buttons to do the five things you'll actually do
- The full Today view in a window, for when you want to look hard
Most of the design work was cutting things that didn't earn their place. The version of Timex that shipped is several rounds of "we don't need this" away from the version that I first sketched. Each removal made the menu bar a tiny bit easier to ignore until you needed it.
That's the test. If you have to learn to use a menu bar app, the design failed. The good ones disappear into the menu bar and only come back when you ask.
Open the pill and see how little it gets in your way.