What You’ll Need
Before you get started, you'll need the following prerequisites to develop apps or clock faces with the Fitbit SDK:
- Fitbit user account. Sign up here.
- A Fitbit OS device, or the Fitbit OS Simulator for Windows or macOS.
- The latest Fitbit mobile application for Android, iOS or Windows Phone, paired with your Fitbit device.
- A computer with access to Fitbit Studio.
- A wireless network to provide the Fitbit device a connection to the internet.
Before You Begin
To create your first project, you can either use the Fitbit OS simulator, or a Fitbit OS device.
Using The Simulator
We provide a device and phone simulator which allows you to build applications and clock faces for Fitbit OS, without the need to purchase a device.
In order to publish your applications in the Fitbit App Gallery, you will need a Fitbit OS device associated with your Fitbit account.
Using a Fitbit OS Device
After accepting the platform terms of service, you should be able to access the Developer menu within the Fitbit mobile app (Your device > Developer), and the Developer Bridge menu on your device (Settings > Developer Bridge).
Note: Fitbit Versa Lite does not currently support the Developer Bridge. You can currently only develop applications for Fitbit Versa Lite using the Fitbit OS Simulator.
Create Your First Project
Login to Fitbit Studio.
NOTE: You must be logged into Fitbit Studio with the same Fitbit account that you're using in the simulator, or on your mobile device.
2. Create a New Project
- Click + New Project.
- Enter a Name for your project.
- Select the Digital Clock project.
- Click Create.
The Digital Clock project contains a minimal clock face that displays the current time on the screen.
We're now almost ready to build and install the clock face.
If you're using the simulator, you just need to launch it and login with your Fitbit account.
If you're using a Fitbit device, you need to enable the Developer Bridge. On the watch, go to Settings and tap Developer Bridge, then wait until it says Connected to Server.
NOTE: WiFi must be configured on the device. The first connection attempt can take up to 20 seconds before it's fully established, but subsequent attempts should be instantaneous.
The simulator or device should now be connected to the developer bridge. Next you need to select it from the devices toolbar within Fitbit Studio. Once you see a green indicator, you can click Run to launch the clock face on your device.
If everything went smoothly, you should see the following clock face:
4. Customize your Clock Face
To customize your clock face with a background image, you will need a .jpg or .png file that is 348x250 pixels in size for Fitbit Ionic, or 300x300 for Fitbit Versa or Fitbit Versa Lite. See the building for multiple devices guide for further information about including images for specific platforms.
Drag and drop your image directly into the resources folder of your project in Fitbit Studio.
Now click on the resources folder, and edit the index.gui file.
Change the SVG to match the code below, where myimage.jpg is the filename of the image you uploaded.
<svg> <image href="myimage.jpg" /> <text id="myLabel"></text> </svg>
If you want to change the size, position or color of the time, just edit the styles.css file in the resources folder.
Press Run and your clock will appear.
If your Fitbit device is unable to connect to the developer bridge, ensure that WiFi is configured correctly, and that you are using the same Fitbit user account on your mobile device, and in Fitbit Studio.
WiFi will not connect if the device has less than 25% battery.
You cannot mix & match the simulator and physical devices. You need to either use the simulator, or use a real device and real phone.
If you're still struggling you can seek help within our developer community.
Building an App
Now you've experienced the steps involved in creating your first clock face, but if you want to build an app, you need to be aware of a few simple differences:
Clock faces cannot use the hardware buttons, but apps can.
You can only have one clock face installed at any time, but you can have multiple apps installed.
To change your current clock face into an app, select the
within Fitbit Studio, then change the
App, and select a
You can now install your app using the Developer Bridge.
If you want to use a custom icon with your app, upload a 80x80 PNG file as
Uninstalling your app
Apps and clocks which have been installed via the Developer Bridge can only be removed using the Developer menu within the Fitbit app on your mobile phone (Your device > Developer > Sideloaded Apps > Your app > Delete application).
If you're interested in building your application for multiple devices, take a look at the multiple devices guide.
If you want to use your preferred code editor and source control system, take a look our Command Line Interface guide for full details.
For information about which content is acceptable in the Fitbit App Gallery, please review the Fitbit App Gallery Guidelines.