スマートウォッチ fitbitの時計の文字盤でイイのが無かったので制作しようとして挫折したがfitfaceというサービスで一応作成出来たが…

スマートウォッチ fitbit sense

時計の文字盤でイイのが無かったので…。
色々調べてたら結構簡単作成出来るみたい。アプリと違って中身はJavaScriptとCSSで書かれていると！
作る前に使っていた文字盤は下記のやつ。
CD Breathe
https://gallery.fitbit.com/details/4d2207fa-24c2-415e-b990-9c303e028793
無料で使える。でもフォントが…システムフォントのみね。
なのでフォントと文字詰めがイマイチ…。
あ、有料の文字盤もあって作成者にはお金が入ります。
で、さらに色々調べてたら…。私のやりたい事はちょっと難易度高い模様。
エンジニアの人のブログなど読むと簡単！って書いてあるけど。
私のやりたかったのはデジタル表示でのフォントと文字詰めです。
fitbitの文字盤（clock face）のギャラリーとか見てみるとありとあらゆる文字盤があって面白いのですが。
なんというか…エンジニア視点で…腕時計の文字盤のデザインとしての美しさを追求してるのは無いっぽい印象。
そもそもデフォルトで用意されているシステムフォントが数種類でどれもションボリなので、結局画像で文字を作らないといけない。
この辺はGitHubにfitbitの画像フォントをコントロール出来るライブラリがありますが挫折…。
Webベースでコードを書きます。シミュレータをDLして起動。Webとシミュレータをリンクさせるとシミュレータで起動できます。
心拍数やGPSなどもシミュレート出来ます。
で、さらに色々調べていたらfitfaceというサービスでGUIベースでブラウザ画面で文字盤を制作出来るサイトがあるので使って制作してみました。
（でもフォントと文字詰めは挫折…）
GUIで文字盤が作成出来るWebサービス
fitface
https://fitface.xyz/
作ったものを売り買いも出来る。
変数やtagは下記に。
https://docs.fitface.xyz/designer/tags/
ここに心拍数や電池の残り％、現在の歩数、目標の歩数などの変数も用意されています。
この辺の変数を駆使すると下記の作成した画面のように目標の何％まで各健康スコア等が達成しているのかなど表示できます。
ftibitで「fitface」の文字盤を入れてfitfaceのギャラリーの中から文字盤を選択する、という仕組みになっています。
GUIベースでの作成画面は下記の様な感じ。

このfitfaceでも歩数や心拍数など変数はfibitのシミュレータよりは細かくないですがエミュレートできます。
出来たのが下記。微妙に色々な位置がズレてるんですが…。

この辺は再度修正する予定