GTR4とGTS4迷いに迷って、GTS4を購入しました。
ウォッチフェイスを自作するにあたって、早々に「あ…GTRがよかったかも」などとちょっぴり後悔しつつも、作成がかなり楽しくできたので、記事書いてみようかなと思った次第です。
このGWでまとまった時間がとれたので、ちまちまと作ってみました。
ウォッチフェイスカスタマイズしたいですよね。
ダウンロードできるものは、表示が多く個々のパーツが小さすぎて見にくくなってたりと、かゆいところに手が届かなかったりします。
まずは、作成にあたっての環境
- iPhone または Android
- Windows または Mac
- 画像編集ソフト（透過PNGが扱えればOK）
組み立ては下記の公式サイトでノーコードでウェブブラウザ上でできます。
https://watchface.zepp.com/
アクセスするとログインを求められますので、スマホのZEPPアプリと同じログイン情報を入力でログインできました。
ログインすると、画像のような表示になります。
① 作成するウォッチフェイスの名前
※後から変更可能です
② 作成するサイズ
プルダウンでサイズを選ぶと、その下のSupported Device 部分が変更になります。
GTS3 GTS4は390*450でした。
テンプレートはどうもGTRのしかないようでした。GTRのほうが人気なのかしらん？
マニュアル読まない派の自分は、テンプレートや見本になるデータがあると、わかりやすいのになぁと思いましたが、なかったです。
ちなみに、公式マニュアルは英語ですがあります。
上部にある HELPボタン を押すとマニュアルが表示されます。（もちろん読まずに作った）
Googleページ翻訳使えばなんとなくわかるかもです。
では、組み立てていきます。
私の場合は、最初に画像編集ソフトでデザインをつくっておいて、サイズ感を調整しながら、各パーツを個別にPNGで書き出して組み立てていく方法で作成しました。
① Backgroundを選択
② 選択できていない場合は選択します
③ ＋ マークをクリックでファイル選択。
あらかじめ画像編集ソフトで作成したバックグラウンドを取り込みます。
取り込んだ後はこんな感じです。
パーツ取り込みは何度でもやり直せるので、位置決め用のグリッドのついた画像などを取り込んで作成していくのもいいかもしれません。
① TimeのプルダウンメニューからPointer Timeを選択（アナログ表示）
② 左の部分にPointer Timeの詳細を設定するメニューが出ます。まずはHour Hand（短針）にチェックを入れます。
③ ＋ マークをクリックでファイル選択。
あらかじめ画像編集ソフトで作成した短針の画像を取り込みます。
④ ここで座標の細かい位置が必要となってきます。
作成した短針画像は50×360pxで、丸い外側の文字盤の大きさが360φですので合わせました。上の画像の青いラインが画像のサイズです。
横幅50pxはもう少し小さくても構いませんが、影などつけたりしたいと後で思った時にサイズ変更などせずに済むように大きめに作成するのがいいかもしれません。
Watch Face Center of Rotation（ウォッチフェイスの回転の中心）
390×450の真ん中はX：195、Y：225となります。
真ん中に配置しない場合は、計算して動かしてください。
Pointer Center of Rotation（ポインタの回転中心）
短針画像に対してのことを言っているので、50×360pxの中心は、X：25、Y：180となります。
Center View Coordinates（センタービュー座標）
これは何を指してるのかわからなかったですが、ウォッチフェイスの回転の中心と同じ数値をいれています。
短針と同様に、Minute Hand（長針）、Second Hand（秒針）も進めます。
これでアナログ時計部分は完成になります。
ブラウザ固まったりしたら面倒ですので、作業中こまめにSave（保存）をお勧めします。
① DateのプルダウンからWeekを選択。
② 今回作ったのは、画像を使っての表示ですので、imageのチェックを入れます。
③ Upload Imageボタンを押し、あらかじめ画像編集ソフトで作成した画像を取り込みます。
月曜日始まりだったので、月曜日の画像ファイルからアップロードしてください。
④ ここでも座標の入力が必要です。画像の左上を表示させたい座標にします。
真ん中の文字盤の上にマウスカーソルをもっていくと、右下の方に座標が表示されますので参考にするといいかもしれません。
⑤ 7枚の画像をアップロードした後、Week Previewのプルダウンメニューで合ってるか確認可能です。
この辺りまで来ると、説明なくてもだいたいいじれるようになってくるとは思います。
Dateメニューより、Date選択。
まずはMonthから、Display MethodのプルダウンをImage選択。
EnglishThumbnailの下のUpload Imageボタンを押し画像を登録していきます。今回は月ですので12枚…
Coordinatesに表示させたい位置の座標を入力。
Digital SliceでUse New Sliceをチェック
Upload Imageの下のUpload Imageボタンを押し、0番から画像を登録していきます。
Coordinatesに表示させたい位置の画像左上の座標を入力。
これで、うまいこと2桁で表示されました。
Alignmentで左揃え、右揃えが設定できます。
バッテリー表示
Systemメニューより、Battery Level選択、こちらもイメージで作成したので、Image Progressをチェック、右のメニューのDisplay Methodで、Single Display選択。
Upload Imageで残量表示の少ない画像からアップロード。10段階です。
Coordinatesに表示させたい位置の画像左上の座標を入力。
いよいよ、ZEPPアプリ経由でスマートフォンへデータを転送します。
- ZEPPアプリを立ち上げ、プロフィールをタップ
- 一番下の設定をタップ
- バージョン情報をタップ
- ZEPPのアイコンを7回タップすると開発者モードが有効になるので、確認ボタンを押す。
- プロフィールまで戻り、マイデバイスタップ
- 一番下の開発者モードタップ
- 右上の＋マークタップ
- Scanメニューが出るのでタップカメラモードに切り替わる
Saveボタンの右のハンバーガー（三）メニューからRun on Deviceを選択、すると非常にわかりにくいのですが、Action Progressという文字が表示され、少し待つとQRコードが表示されます。
スマホのZEPPアプリのScanから、QRコードを読み込めば、作成したデータがZEPPアプリに取り込まれます。
※QRコードの書き出しが少し不安定なのかもしれません、時間がすごくかかったり、スッっといったりでした。
取り込まれたら後はInstallを押すだけで、Amazfitへ転送されます。
いいモノができたら是非一般公開を！
WatchFaceMakerの上部メニュー中ほどにある、Upload for Approvalボタンを押して登録し、承認されればマイデバイスの部分もウォッチフェイスが表示されるようになります。
また、他の方にもダウンロードしてもらえるようにもなりますよ。
今回のは申請から約1週間くらいで承認がおりました。
まだ使ってみてないパーツなどもあるので、時間あるときにまたちょこちょこ作っていきたいなと思います。
ポチップ
コメント