生成AIを活用した燃費管理自動化Webアプリケーション

概要

給油レシートやODOメーターの画像をAI（Gemini API）で解析し、手入力なしで燃費計算と記録を完結させるWebアプリケーションです。ライダーやドライバーがガソリンスタンドで抱える「記録の手間」を、画像1枚のアップロードだけで解決します。

開発の背景と課題

自身の二輪車走行において、燃費管理は車両のコンディション把握に不可欠ですが、給油のたびに「走行距離」「給油量」「金額」をメモしたりアプリへ手入力したりするのは非常に面倒な作業でした。この記録をAI技術で自動化し、データ活用をより身近にすることを目的に開発しました。

技術スタックとアーキテクチャ

フロントエンドからAPI層までNext.jsで構築し、認証やDBにはBaaSを活用して開発スピードと信頼性を両立しています。

フロントエンド/バックエンド: Next.js (App Router), TypeScript
データベース/ストレージ: Supabase (PostgreSQL)
認証: Clerk
AI: Gemini 2.5 Flash API
スタイリング: Tailwind CSS

技術的な工夫

マルチモーダル解析の精度向上

ガソリンスタンドによってレシートの形式は千差万別であり、また夜間の給油ではメーター画像が不鮮明になる課題がありました。これを解決するため、Gemini APIへのプロンプトエンジニアリングを最適化し、画像から「どの数値が何を指すか」を構造化データ（JSON）として確実に抽出するパーサーロジックを実装しました。

提供価値・ユーザー体験

「撮るだけ」のUX: ユーザーは写真をアップロードするだけで、解析からDB保存まで数秒で完了します。
可視化ダッシュボード: 記録されたデータに基づき、燃費の推移や月間のガソリン代をグラフで即座に把握できます。

成果・運用状況・今後の展望

現在、自分自身の給油記録ツールとして実際に運用しており、Vercel上で公開中です。今後は、複数車両の管理機能や、ガソリン単価の地域傾向を分析する機能の追加を検討しています。