For quite some time, I've been unsatisfied with the built-in timers on both Android and iOS; especially for workouts, when I needed to set up a configurable number of series with rest periods in between. That's when I started thinking about building something myself. It was just a timer and I said to myself "how hard could it be?", I had no idea.
The first iteration of the project worked "just fine", but the UI was an eyesore (even more than it is now), and the UX was quite awful as well. As you can probably guess, I'm not versed in design or front-end development. In fact, my last real experience with front-end work was back when jQuery was still a thing.
However, I knew what I wanted to build, and over the last few days (and with the help of the infamous AI) I was able to wrap up the project for my needs. It required quite a lot of "hand holding" and "back and forth", but it helped me smooth out the rough edges and provided great suggestions about the latest ES6 features.
The project is, as the title states, an offline-first PWA with zero dependencies; no build step, no cookies, no links, no analytics, nothing other than timers. It uses `Web Components` (a really nice feature, in my opinion, though I still don't get why we can't easily inherit styles from the global scope) and `localStorage` to save timers between uses.
I'd appreciate any comments or suggestions, since I just want to keep learning new things.
Like erikrthoff suggested, I'd drop the light mode toggle and just go with prefers-color-scheme. Then I'd move the X buttons to the top-right of their respective sections (timers, segments), and move the Add Timer button underneath.
Mockup: https://i.imgur.com/EcSHX7S.png
I'll try to implement these UI changes tonight.
I'm not sure how well this will work on a mobile; the service worker might be stopped after a few hours, particularly with the screen off overnight
Will research what is the thinnest "wrapper" I can use to avoid maintaining 3 different apps.
Also zero analytics and all that other stuff: https://timer.bryanhogan.com/
:fist-bump:
Thanks!
One small suggestion that might be a fun addition for a power user: keyboard shortcuts. Being able to hit Spacebar to start/stop the most recently active timer, or N to focus the "Add Timer" input field would be a great little UX enhancement.
Great job getting this out there!
Thats the only explanation I have to explain the dire state of the built in timers on iphones and the free apps available on the app store. And no, I’m not going to pay $$$ per month for the premium apps.
And don’t even get me started on the PITA it is to make a web app to do the same (useful for runners) - you would think it would be a simple thing todo? Have a go and let me know if it doesn't break your balls.
It's mostly a "toy app / learning experience" at this point, but I'm glad it may provide even the tiniest bit of value to others.
Sadly on mobile seems to be fairly useless due the OS killing the worker, but I'll try to wrap it in a native app.
You will learn SO MUCH!