I recently was given a Fitbit Versa. As a former Pebble user I was excited to see what Fitbit was up to with their new smart watch. Almost immediately I went to the app store to see what was there, I found a few fun apps to help me track things, but one app was missing… a presentation clock. This app might not be useful to everyone but it is an app I wanted.

A presentation clock is basically a timer that includes changes in colors at regular intervals to help you at a glance, or even out of the corner of your eye, know how you are doing on time. I use one on my phone to help with practicing presentations, tracking time when running discussions, and when taking breaks from school work or other activities to get a sense of when I need to wrap up.

About this time I came across Fitbit Studio. This is a newer tool by Fitbit to help people make apps for the Ionic and Versa smart watches. They have template projects to help you understand how to APIs work and it integrates with a simulator and your phone app and watch to test your code. So I dove in.

How Do you Start?

To start, head over to Fitbit Studio and you can get started with a new template project immediately. Here are a few important resources:

Fitbit SDK Guide and Documentation: https://dev.fitbit.com/build/guides/

Fitbit SDK Message Board: https://community.fitbit.com/t5/SDK-Development/bd-p/sdk

Fitbit Icons: https://github.com/Fitbit/sdk-design-assets

Using these resources I went from not knowing much of anything about the Fitbit SDK or API and only knowing a tiny bit about JavaScript to making this app. It really is impressive just how well this system works. I will warn you not all of the APIs have been fully documented, but it is ready to go if you want to experiment with your own app or watch face.

My App

I finished the v0.1 of my app recently and while it is not a final product it works! I you want to check out the code it is here. At this time it is not available on the app store, but I am looking into submitting the app soon.

https://github.com/AllenJFuller/WatchPresentationClock

This project appealed to me because it was both an app I wanted to use and something that had a limited scope. To complete this project I did not have to deal with third party APIs or memory management (at least in the current version). It was a great way to push myself just beyond my comfort zone. If the project had been much bigger it would have been easy to move on to something else.

How it works

Basically you just launch the app and you see this:

The default time is 10 minutes. The gear in the upper left lets you change to one of the preset times as seen here.

Once ready you hit the bottom right button (on the screen or the physical button) to start and stop the timer. The upper right resets to the current starting timer value. As time counts down the background changes from green to yellow (peach technically) to red as seen in the screenshots below.

At this time the color changes to yellow at less than 50% time remaining and to red at less than 25% time remaining. In the future I would like to make this a setting, but for the purposes of this project the preset percents was enough.

Once time is up the app displays “Finished!” and vibrates. Using the timer start/stop button or the reset button will reset the timer and let you start again.

Next Steps

I started on this project with the goal of making an app that worked on my watch that I could share via GitHub to show my process and learning. Moving forward, I am not sure how much time I will have to develop this further but here are the things I know I want to work on:

Add tumblers to set the overall time and the yellow and red times (to replace the current settings screen).
Reformat to work with Ionic (the settings screen does not fit currently).
Make a real app icon.
Add single vibrations at color changes.
Implement the storage option to save the last selected timer length on relaunch (currently defaults to 10 minutes on each launch).

From there I do want to point out that this app has to be active to work, so the screen has to stay on while in use, making this app a battery hog. So if you are timing pasta, use the built-in timer, but if you want the benefit of a color giving you a sense of the time left then this app might be the app for you.