時刻表を見ずに駅に行ったら、タッチの差で電車に乗れなかった。
駅に着いたらちょうど電車が来てる状況、よくあるんです。色々理由があります。乗換案内アプリを立ち上げるのが面倒、一本逃しても阪神間なので５〜10分で次の電車が来る、そもそも時間に余裕を持って家を出てるしという気の緩み。
といっても、ホームについて30秒くらいで電車が滑り込んでくるようなタイミングで駅に着きたい。あと何分かわかると歩くペースも調整できる。
ということで、簡単な時刻表アプリを作ってみました。
次の電車が来るまでの待ち時間で基本系は出来上がりました。ちょっとしたWebアプリなら電車に乗っている時にできてしまいます。
なんならこの記事を書きている方が時間がかかっているかも。
便利な世の中です。
要件定義
ここ1年の土曜日の行動パターンはほぼ電車移動となりました。
万博の影響でakippaの激安駐車場の値段が高騰し、土日は今でも割高なまま。
- 取得する時刻表
- 朝の通勤時間帯は大阪方面
- 夕方以降は神戸方面
現在時刻を取得してカウントダウン。
iPhoneではローカルのHTMLファイルを開けないので、Cloudeアプリのアーチファクト使って動作確認を行い、うまく行ったらVercelにデプロイして運用予定。
ChatGPTで時刻表データを取得
Claudeはデータ使用容量が厳しめ。分散するために、検索やデータ取得はChatGPTに任せることが多いです。
Claudeアプリでエンジンを作成
Cloudeのデザインスキル「frontend-design」が自動的に適応されて、めちゃくちゃシンプルだけどおしゃれで、機能的なアプリができました。
自宅に近い駅はマスクさせていただいています。
バス停の時刻表を追加したら、バスのアイコンにしてくれました。
まとめ
仕事場が複数あるような自由業の手間を減らすアプリを作成しました。乗換案内アプリよりも手軽に自分の使う路線の時刻表をチェックできます。
決まった事業所にお勤めの方なら、毎日乗る電車が決まっているでしょうから、不要なアプリかもですが、自分にとって小回りのきく作業環境を作れるバイブコーディング最高！というお話でした。
