2016年1月29日

新Watchface、DIGIGRADEを作りました。

ずっとスターウォーズなのばかり作ってきたので、ここでオリジナルデザインなウオッチフェイスを作ってみました。デジタルとレトログラードなアナログ針(針が回転でなく円弧運動で時刻表示をする方式)で時刻を表示するウオッチフェイスです。DIGITALとRETROGRADEの合体でDIGIGRADE(デジグラード)と命名しました。
上部中央に縦に配列したデジタル表示と、画面の左右で時、分を分けて赤い針で現在時刻を表示しています。画像で9:02です。その他の機能として、曜日、月、日、電池残量(下右の斜めの線で電池残量を表示しています。10%減るごとに斜めの線が1つずつ暗くなります。画像で70%です。)、Bluetoothステイタス表示(Bluetooth接続切れ時とiPhoneの場合はPebble Timeアプリ未起動時もBTマークに赤バツがつきます。)があります。
下記リンクより$1で販売してますので、よろしければお買い求め下さい。PayPalかクレジットカードで購入可能です。(Pebble App Storeには無料お試しバージョンとして時刻表示のみの機能制限をつけたものをアップしています。)



Roundにも対応しています。


白Pebbleだとこんな感じです。

最初はRound対応は考えてなかったのですが、作ってみたら意外といけるので対応させました。初代Pebble対応の白黒バージョンも作っていたのですが、久しぶりに起動した初代PebbleとiPhoneアプリとの連携が上手くいかず、、ちょっと保留状態です。


腕に巻くとこんなです。こういった「何の根拠もない、ただカッコよさげな見栄えのみ」なグラフィックデザインを考えるのって、本業のプロダクトデザインの合間にやるのにちょうど良い気分転換です。


以下ご参考までに。このウォッチフェイスをつくるにあたって、まずはレトログラードな針の動きをProcessingで試作しています。下、地味な絵ですが。これでざっくりプログラミングのメドをつけ、Pebcessing経由でCLOUDPEBBLEでビルドしています。


ついでにフォトショの絵。画面デザインは基本フォトショで作り、絵の状態でジェネレーターサイト経由でPebbleに入れ(プログラミングせず、ざっくり画面の最終表示を実機で見るにはジェネレーターで入れるのがてっとり早いです。)、色味や原寸での見えの確認を繰り返します。(SDK導入もしていたのですが、何故か12inch MacBookでは起動できなくなってしまい、最近はひたすらCLOUDPEBBLEで作っています。)


以上、久々に作った新作オリジナルデザインのwatchfaceのご紹介でした。Pebbleユーザーの皆様、よろしくお願いします!(2016.1.29)

2016.1.30. 追記・・・現状、24時間表示モードだと何故か昼の12:00が00:00と表示されてしまってます。機能的には問題無いのですが、12:00と表示すべきですので、追ってバージョンアップで修正します。お買い上げ頂いた方からお教え頂きました。ありがとうございます。(自分がほとんど12時間表示で使っているので気付きませんでした。すみません。お買い上げ頂いた方はバージョンアップは無料で可能です。)また、12時間モードでの昼の12時はAM 12:00と表示しているのですが、昼はPMな気もするのですが、その場合はPM 00:00と表示するのが正しい様で、どちらでも正しいっぽいのですが、いろいろ調べると海外のAMPM表示はまた国内とは違う様なので、、、面倒なのでAMPM表示は無くすかもしれません。
2016.1.31. 追記・・・先程上記不具合を修正したVer1.1をアップロードしました。お買い上げ頂いた方にはGumroadと念のため私のGmailからもお知らせさせて頂きましたが、何か不具合など御座いましたらご連絡下さい。24時間モード時の昼の12時を12:00と表示する様に修正し、12時間モードではいろいろ調べたのですが、結局とりあえずPM 12:00と表示する様にしました。無料版もアップロードしましたのでAppStoreから再ダウンロードお願い致します。

2016.3.10. 追記・・・最近急にまたダウンロード数が増えてきたと思ったら、App StoreにてWEEKLY PICKSに取り上げて頂いてました。App Storeからはお試し版しかダウンロード出来ないのですが、ありがたいことです。


それにしてもPebbleはアプリの有料対応をするつもりは無いんですかね・・・ユーザーからすれば無料でダウンロードできるのは嬉しいのではありますが、有料アプリ対応をするとwatchfaceだけでももっとデザイン的にも上質なものが出てくると思うんですが。。

2016年1月17日

STAR WARSなwatch face、その2 R2-D2(追記しました。)

STAR WARS、エピソード7見てきました。いやー、良かったですね。エピソード1〜3の時の様な「で、これをエピソード4にどうつじつまを合わせていくんだ?」という余計な心配の無い、純粋に「これからどうなっていくんだ?」というのをSTAR WARSネタであと数年は楽しめるのが嬉しいですね。腕時計好きにとってはエピソード1の時の様な大量なオリジナル腕時計が出ないのが残念ですが、、、その分、最近は自分でSTAR WARSなwatchfaceで作ってみてる次第です。
ということで、今回はR2-D2のwatchfaceを作ってみました。デジタルで時刻、曜日、日にちを表示し、その下の10個の丸はバッテリー残量です。で、その下でR2がレイア姫を投影していた様にアナログ時計を投影しています。これはグレーの背景色ですが、


