I Built a Study Timer to Improve My Focus

Published 10-13-2024

I recently built a Pomodoro / Study app called Tomatillo Timer. It’s free to use, free of ads, and doesn’t require login.

My main objective was to add features that would help me improve my ability to focus with every study session. First, an explanation of pomodoro if you’re not familiar with the technique.

What is the Pomodoro Technique

Pomodoro is type of tomato and a popular productivity technique. It can be useful for people who may get overwhelmed, procrastinate, or struggle to concentrate. The gist is managing time into 25 minute study sessions, followed by 5 minute break sessions, and after 3-4 sessions taking a 15 minute break.

Tomatillo is also a type of tomato. Tomatillo timer is an app that implements a highly configurable version of the pomodoro technique and attempts to increase its effectiveness by combining it with other study techniques.

Tomatillo Features

I plan to write about these features (and how I use them) in greater detail in separate posts. For now, here is a quick synopsis:

  • Syncs music to study sessions: To avoid context switching and going to sites like YouTube that may lead to distractions. Tomatillo auto plays study and break music in sync with the timer.
  • Built-in To-do List: Write to-do lists and select an active to-do that’s displayed on the main screen. This allows you to focus on one task without being overwhelmed by the whole list.
  • Built-in Journal: An open text editor creates a space for jotting down quick notes, logging distractions to get back on track, and getting distracting thoughts “out of your head”.
  • Highly configurable: Adjust time, auto-play, number-of-sessions, music, and more; to fit your energy levels, tasks, and mood.

“The key to cultivating focus has two parts: external and internal. External means changing your environment to make focus easier and more productive. Internal means changing your habits, behavior and thought patterns to increase focus.”

Each time I study, I try to push the boundary of how long I can focus even while bored, agitated, or demotivated. Instead of distracting myself when I feel bad, I lean on these features to stay on task for the amount of time remaining.

The Technical Side

Tomatillo Timer is a web-app powered a few technologies:

  • Svelte 5: A front-end web framework. Version 5 is currently in developer preview. I’ve really enjoyed working with runes in particular.
  • Valibot: A light-weight Typescript schema library. The majority of logic in the app is contained within Valibot schemas.
  • Pico CSS: A minimal CSS framework. It styles native HTML elements so that everything looks nice and is responsive by default.
  • Tiptap: A Javascript based editor. It powers the Journal screen.
  • YouTube & Spotify Iframe APIs: The YouTube & Spotify players are powered by their respective Iframe APIs.
  • Vercel: A hosting platform.

Retrospective

Overall, I was happy with this stack. - Svelte 5 is polarizing because of it’s syntax changes. But, in my opinion, a noticeable improvement over Svelte 3 and 4. Valibot is currently one of my favorite libraries. It makes the process of adding a new configuration so simple and prevents potential bugs.

This was my first time using Pico CSS. Making a responsive application with it is practically effortless. I would use it again for that reason alone. Tiptap is another library I had never used before. I was surprised at how easy it was to setup and did what I wanted out of the box. My biggest gripe about the Iframe APIs is that you can’t control the volume of the Spotify player via the API. For a music app, this seems like a huge oversight.

Conclusion

Hopefully you find Tomatillo Timer useful! If you’d like to join other study, note-taking, and tech enthusiast; I’m trying to build a Discord channel for studying, learning, and productivity.

Lastly, I’m trying to build an ecosystem of learning tools. Flotes is a Markdown note-taking application built for learning. I often use these two apps in tandem to take notes and study efficiently.

Sun Oct 13 2024