Claude AIに頼んでバイクや各パーツの走行距離を把握できるようにアプリっぽいのを作ってもらった

自転車に乗ってると、地味に気になるのが「チェーンっていつ交換したっけ」「タイヤってどのくらい使ったっけ」問題。Numberとかエクセルで管理してる人も多いと思うけど、正直面倒で続かない。

そこでダメ元でClaudeに「ロードバイクでその日乗ったら距離数を入力して、走行距離だけじゃなくパーツの使用距離も計測・可視化できるアプリ作れる?」って聞いてみたら、まさかの一発OK。しかもClaude Codeとか別の開発環境を用意する必要もなく、チャットの中だけで完結した。

作ってもらったのはアプリではなく、ブラウザで開くだけで動く、WEBページ

タイトルにも書いた「アプリ(ではないから…)」問題。技術的にはこれ、Claudeのアーティファクトという機能で作られたWebページ。ブラウザで開くだけで動く、独立したミニアプリのようなもの。

App StoreからインストールするタイプのアプリではないけどWebアプリとしてはちゃんと機能する、「Claudeに作ってもらったミニアプリ(Webツール)」みたいな感じかと思います。

iPhoneのトップ画面にアプリのアイコンのように追加する方法

iPhoneではSafariのWebサイトをホーム画面にアプリのようなアイコンとして追加できます。

1. Safariで追加したいWebサイトを開く
2. 画面下の 「共有」ボタン（□＋↑） をタップ
3. 下にスクロールして 「ホーム画面に追加」 をタップ
4. 表示される名前を好きな名前に変更
5. **「追加」**をタップ

これで、iPhoneのホーム画面にそのサイトのアイコンが表示されます。

アプリの中身・できること

作ってもらったのは、大きく分けてこの3つの機能を持つツール。

1. 走行距離の記録:乗った日付と距離(km)を入力するだけで、総走行距離・走行回数・今月の走行距離が自動で集計される
2. パーツごとの使用距離管理:チェーンやタイヤなど、消耗品として管理したいパーツを登録すると、装着日以降のライド距離が自動で積算され、交換目安の距離に近づくとバーが赤く表示される
3. 複数バイクの管理:バイクを複数台持っている場合、タブで切り替えてそれぞれ独立に記録できる。全バイク合わせた総走行距離も見れる

ホーム画面はこんな感じ(上の画面)。総走行距離がドンと表示されて、その下でその日のライドをサクッと記録できる。

こんな感じでパーツの追加や走行距離がわかる。

使い方

1. 日付と距離を入力して「追加」をタップ → 走行記録が積み上がっていく
2. 「+パーツ追加」からチェーンやタイヤなどを登録。装着日と交換目安の距離(km)を入れておく
3. 使用距離が交換目安に近づくと、パーツのバーが自動で赤く変わる(上のパーツ一覧の画像がまさにその状態)
4. パーツを交換したら「今日交換した」をタップ → 使用距離がリセットされ、それまでの使用履歴は残る
5. バイクを複数持ってる場合は、上部のタブで切り替えるだけ

データはブラウザ内(localStorage)に保存される仕組みなので、サーバーに情報を送ることもなく、Claudeアカウントも不要。リンクを共有すれば、友達もそれぞれ自分のデータを記録できます。

特に計測したかったパーツ

パーツ管理機能を作ってもらうにあたって、自分の中で「これは絶対に距離で追いたい」と思っていたのが次の3つです。

タイヤ
摩耗もパンクリスクも距離に比例し、案外限界まで乗ってるパターンが多いパーツ。特に摩耗インジケータ？がないタイプのタイヤだといつ交換すれば良いかわからないので走行距離が分かると交換の判断材料になる。

チェーン
注油のタイミングと、交換の目安になる走行距離の両方を追いたいパーツ。最近の12速チェーンは意外と丈夫で、体感的には10,000km近く乗れてしまう印象がある。とはいえ「なんとなくまだいけそう」で放置して伸びきったチェーンでスプロケットまで傷めるのは避けたいので、数字で管理できる意味は大きい。

ホイール(ハブ)
自分が使っているのはMavicのID360ハブを採用したホイールなんだけど、これが地味にクセモノ。だいたい1,000kmくらいでグリスアップしないと、ハブの中身が錆びてラチェット部分が摩耗し、最悪使い物にならなくなる。タイヤやチェーンに比べて圧倒的にメンテナンス周期が短いのに、見た目では劣化がわかりにくいパーツなので、「気づいたら手遅れ」になりがちなんだよね。だからこそ、走行距離ベースで機械的にアラートが出る仕組みがあると本当に助かる(上のパーツ一覧の画像の「ホイール」がまさにそのイメージ)。

こうやって並べてみると、パーツごとに寿命の単位が全然違う(1,000km・3,000km・10,000km)のがよくわかる。これを頭の中だけで管理するのはやっぱり無理があって、パーツごとに個別の交換目安を設定して自動で計算してくれる今回の仕組みは、まさに欲しかったやつだった。

データの保存について

データは端末のブラウザに保存される模様。機種変更やブラウザの初期化をした場合などはデータが消えてしまう。

また、iPhoneだと

iPhoneの「設定」→「Safari」→「サイト越えトラッキングを防ぐ」

ここをオンにしているとどうやらデータ登録後に再度読み込ませた時に初期化されて登録した項目や走行距離などが0になってしまう。

今の所解決策としては「サイト越えトラッキングを防ぐ」をオフにするか、やや面倒だけれども毎回バックアップをとり、開いた時にバックアップから読み込みをしてデータを記録したらまたバックアップをとる・・・・というやり方がいいと思います。

Claud AIに作ってもらった流れ

最初はシンプルに”走行距離やパーツの使用距離を計算することができるアプリっぽいのを作って”とお願いしたら、その場でリンクが発行された。そこから会話しながら、

• 使い方や注意点をまとめた「使い方」ページを追加してもらったり
• データが消えたときのために、バックアップ(書き出し・読み込み)機能をつけてもらったり
• バイクを複数台持ってる人向けに、バイクごとにタブを切り替えて管理できるようにしてもらったり

と、思いついたことをその都度リクエストするだけで、どんどんアップデートされていった。専門知識ゼロでも、会話ベースでここまで作れるのはちょっと感動した。

★いいと思ったこと

• タイヤやチェーンの注油・交換タイミングがわかって便利。 「なんとなく」で管理してたパーツの寿命が、走行距離ベースで数字として見えるようになったのが一番の収穫。目安の距離に近づくとバーが赤く表示されるので、感覚じゃなくてちゃんとデータで交換時期を判断できるようになった。特にMavicのID360ハブみたいな、周期が短くて見た目にはわかりにくいパーツこそ、この仕組みのありがたみを感じる。

まとめ

ということでよければ使ってみてください。自分でClaude AIにお願いすれば同じようなものを作ることもできると思います。

それでは！