Inspiration
Reporting an issue to the City of Ottawa can be a lengthy and frustrating process. Users are often required to provide information that may not be necessary to identify or prioritize an issue, and even after submission, reports can take time to reach the right authority.
We saw an opportunity to rethink this process. What if reporting a problem could be as simple as taking a picture?
That idea became the foundation of our project. We wanted to remove unnecessary steps, automate the information that could be collected automatically, and create a simple, interactive interface that allows users to report issues quickly while ensuring the right information reaches the appropriate authority.
What It Does
The platform allows users to upload a picture of an infrastructure issue along with their location. Using Google Gemini and Tiger Data, the system analyzes the report, identifies and categorizes the issue, and determines its level of importance and priority. The report is then directed to the appropriate municipal authority for review and action.
How we built it
We divided the development process into four main parts: frontend, backend, interface, and authorization. We used AI agents to help develop each part of the code, then followed up by debugging errors, testing failed implementations, and integrating full-stack authentication. We then added useful features to the base application and refined the frontend and user interface to improve functionality, usability, and overall polish.
Challenges We Ran Into
Time management, scope creep, optimization, authentication requirements, and full-stack integration were some of our biggest challenges. Balancing these requirements while learning unfamiliar technologies placed challenges on both individual team members and the team as a whole.
Accomplishments We're Proud Of
Our biggest accomplishment was building and successfully integrating a full-stack system with a polished user interface. The application runs with minimal lag, provides smooth graphics and interactions, and is supported by a reliable backend structure. We also tested the complete system in real-world conditions using actual infrastructure photos, giving us confidence that our solution works beyond the development environment.
What We Learned
Through the hackathon, we developed practical skills in:
- GitHub collaboration: using repositories, managing code changes, and working on different parts of the project as a team.
- Frontend development: building web pages with HTML, CSS, and JavaScript and connecting UI elements to application data.
- UI design: creating dashboards, report views, navigation, and interactive status controls for municipal employees.
- Backend development: understanding how a Node.js/Express backend handles API requests, processes data, and communicates with the database.
- Full-stack integration: connecting the frontend, backend, database, AI services, and authentication into one working system.
- Authentication: understanding how Auth0 and access tokens can protect backend operations.
- Team communication: learning how to divide responsibilities, accommodate different approaches, compromise, and coordinate changes without breaking the overall system.
What's next for Fix My Street
Our next step is to move Fix My Street from our fully integrated prototype into a publicly accessible application. After successfully testing the complete workflow with real infrastructure photos, we can focus on deploying the system, improving scalability, and preparing it for use by municipalities and communities.
Log in or sign up for Devpost to join the conversation.