2015年01月06日

【番外編】Glyphsによるフォントでアナログ時計を表現する。

DTP作業者にとっての難易度 ?????
clock.png

年末年始に少し時間があったのでGlyphsでアナログ時計を作ってみました。完成したものは[http://mars517.web.fc2.com/clock/clock_glyphs.html]でご覧いただけます(当ページ下部でhtmlファイルを含むデータ一式をダウンロードしていただくことも可能です)。webページではJavaScriptで「00:00:00 a.m.」などといったデジタル時計を用意しておき、Glyphsによる自作フォントをWebフォントとして適用。秒針は1秒おきに6度、分針は10秒ごとに1度、時針は2分ごとに1度進みます。

※今回も大曲さんに教えていただきながら完成にこぎつけることができました。ありがとうございました。完成までの過程についてはFacebookの「Glyphs日本支部」(https://www.facebook.com/groups/1464028557152286/)をご覧ください。

※もうちょっとカッコイイデザインの時計はこちら(http://mars517.web.fc2.com/clock/clock0222b.html)にアップしています



データの内容については動画をご覧ください。

動画内では触れていませんでしたが、針のデザインを変えたい時は「hr」「min」「sec」という3つのグリフを変更するだけです。これらの基本グリフを「コンポーネント」という機能により各グリフに割り当て、回転しています。

今回の内容はDTPとは関係ありませんが、Glyphsの一歩踏み込んだ使い方を考えるには良い機会だったと思います。ご興味のある方は、ぜひ一度Glyphsに触れてみてはいかがでしょうか。

※体験版は公式サイト(http://www.glyphsapp.com/)からダウンロードできます。

大曲さんのページ(http://tosche.net/2012/11/glyphsapp_j.html)では動画でGlyphsの使い方を分かりやすく解説しています。


サンプルデータはこちら《2015minmum0106b.zip》です。

サンプルデータ内のフォントの使用については以下のように考えています。
【改変】可 【再配布・複製】可 【商用利用】可 【利用報告】必要なし

※不具合などについては保証いたしかねます。

posted by 照山裕爾 at 20:12| Comment(0) | TrackBack(0) | Glyphs | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント: [必須入力]


この記事へのトラックバック