How to display a countdown timer?

Question

I'm making a Pomodoro Timer to apply the Pomodoro Technique to my work. I need to display a countdown timer (count 25 minutes). Within 25 minutes I need to focus on my current task and try my best to avoid interruptions(browser facebook, check email, IM, and etc.) After 25 minutes I can have a 5 minute break.

Here are 3 ways to display a counter timer:

1. Floating Window: a small window which is always on top.

• Pros: easy to place anywhere on screen.

• Cons: may overlap with some area of the screen

2. System tray icon

• Pros: a traditional approach that takes up little screen real estate

• Cons: only 16x16 pixel to display, only limited information can be displayed

3. System Taskbar icon (Windows 7) (this one is from my own idea):

• Pros: takes up little screen real estate

• Cons: people may not be used to it, not too much space to display additional information.

Which approach should I pick?

==== Edit: after @Marielle 's feedback ====

Because of a technique issue, I'm making a new design as an alternative to taskbar timer:

what do you think of this design comparing with previous option 3.

Answer 1

One of the key points of the pomodoro technique is that it asks you to pay full attention to the task at hand, if possible without distractions. A timer for this purpose shouldn't be more intrusive than strictly necessary, but still enable you to see at glance how much time you still have left.

Looking at your suggestions:

1) A window, even if small, can be distracting if the user needs the full screen for his task. The user should at least be able to minimize the window.

2) The tray icon can only display limited information. This forces you as the designer to focus on the most important task information, which is a good thing.

3) The taskbar icon has the same advantage as the tray icon (small and doesn't distract from the main task) but is a little bit larger. I like your visual reference to the pomodoro.

I wonder if the user really needs to know exactly how many seconds he has left... a less precise representation will probably suffice. Why not try an analogue representation, or a combination? For inspiration, take a look at the Time Timer, a physical device that allows children to quickly see how much time they have:

(this one is a watch, it shows both the exact time (15 minutes left) and a visual representation).

I've seen similar clocks in various time management games, you might take a look at those to for how they handle tasks with time limits.

Answer 2

If I understand your concept correctly, I would suggest a hybrid of 1 & 3, where:

• first the window appears before starting the countdown -- clock static @ 25:00.
• This will also have a button with the message "Minimize to System Tray" for the user to do the minimizing himself. This will make him aware of its presence and location thereafter.
• The clock will start the countdown ONLY after it is safely in the system tray.

Answer 3

I like 3, and I think people would get used to it. In the days before W95, we used to have animated icons, and it was not a problem.

The downside - with both of these - is that some people - like me - have the taskbar to autohide. This would mean it was not visible. I would suggest there might have to be another option of making it a small task-bar-like display that sits on the bottom of the screen, and can be moved left or right. This would mean that I can move it out of the way easily, but most of the time I would hope it is fine.

It seems that there is very little interaction you need with it - start, restart, close. You might be able to get these on a menu without making the icon any larger, meaning that you only need this layout.