The web version of Dabadoro had a smaller job than the desktop app, which made it easier to ruin.

A desktop productivity app can justify a dashboard, analytics, habits, rewards, release notes, all of it. A Pomodoro web app has less room to hide. If the screen feels busy, the whole product feels wrong.

So the rule was simple: the timer gets the room.

Dabadoro Pomodoro web app in dark mode

The Browser App Needed A Different Shape

The desktop app is for people who want a full system. The web app is for people who want to start.

That difference changes the design. The web app cannot ask someone to learn a workflow before giving them value. It has to open, let them name the thing they are working on, and start the session.

The timer screen does that. Big countdown, task label, session modes, start button. Nothing poetic. Nothing clever. Just enough friction to make the session intentional.

Dabadoro Pomodoro web app in light mode

The Task Screen Is Where The Product Gets Personal

The task screen looks plain, and that is the point.

This is where a focus app can easily become annoying. Too many fields, and the user starts managing the app instead of preparing the work. Too few fields, and the timer becomes disconnected from the task.

I kept it to task groups and quick notes. The examples in the screenshot are the real kind of prompts I wanted the interface to support:

• Write the launch brief.
• Open with the promise, not the feature list.
• Capture one screenshot after the timer flow is polished.

Those are not generic tasks. They sound like work a person would actually do.

Dabadoro web app tasks and notes screen

Settings Belong Behind A Door

Every Pomodoro app needs settings. Focus length, short break, long break, auto-start, sound, notifications, theme. The question is not whether those controls should exist. The question is where they should live.

I put them behind the settings view because settings are preparation, not focus.

The user can tune the system when they need to, then leave it alone. That matters. A tool for concentration should not keep advertising its configurability during the session.

Dabadoro web app settings view in dark mode

The Google Sheet Button Is A Product Bet

The "Link your Google Sheet" button is small, but it changes the feel of the app.

It says: your data should not be trapped here.

That is a practical promise. A simple Pomodoro tool becomes more trustworthy when it lets the user keep ownership of their session history. It also gives the web app a reason to exist beside the desktop app instead of becoming a weaker clone.

Dark Mode Was Designed For Work, Not Drama

Dark mode can go theatrical very quickly. This one had to stay quiet.

The background is almost empty because the timer has to hold attention without shouting. The red accent is used sparingly, mostly for action and brand presence. The rest is restraint.

Light mode has a different job. It is better for setup, lists, and daytime use. The two modes are not just inverted colors. They serve different moments.

What I Would Keep

I would keep the bottom navigation. It gives the app a small physical rhythm: timer, tasks, settings. Three places, no maze.

I would keep the task labels visible on the timer. A countdown without context is too easy to ignore.

I would keep the empty space. That is probably the most important part of the interface.

What I Would Push Next

The next version should make the end of a session more satisfying.

Starting is clean. Settings are contained. Tasks are clear. But the finish moment could do more: save the session, ask what changed, offer a tiny note, or show the user what they just added to their streak.

That moment matters because it is where a tool becomes a habit.

The Lesson

Small web apps need discipline more than features.

Dabadoro Web App works best when it behaves like a good desk: the important thing is in front of you, the tools are within reach, and nothing is waving for attention while you are trying to think.

That is the whole design.