PersonalFitness

01

毎日のランニングを記録したくて

チョコザップに通い始めてから毎日ランニングをするようになり、日々の運動を記録するアプリを作りました。シューズの寿命は走行距離400kmほどが目安と聞いたこともきっかけです。自分のシューズでどれくらい走ったかを把握し、買い替えを考える際の参考にしたいと思いました。ランニングの記録とあわせて体重や筋トレも振り返れるようにしています。

02

シューズごとの走行距離を確かめる

ホームの「マイシューズ」からシューズごとの通算距離を確認できます。ランの記録で履いたシューズを選ぶと距離が加算される仕組みです。ウォーク・混合の記録も含めた距離を表示します。

03

スマホで記録して振り返る

スマホアプリのように使うことを想定したWeb・PWA版です。画面下の5つのタブでホーム・記録・分析・履歴・設定を切り替えます。ホームで最新の体重や運動の記録を確認し、黄色い体重カードから入力へ進めます。掲載画面はスマホ表示で撮影しました。体重や運動量はすべて機能説明用のデモデータです。

04

体組成・ラン・筋トレを入力する

記録画面で体組成・ラン・筋トレを切り替えます。体組成は体重を基本にしています。体脂肪率と筋肉量は測定したときだけ追加できます。ランは距離と時間、筋トレは種目ごとの重量・回数・セット数を記録します。

05

期間を切り替えて推移を見る

分析画面では7日・30日・90日・全期間から表示期間を選べます。体重・体脂肪率・筋肉量のグラフには日ごとの平均値を表示。期間平均や直前の期間との差も確認できます。

06

カレンダーから記録を見返す

カレンダーで日付を選ぶとその日の体組成と運動をまとめて確認できます。記録がある日は種類別の印で表示。各記録から編集・削除へ進めます。

07

ホーム画面に追加して使う

iPhoneではSafariの共有メニューからホーム画面に追加して使います。一度オンラインで開いたあとはオフラインでも記録できます。記録の保存先は端末のブラウザ内のIndexedDBです。別端末とは自動同期しません。機種変更などに備えて設定からJSONバックアップを書き出せます。Web版からヘルスケアや時計の記録を直接読み取る機能はありません。

使用技術

React / TypeScript / Vite / IndexedDB / PWA / Vercel