読者です 読者をやめる 読者になる 読者になる

bonar note

京都のエンジニア bonar の技術的なことや技術的でない日常のブログです。

PaceSlider - 片手でペース計算

ランニングをしていて、以下のように思う事はありませんか?

  • ハーフマラソンを1時間45分で走るには、どれくらいのペースで走ればいいんだろう
  • 6'30/km のペースで 100マイルのレースを走ったらどれくらいのタイムになるだろう
  • ゴールまであと 20km、制限時間が3時間 ということは、必要なペースはいくつだろう

なかなか厄介な計算です。こういう計算をしたい事が結構あるのですが、なかなか暗算出来るようにならないので、JavaScript で計算機を作りました。以下から使用可能です。

http://app.bonar.jp/

f:id:bonar:20131119213623p:plain

f:id:bonar:20131119213625p:plain

まず距離を選択して、スライダーを動かします。するとペースと時間が連動して変化します。
あとは自分が目指すペースやタイムまでスライドして行くだけです。キロメートルとマイルの両方に対応し、1km〜160km までの任意の距離を設定可能です。

スライダーを左右の端にくっつけると時間とともにペースが増減する、っていうのが工夫したポイントです。iPhone 5 でしか動作確認していないので、他の端末だと何かおかしいかもしれません。

ペース計算機は巷に色々ありますが、入力フォームが多かったり、少しずつずらして調節する、というのがやりにくい UI になっている事が多いです。ペースの計算は「速さ/時間/距離」の三項の関係性ですが、PaceSlider では「速さと時間をいじって距離を調節する」という部分を切り捨てて簡素化したという点が特徴です。僕のユースケースではそれは必要なかったからです。「自分が使えればいい」と考えると気楽ですね。

たったこれだけのものでも、UI 等を自分なりに考えて作るのは意外と時間がかかるものです。
が、逆に基本的な部分は良いパーツが既にあるのでだいぶ楽ですね。UI は boottrap を使ってますし、ファイルは S3 に置いています。
本当に楽ですね。良い時代です。