Custom faces on Versa 4

[3ric.de]

Huhu @All,

can I build a custom watch face for the Versa 4?  

I only found this ( https://dev.fitbit.com/getting-started/ ) discription for the old "fitbit"s.

Kind regards,

Eric

[Gondwana]

It's not officially supported. Some people have had limited success using a beta SDK. Search here and/or in the Fitbit dev Discord.

[3ric.de]

I created this post because I couldn't find anything in the forum either.

However, you can see many custom faces from other manufacturers in the fitbit app.

[3ric.de]

For example:

  

[Gondwana]

Here's a link to something. I've never used it.

Fitbit automatically made some third-party clockfaces available for the newer watches when they came out.

[3ric.de]

Thank you for help, but this website looks like the way to create a custome "app" not a clockface for the watch.

And i don't understand your other text sry.
If there are "third-party" clockfaces, there has to be a way to be a third-party provider, right?

Because there are also clockfaces directly from fitbit.

 

[Gondwana]

I suspect the linked hack would work for creating a clockface if "app" were changed to "clockface" in package.json.

I don't think the existence of precedents in the gallery is relevant to your situation.

[Guy_]

Hi @3ric.de - have a look at the tip given here it may get you somewhere near what you want for personal use.

[My1xT]

I can confirm it does. I have made something, and am in progress to check if I can open source it.

[merijo · Accepted solution]

It works. I just successfully installed 2 of my watchfaces on my Versa 4 without any code changes.

As in the getting started guide: npx create-fitbit-app myclockface
Then I deleted everything in myclockface except the node_modules folder and copied my Versa 3 project into it instead and edited the package.json with:

"devDependencies": {
"@fitbit/sdk": "~6.2.0-pre.1",
"@fitbit/sdk-cli": "~1.8.0-pre.10"
}

and

"buildTargets": [
"rhea",
"hera"
]

Then I ran npm install on the folder. Then npx fitbit and build.
No errors. Uploaded the .fba to GAM as a private clock face, installed it on the Versa 4. Works.

So the takaway is: create your watchface for the Versa 3 / Sense 1, this way you can use the simulator and debug/test it. Then edit the package.json, npm install and build for the Versa 4 / Sense 2. I think one member here found a way to somehow use the developer bridge with the Versa 4 but it looked to complicated to set up for me.

Btw: Apps work too, even with a Companion app. I managed to build Terry Yuen's Barcodes app the same way (only needed to fix one import). His code is on GitHub. I can now store (loyalty card) barcodes on my Versa 4 via the Fitbit app.

[My1xT]

little side note, you can quick note you can drop rhea or hera as a build target if you wanna save time on building while debugging with your watch, rhea being the sense 2 and hera being the versa 4.

but may I ask if uploading to the GAM change anything? like I never uploaded it and had no problem installing the clockface I made

[merijo]

I haven't tried sideloading with the Versa 4 yet (just got it 2 days ago) but I might try cmengler's approach later.

GAM or sideloading:
With the Versa 3 the difference was that with a sideloaded watch face you couldn't change the watch face on the watch, you had to uninstall the sideloaded one first before you could use a different watch face. If you upload the watch face to GAM and install it via private link and app, it is treated like any normal watch face and you can easily switch between yours and the other installed watch faces directly on the watch.

[My1xT]

Oh that genius. I noticed that the app was throwing weird errors when i was
trying to change the watchface, so i guess I'll try it at home.

Also double neat is likely that i could share the built file so people can
straight load it into their GAM without needing to setup a debug
environment.

[merijo]

You cannot simply share this one .fba with others, as it contains a unique appID that can only be uploaded within your GAM project. So that you or someone else can upload the build in a new GAM project, you have to define a new appID in the package.json, otherwise there will be an error when uploading that the ID is already in use.

But you can easily share your private link to your watchface, which you can copy in your GAM project. Anyone with the link can install it directly from there.

[My1xT]

sadly uploading to GAM doesnt work for me. using 6.2.0-pre.1 as SDK ver it doesnt recognize hera as a build target and using 7.1.0-pre.0 throws in a star in the deviceapi and companionapi parts of the manifest, which GAM rejects

[Gondwana]

Try 8.2.0 and 3.3.0. I've never needed to enter those myself, so no guarantees.

[merijo]

That is strange. My two watchfaces and the Barcodes app with the companion work with SDK ~6.2.0-pre.1.
When does the error appear that the build targets are not recognized? During build or sideloading or when uploading to GAM? Does the app run without errors with 6.1.0 or 6.0.0 for Versa 3 / Sense 1 in the Simulator?

I may be repeating myself but you never know 😄
I really didn't do anything other than what's in my post above. The projects ran flawlessly in the simulator for the Versa 3. Then I created a new project for each via npx create-fitbit-app. I removed everything except the node_modules subfolder from the new project folders and copied my Versa 3 project data into it, then changed the package.json to the data from the post above, switched to the project folder via console and ran npm install. Then switched to the fitbit shell via npx fitbit and executed build. I uploaded the fbas to GAM without any problems and the installation links were green on my Versa 4.

You could try just modifying the empty example watch face that is created when you run npx create-fitbit-app. So just customize the package.json, run npm install in the folder and upload the fba of the example watch face to GAM. Does the error then also occur? If not, it is probably due to something in your watch face, if yes, then idk 😐

My node version is v14.12.3, don't know if that matters.

[Guy_]

@My1xT - I had that too, try making a new GAM project or adding an older watch first, making sure you get the right clock or app definition on create.

[My1xT]

found the issue.

delete this if you fork the versa 4 sample project, then it doesnt set star anymore.

"enableProposedAPI": true

[merijo]

Now I actually got the same error when I tried to upload a build of Christian Mengler's Spotify HR app to GAM. Your advice to remove "enableProposedAPI": true solved it. Thanks!