Rings Journal
development

走った年輪が、動き出した。Growth Rings Timelapse 完成

地図に積み重なってきた「走った年輪」を、時間の流れとともに振り返れるGrowth Rings Timelapseを作りました。何も走っていない地図から、月ごと・年ごとにコースや走破地域が増えていきます。共有動画にも対応し、Runner’s Ringsらしい“走った人生”を動く地図として残せるようになりました。

Runner’s Ringsを作り始めた時から、ずっと大切にしている考えがあります。 「走った記録ではなく、走った人生を残したい。」 1回のランを見るのではなく、これまで走ってきた道を全部地図に重ねていく。 その積み重なりを、木の年輪のように残していく。 それがRunner’s Ringsです。 でも、完成した地図を眺めているうちに、もうひとつ見てみたくなりました。 「この年輪は、どんなふうに育ってきたんだろう?」 そこで作ったのが、 Growth Rings Timelapseです。 何もない地図から始まる タイムラプスは、走行データが何も表示されていない地図から始まります。 そこへ1月、2月、3月……と、走った道が少しずつ加わっていく。 コース表示なら、実際に走った線が増えていきます。 面表示なら、走った市町村や地域が少しずつ広がっていきます。 完成した地図だけでは分からなかった、 「この頃はここばかり走っていたな」 「この月から行動範囲が広がったな」 そんな変化まで見えるようになりました。 ところが、共有動画にしたら簡単ではなかった 画面上でタイムラプスを再生するところまでは、比較的うまくいきました。 問題は、その動きを動画として保存・共有することでした。 最初に作った動画をiPhoneで確認すると…… コースが消えている。 背景の地図は映っているのに、肝心の走った線がありません。 さらに、 ・上下の余白が大きい ・地図の縮尺が画面と違う ・動画の最初が黒い ・SNSで見るには少し物足りない 次々と問題が出てきました。 チャッピーと相談しながら、ひとつずつ原因を追いました。 画面で見えている地図をそのまま撮影する方法をやめ、共有動画では地図とGPSコースを別々にCanvasへ描画する方式へ変更。 すると、ようやくコースが動画に残りました。 「見せたい地図」を、そのまま動画に 縮尺についても考え直しました。 Runner’s Rings側が勝手に「見やすそうな範囲」を決めるのではなく、 ユーザーが地図で見せたい場所・縮尺を決める。 その中心位置と縮尺を、そのまま共有動画に使う仕様にしました。 「この街を見せたい」 「自分が一番走っているエリアを大きく見せたい」 そんな使い方ができます。 共有動画のサイズも、SNSで見やすい4:5の縦型にしました。 そして、少しだけ“映える”ように 機能として完成した動画を見ながら、また思いました。 「もう少しだけ、ワクワクする感じにできないかな?」 そこで追加したのが、新しい年輪の発光演出です。 月が進み、新しいコースが加わった瞬間。 その道だけが一瞬、ピンクからイエローへ光ります。 面表示でも、新しく走破した地域が一瞬輝きます。 その後は通常の表示に戻り、次の年輪が加わる。 派手な動画エフェクトではありません。 でも、 「今、ここに新しい年輪が刻まれた」 ということが分かる演出になりました。 走った距離ではなく、積み重ねた時間を見る 10km走った。 月間200km走った。 自己ベストを更新した。 ランニングには、たくさんの数字があります。 もちろん、それも大切です。 でもRunner’s Ringsで残したいのは、それだけではありません。 毎日のランで少しずつ増えていった道。 初めて走った街。 何度も通った道。 ケガをして走れなかった時期。 また走り始めた時。 それら全部が積み重なって、ひとつの地図になります。 Growth Rings Timelapseは、その地図を完成形だけで見るのではなく、 「どう育ってきたのか」まで振り返る機能です。 Runner’s Ringsは、まだ成長途中のアプリです。 そして今回も、 「あったら面白そう」 というところから始まり、 動かして、 失敗して、 直して、 また動かして。 チャッピーと何度も相談しながら形になりました。 走った道が増えていくように、Runner’s Rings自身にも少しずつ年輪が増えています。 次にどんな年輪が加わるのか。 作っている本人も楽しみです。 Map the life you run. 走った人生を、地図に。
Journal一覧へ戻る