Inspiration
As a homeowner who struggled to plan a fence installation—wading through material specs, conflicting permit info, and unorganized contractor quotes—I wanted to create a tool that removes the guesswork. Every neighbor I talked to had similar frustrations, so I set out to build a one-stop solution for residential fence planning.
What it does
The Fence Planning Tool streamlines fence projects: users compare 5 core fence materials (wood, vinyl, metal, composite, chain link) on key attributes, calculate real-time costs based on length/height/gates, check local regulations via location input, find rated local contractors, visualize designs in a yard context, and export a consolidated summary report.
How we built it
I started by mapping user workflows (e.g., cost calculation logic: $Total = (Length × Material Cost × Height Multiplier) + Labor + (Gates × Gate Cost) + Hardware) and designing a responsive UI with React/Bootstrap. I integrated Google Maps API for location validation, Chart.js for cost charts, and PDFKit for report exports. Firebase stored contractor data, with PostgreSQL for regulatory checklists.
Challenges we ran into
Calibrating accurate cost multipliers for different materials/regions required cross-referencing local supplier pricing—no two areas had identical labor rates. Restricting design visualization to realistic material/color combinations also proved tricky, as did limiting comparisons to 3 materials without breaking the UI flow.
Accomplishments that we're proud of
The tool’s real-time cost calculator updates instantly with user inputs, and the design visualization delivers realistic yard previews. We also built a seamless contractor comparison feature that filters by location/rating—something users consistently said they needed.
What we learned
I deepened my understanding of location-based API integration and responsive design for both mobile/desktop. More importantly, I learned to prioritize user constraints (e.g., 10ft minimum fence length) to build intuitive error handling that guides users instead of frustrating them.
What's next for this project
We plan to add regional material pricing updates (via local supplier APIs), expand contractor quote request functionality, and introduce basic 2D design sharing (e.g., to HOA boards). We’ll also refine the visualization to include more yard customization (e.g., terrain, existing landscaping) for even more realistic previews.
Log in or sign up for Devpost to join the conversation.