2017年3月18日

Apple WatchでSYD MEADなwatchface

Pebbleで作っていたwatchfaceの移行を色々やっています。今回はSYD MEADさんによるTRON用のフォントのwatchfaceを作ってみました。(Pebbleで作った時のアップはこちらです。)下の画像で10:22です。


別バージョン。10:22、03月16日、20秒、です。Pebbleの時は数字の画像をドット絵で作り、プログラミングで時刻に合わせてその画像を表示していたのですが、今回はフォントを起こしたので、もうどんな大きさの文字にしようが、プログラミングの記述も無しで常にアウトライン画像で綺麗に表示されます。素晴らしいー。


Pebbleで作っていた時の画像。もう3年も前ですね。数字の解像度は66x66ドットでしたので粗々でした。(それでもオリジナルなウォッチフェイスを作れるということで満足してましたが。)



以下、今回フォントを起こした手順です。まずはCADソフト(Vellum-Nitrogenを使用してます。)で形状を作ります。このTRONフォントは16分割された正方形とそれに内接する円だけで構成されているので、非常に簡単です。この位ならイラレでもできますが、やはり作図的な作業はCADソフトが早いですね。


で、できた形状をEPSで書き出しイラレに持っていき、


フォント作成アプリ(Glyphsを使用)にコピペしてあとは大きさやスペース具合を整え、


完成したら.otf書き出しをしてフォント化。でそのフォントをXcodeのwatchKitAppにドラッグ&ドロップで使用可能になります。


オリジナルなフォントは初めて作ったのですが、簡単ですね。フォントが起こせるということは1を表示する時に1という数字でなくても何かしらのイラレで作った絵でも良いということになりますので、また表現の幅が広がります。以上、シドミードさんなウォッチフェイスを作ったことのアップでした。