MapsPG
Web application that estimates fuel costs across multiple driving routes before navigation.
Next.js · React · Tailwind CSS · Google Maps APIs
MapsPG lets drivers see estimated fuel costs across routes before they start navigating. I defined the product, designed the user flow and MVP, and built the application — including a fuel-cost engine from route distance, vehicle MPG, and live gas prices — iterating with Cursor.
Overview
MapsPG is a web app for comparing estimated fuel costs across driving routes before navigation starts. I took it from concept through product definition, design, and a working build.
Problem
Route pickers show time and distance. They don't show what the drive will cost in fuel. MapsPG is for drivers who want that number before they choose a path.
Approach
I defined the product requirements, user flows, and MVP scope, then prioritized features against technical feasibility and UX. Competitive analysis helped keep the first version focused on one job: estimate fuel cost across routes, clearly.
Technical implementation
I built MapsPG in Next.js and React, using Google Maps APIs for routing and places. The fuel-cost engine combines route distance, vehicle MPG, and real-time gas prices. I prototyped and iterated with Cursor.