Fuelio

Inspiration

For many people, especially in underserved communities, a car is not a luxury. It is how you get to work, school, medical appointments, and essential services that are not always reachable by reliable transit. When gas prices swing day to day, that volatility becomes a real barrier for low-income drivers who have less flexibility to wait for a better day or drive farther to find a cheaper station.

We built Fuelio to reduce that barrier by making fuel decisions more predictable and affordable. Instead of only showing today’s price, Fuelio uses real-time data and forecasting to help drivers avoid overpaying, so transportation costs are easier to manage for everyday essential trips.

What it does

Fuelio is a smart assistant for fuel savings. It goes beyond listing prices by answering the key question: Should I fill up now or wait?

• Smart Forecasting: analyzes price trends to estimate whether gas will be cheaper soon
• Real Time Map: visualizes gas stations across Ontario with colour-coded price indicators (green for cheaper, red for higher)
• Trip Calculator: estimates how much a trip will cost based on your specific vehicle
• Personalized Advice: uses AI to give tailored recommendations based on driving habits and local market trends

Trip cost is estimated using:

$$ \text{TripCost}=\left(\frac{d}{100}\right)\times r \times p $$

Where

• $d$ is trip distance in km
• $r$ is fuel consumption in L per 100 km
• $p$ is price per liter

How we built it

• Frontend: built with React and Vite, styled with Tailwind CSS and Shadcn UI
• Backend: a FastAPI (Python) server handling data processing and API requests
• Data Intelligence: real-time fuel data integration using pyfuelprices.py to fetch live fuel information
• Google Maps Platform: Maps JavaScript API for interactive visualization, routing, and geolocation
• AI Power: Google Cloud Vertex AI to generate clear recommendations

Challenges we ran into

One of our biggest hurdles was getting live gas prices for the entire province without hitting API rate limits or slowing down the UI. We initially tried fetching everything at once, which crashed our map. We overcame this by implementing a geo-hashing strategy, where the backend only fetches and caches station data for the specific viewport the user is looking at, reducing API calls while keeping data fresh.

Accomplishments that we're proud of

We are proud that we delivered a clean, modern interface that makes it quick to find the information drivers actually care about. Map updates are fast, and search results load quickly, which helps users make decisions without delay. Most importantly, we included genuinely helpful features, not just a list of prices. With forecasting, trip cost estimates, and AI-powered recommendations, Fuelio provides clear guidance that drivers can use right away when deciding where and when to fill up.

What we learned

• How to connect a data-heavy backend to a simple, user-friendly frontend without slowing the app down
• How to use Google Maps with custom layers for station visualization, routing, and location-based search
• How to turn raw trends into clear decisions by combining forecasting signals with AI-generated explanations

What's next for Fuelio

In the future, we would like to package Fuelio into a dedicated mobile experience so drivers can use it quickly while on the go, with faster access to nearby stations, and saved vehicle profiles all in one place. We also plan to add a voice-driven chat option so users can speak to the app to enter vehicle details, trips, or preferences, improving usability for people with disabilities who cannot easily use their hands.

Built With

• fastapi
• gemini
• google-maps
• python
• react
• shadcn-ui
• sqlite
• tailwind-css
• typescript
• vertex-ai
• vite