背景を黒にし、時刻をブルーにしてみました。視認性的にはこちらの方がメリハリがあって見やすいです。アナログ時計には秒針を追加しました。


昔買ったR2とのツーショット。R2は少し前傾させたかったところですが、粗い解像度でジャギっぽくなるのでやめました。


以上、さくっと作った割にはなかなか良い感じに仕上がったR2のwatchfaceでした。

2016.1.17. 追記・・・やはりどうもR2が前傾していないのが気に入らなかったので、非常に面倒だったのですが、修正しました。


修正途中のフォトショの画面と。結局ドット絵のR2はほとんど描き直してます。64色のみ(グレーは2色しかない)+微妙な傾きはまた難しいですね。。ドット絵職人の方に弟子入りしたいです。秒針は電池消費を抑える為、廃止しました。


で、ついでに画像差し替えで娘の描いた絵でも作ってみました。ジャワ族がR2を捕まえた時の絵で、ジャワ族は「ソノマー」と言ってるらしいですw


以上、R2なWatchfaceのその後、でした。

2016年1月11日

STAR WARSのX-Wingの照準の様なwatchface

エピソード7を観る前にエピソード4、5、6と見返した時に作りたくなったwatchfaceです。エピソード4の最後、デススターを攻撃するXウイングの照準器風なwatchfaceです。


70年代らしい、非常にシンプルなワイヤーフレームなCGなので、これ風なのはすぐにProcessing経由のPebcessingで作れるだろうと思い、まずはProcessingでとりかかったのですが、、


これが意外と上手く作れず・・・結局今回もhikoLabさんに多大なご協力を頂きました。いつもありがとうございます!!
ということで、とりあえず常時アニメ表示状態のものは完成しました。

まずはオリジナルに近いバージョン。オリジナルのカウントダウンしてる風な表示を時刻表示にしました。縦長のPebbleでは肝心のアニメ部分が小さくなってしまうので、、


時刻表示部分を下に下げ、アニメ部分を目一杯広げたバージョン。ちなみに数字のフォントもオリジナルで起こしてます。


で、どうせならということで、フルスクリーンバージョン。この位の方がありがたみがあります。


で、動画の方が雰囲気が伝わるので、撮影しました。Pebbleでの再現はかなりもっさりした動きになってしまうかと思ったのですが、意外といけます。もうちょっと早くしてもいけそうです。


肝心のターゲットに到着した時のアニメ(最後につきあたりの壁が表示され、中央を向いた赤い4つの矢印がピピピッと表示)の再現、ですが・・・面倒なのでしません。ひたすらループで同じアニメを表示するか、赤い線がセンターに到着する前に「Use the Force, Luke.」と出してループを切ろうかと思います。と言いますか、そもそも現状のアニメ常時表示では電池が数時間で無くなってしまうので、時計として成り立ってないので、以前に作ったコスモレーダーの時と同じ様に、腕を振ったら数秒アニメの表示をする、という風にしようと、今さらに手を加えている状態です。
以上、新たに作ってるスターウォーズなwatchfaceのご紹介でした。進捗あったらまたここにアップします。

2016.1.17. 追記・・・腕を振るとアニメがスタートし、途中でオビワンに「Use the Force, Luke.」と言われアニメがストップする、というのを作ってみました。これも動画を撮りましたので、どうぞ。



しかし、何故かアニメのスピードがやたら遅くなってしまってますので、修正しようと思うのですが、、、どうも原因が分からず現状このままです。。で、とりあえず静止画も撮ったのでアップしておきます。

まずは通常状態。9時24分、15日です。


手を振った状態。アニメがスタートし、赤い線が徐々に中央にきます。日にち表示は秒表示に切り替わります。



赤い線が中央に到達する前にUse the Force, Luke. と出てアニメが終了します。


以上、X-Wingなwatchfaceの続報でした。

2016.4.17. 追記・・・こちらに再生速度をアップし、電池残量表示を追加した完成版をアップしました。

2016年1月1日

あけましておめでとうございます。

あけましておめでとうございます。本年も当ブログをよろしくお願い致します。ということで、今年の私の年賀状です。


猿年ってネタ的にツライですね。モンキーってことで、シーモンキーを飼える腕時計をネタに、iPhoneアプリのPERSTEXTで文字を入れて10分程で作ったのですが(最近は自分の年賀状よりも娘の年賀状作りの手伝いの方がはるかに時間がかかってます。。)、今思えばこんなスターウォーズな年なのでウーキーなチューバッカネタにすればよかったなぁ、と思います。
で、このシーモンキー時計、久しぶりに出したらブリスターパックの透明部分が大分黄色くなってしまっており、残念。。

下ははるか昔、約15年前にアップした画像より。(当時のまま放置状態なページはこちら)こんな綺麗だったんですね。


時計部のアップ。当時こんなドーム型の腕時計がいっぱい出ていた気がします。



で、話は変わって、下は昨年のインスタグラムにアップした画像のうち、いいねの数の多かったトップ9カットです。まぁ、想定通りではありますが、Pebbleネタばかりでしたね。


今年もこんなPebbleな話題がメインかと思われますが、当ブログを引き続きよろしくお願い致します。