-
-
Main page not logged in
-
Map
-
Detailed Map
-
Developer sign up page
-
Developer view
Inspiration
We are computer science students in a world that values skills but gives us few chances to prove ourselves. Not only is this a struggle with the rise of AI, but frequently, developers build applications with interactions made in their favour, often struggling with echo chambers and not in the favour of users. We want to build meaningful applications custom to people who want them, forming a stronger and closer connection with them, so we made Build & Connect.
We really liked the idea behind Zocdoc, which is an American platform that takes your information and connects you with doctors local to your area best suited to help you. As such, we built our platform with physical location in mind, allowing developers, both near and remote, with relevant skills to access and be open to such opportunities.
We also liked the idea behind Behance, which is a platform made for designers and hirers to connect with each other for graphic design. In particular, we liked its portfolio demonstration, so we incorporated a "reputation system", where built applications would be evaluated and reviewed by those they connected with, and as such, allows employers to see proof of the skills developers built, rather than the idea of "fake it until you make it." This way, employers/hirers will have confidence in the developer's skills, granting them a reputation and a way forward towards more opportunities in the industry.
What it does
Our application bridges the gap to make connections between varying communities and developers. It does this by having community members post requests, detailing tasks that they want built. They can be quickly filled in and made for local volunteers, or be more detailed, such as being filled in through voice input (ElevenLabs), or manually filling out the task at hand. For the latter two, there are more specifications, such as weekly time commitment, expected deadlines, volunteering or paid work/budget, what tech stack, and specific locations. We have a map of the Calgary area, with requests being displayed on the map, allowing for easy access to view existing opportunities and see what the community wants.
On the developer side, developers can add their portfolio to their profile, add skills and specifications that they have, and link to their Google and GitHub. As well, they have access to a chat, allowing them to exchange messages with the requester. There is also an evaluation system where the skills they fill in, their available time commitments, and what they want to learn, this information is matched to relevant opportunities as we expect developers to want opportunities to learn new things or develop skills they have. When the developers build and submit their solutions, they are evaluated by the requesters, creating a strong connection between them and offering a method of validation to any aspiring hirers/employers.
How we built it
We first spent around 2-3 hours developing a clear plan of action. During this time, we solidified our idea, which prompt we will follow, and our overall plans and schedule. We wrote down our user flow, inspirations, the idea of a reputation system, website sketches, and all the tech stack that we need. It was during this time that we consulted mentors about our idea, who enjoyed it and gave amazing feedback. Following additional changes from the feedback, we started developing. We created and utilized an agentic workflow, following specific prompt methodologies, allowing us to quickly create the project structure, and relevant files, allowing us to develop large amounts of code, while letting us review code, dispute merge conflicts, and draw and animate our assets and doing UI design simultaneously without disturbing or delaying the development process.
Challenges we ran into
The bulk of our challenges came to fixing issues of deployment. Most of the merge conflicts were resolved without issue, following our strong coding conventions and designated tasks to different team members. While the agentic workflow was strong, it also took time to perfect and execute actions. Rather than waiting around, however, we turned this into a strength, allowing us to develop other parts of the program, design, and draw assets, get food, and rest in between actions.
Accomplishments that we're proud of
We're proud of our application! We went in depth into utilizing the map from MapBox, our matching system, the ElevenLabs voices, deployment on Cloudflare, the overall UX design, and having support for IOS on our phones! Our backend is constructed on Convex, which allows for real-time data processing and enables requests and other communications to be sent and received quickly, which created a smooth interaction system for all parties. The scope of what we've done and how polished we made it was a testament to our perseverance and commitment to an idea we all believe in.
What we learned
From this hackathon, we learned a lot about integrating an AI workflow into our normal development plan and utilizing it effectively. We also discovered a lot about how to use ElevenLabs and create UX designs that match our branding and promote our ideas of connection, quick backend communications (Convex), and how to create a suitable matching system.
What's next for FN97AY-ms-dwellers-Build & Connect
The current implementation uses Tailwind, which is soon to be deprecated in the industry. As such, we will be moving Build & Connect off of Tailwind to regular CSS.
We also want to continue developing the iOS app, as it would allow for easy access whenever individuals have requests for builds, such as when they encounter problems in their daily lives. This also allows for implementation of our app in public and low-income areas, such as schools and libraries, to give them a voice without needing to own a device themselves. By making our application accessible, we can have a stronger connection between developers and the community.
Built With
- betterauth
- cloudflare
- convex
- css
- elevenlabs
- gemini
- hono
- mapbox
- playwright
- react
- tailwind
- vinext
- wispr
