Get started With the Fitbit Software Development Kit (SDK), you can quickly create apps and clock faces for the Fitbit Ionic™ (currently the only device compatible with applications created with the Fitbit SDK).
What You’ll Need
Before you get started, you'll need the following to develop apps or clock faces with the Fitbit SDK:
- Fitbit user account. Sign up here.
- Fitbit Ionic smartwatch.
- The latest Fitbit OS 1.1 firmware (see below).
- The latest Fitbit mobile application for Android, iOS or Windows Phone, paired with your Fitbit Ionic.
- A computer with access to Fitbit Studio.
- A wireless network to provide the Fitbit Ionic a connection to the internet.
Before You Begin
After accepting the platform terms of service, you should be able to access the Developer menu within the Fitbit mobile app, and the Developer Bridge menu on your Fitbit device.
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 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 on our device.
Before we can install, we need to enable the Developer Bridge on our device.
On the watch, go to Settings and tap Developer Bridge, then wait until it says Connected to Server.
NOTE: The first connection attempt can take up to 20 seconds before it's fully established, but subsequent attempts should be instantaneous.
Now your device is connected to the developer bridge, 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 on your device:
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.
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.
If you're still struggling you can seek help within our developer community.
Congratulations on completing your first Fitbit clock face! Now head on over to our tutorials, guides and reference documentation to learn more. For information about which content is acceptable in the Fitbit App Gallery, please review the Fitbit App Gallery Guidelines.